From 318e92afd770c868890155589bf52a9cdd99cb08 Mon Sep 17 00:00:00 2001 From: Daryl Hedley Date: Wed, 28 May 2014 11:21:43 +0100 Subject: [PATCH] Revert 7d990a7..8a48d5a This rolls back to commit 7d990a72d2861168d502847faa49e0dafc2678f7. --- assets/transparency-dark.png | Bin 925 -> 0 bytes assets/transparency-light.png | Bin 926 -> 0 bytes js/vanilla.js | 5 - less/article.less | 31 --- less/block.less | 20 -- less/buttons.less | 69 ------- less/component.less | 29 --- less/drawer.less | 41 ---- less/fonts.less | 46 ----- less/icons.less | 13 +- less/layout.less | 14 -- less/loading.less | 15 -- less/navigation.less | 27 --- less/notify.less | 134 ------------- less/page.less | 16 -- less/responsive.less | 29 --- less/theme.less | 239 ++++++++++++++++++++-- less/variables.less | 330 ++++--------------------------- package.json | 2 +- templates/article.hbs | 4 +- templates/block.hbs | 8 +- templates/drawer.hbs | 10 - templates/drawerItem.hbs | 8 - templates/navigation.hbs | 5 +- templates/notify.hbs | 52 ----- templates/notifyPush.hbs | 15 -- templates/page.hbs | 4 +- templates/partials/buttons.hbs | 20 -- templates/partials/component.hbs | 21 -- 29 files changed, 270 insertions(+), 937 deletions(-) delete mode 100644 assets/transparency-dark.png delete mode 100644 assets/transparency-light.png delete mode 100644 less/article.less delete mode 100644 less/block.less delete mode 100644 less/buttons.less delete mode 100644 less/component.less delete mode 100644 less/drawer.less delete mode 100644 less/fonts.less delete mode 100644 less/layout.less delete mode 100644 less/loading.less delete mode 100644 less/navigation.less delete mode 100644 less/notify.less delete mode 100644 less/page.less delete mode 100644 less/responsive.less delete mode 100644 templates/drawer.hbs delete mode 100644 templates/drawerItem.hbs delete mode 100644 templates/notify.hbs delete mode 100644 templates/notifyPush.hbs delete mode 100644 templates/partials/buttons.hbs delete mode 100644 templates/partials/component.hbs diff --git a/assets/transparency-dark.png b/assets/transparency-dark.png deleted file mode 100644 index 5c9faf9b11eacefad35deaf94998db4f71d2a0e3..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 925 zcmaJ=O^?z*7_Ko5z^tL}n z|A2{l*o#+B#y{a-aE7I<2eD~8GjE>fc|Yf>*L{6_bb2HR!m)Sh1Z=&-zX$i&|H-54 zE4DnQ?vVD$gs#FI39Xon5%AJ*iUJhI>v!K#QxNVxO$I|c^xwdUq*BN+QkiCqEeOqv zG7F#Tlg;l;zcGC9QOc{{NwAx>rjhmctR~c;QD5NAG5VEMM*qaebiW$j3yKjPLei$W~8=h|&z7IWI&=5z+ zb8L}mNJ$dIhNc@<-L))5F;&&o8nMS9ryDi<)%!=!fXqh5RD{g$tZ5`zDVMsIP z*+F^o9>txUq+pvgOb*9#eo$}6jSt7tILMV*FfwoLU#+f8Y<~E5Ke+6$AAN+`yytAN q@t4IZyA&s$(;Ae&#-q{b=gGs7AY2RIf{#D$^9$p-UFXxQ(T6{AC>Xc^ diff --git a/assets/transparency-light.png b/assets/transparency-light.png deleted file mode 100644 index 827a9d3f3ed905ef051678bbeb1735f3dd8012f6..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 926 zcmaJ=O^ee&7>*W17ZybDpcjX%h=R>$lWm5^r8cP>Fr~Bwdo)d^ZRjQwCsUjDAmVK= z{uJ@#Wf3o4{0sgGuiolRx9NJYh9ood@;uM`Ip^KZi^GHa2ZA6RdZ$j0t=IT>^9K7r zxcmK_E%&H9qULYFX^$f{*oTtm~U3{lOODGiEhnje)4 z4$4CkXEeqs;EKTri4NH0@JvYl+2Z_C6ACKo{_tCGS~DuKTLe`u2I&^hg)t9bt@ zoDY^6l6xq}a}u(~jgPpi47LagC?*4p&&n!xrJV7ZfxzQEZ+{@*| zkYvoWgGl@qMQwr;ut^%m`(x4f>TS8v{#a^zxiSkz=B@p!)uoBe58v(vmmPMak5V@8 vgb((ekJs6yxa~R3LGg3+d%a%2doNUkTNjnDkEAc3`Hk`1j`QjH>koebhAJ8p diff --git a/js/vanilla.js b/js/vanilla.js index 4dcda6f5..e69de29b 100644 --- a/js/vanilla.js +++ b/js/vanilla.js @@ -1,5 +0,0 @@ -define(function(require) { - - var Adapt = require('coreJS/adapt'); - -}); \ No newline at end of file diff --git a/less/article.less b/less/article.less deleted file mode 100644 index b94fb459..00000000 --- a/less/article.less +++ /dev/null @@ -1,31 +0,0 @@ -// Article styling -// =============== - -.article { - background-color:@background-color; - .article-inner { - padding-top:1px; - padding-top: 280px; - background-image: url(assets/backgroundB.jpg); - background-position: top; - background-repeat:no-repeat; - @media all and (max-width:@device-width-medium) { - background-image: url(assets/backgroundB-mobile.jpg); - padding-top: 150px; - } - } - .article-title { - .responsive-layout; - text-align: left; - } - .article-title-inner { - padding:@article-title-padding; - background-color:@background-color; - } - .article-body { - .responsive-layout; - } - .article-body-inner { - padding:@article-body-padding; - } -} \ No newline at end of file diff --git a/less/block.less b/less/block.less deleted file mode 100644 index a1227b04..00000000 --- a/less/block.less +++ /dev/null @@ -1,20 +0,0 @@ -// Block styling -// ============= - -.block { - .responsive-layout; - .block-inner { - padding:0px 20px 40px; - } - .block-title { - text-align:left; - } - .block-title-inner { - padding:@block-title-padding; - } - .block-body{ - } - .block-body-inner { - padding:@block-body-padding; - } -} \ No newline at end of file diff --git a/less/buttons.less b/less/buttons.less deleted file mode 100644 index ea7ba1d5..00000000 --- a/less/buttons.less +++ /dev/null @@ -1,69 +0,0 @@ -// Button styling -// ============== - -.button { - margin-top:@button-margin-top; - margin-bottom:@button-margin-bottom; - background-color:@button-color; - color:@button-text-color; - padding:@button-padding; - text-decoration: none; - display:inline-block; - border:@button-border; - &:hover { - background-color:@button-hover-color; - color:@button-text-hover-color; - } - &.disabled { - background-color:@button-disabled-color; - color:@button-text-disabled-color; - } - - .component-widget & { - &.reset, &.user, &.model { - display:none; - visibility:hidden; - } - } - .component-widget.submitted & { - &.reset { - display:inline-block; - visibility:visible; - } - &.submit { - display:none; - } - } - .component-widget.user & { - &.submit { - display:none; - } - &.model { - display:inline-block; - visibility:visible; - } - &.reset { - display:none; - } - } - .component-widget.model & { - &.submit { - display:none; - } - &.user { - display:inline-block; - visibility:visible; - } - &.reset { - display:none; - } - } - .component-widget.submitted.correct & { - visibility: hidden; - display:none; - &.submit { - display: inline-block; - } - } - -} \ No newline at end of file diff --git a/less/component.less b/less/component.less deleted file mode 100644 index f9286d20..00000000 --- a/less/component.less +++ /dev/null @@ -1,29 +0,0 @@ -// Component styling -// ================= - -.component { - .component-inner{ - } - .component-title{ - margin:@component-title-margin; - } - .component-title-inner { - padding:@component-title-padding; - } - .component-body{ - margin:@component-body-margin; - } - .component-body-inner{ - padding:@component-body-padding; - } - .component-instruction { - margin:@component-instruction-margin; - } - .component-instruction-inner { - padding:@component-instruction-padding; - font-weight:bold; - &.validation-error { - color: @validation-error-text-color; - } - } -} \ No newline at end of file diff --git a/less/drawer.less b/less/drawer.less deleted file mode 100644 index 2cc7529d..00000000 --- a/less/drawer.less +++ /dev/null @@ -1,41 +0,0 @@ -// Drawer styling -// ============== - -.drawer { - background-color:@drawer-color; - color: @drawer-text-color; - .drawer-toolbar { - border-bottom: 1px solid darken(@item-color, 10%); - } - .drawer-toolbar .icon { - padding:@navigation-padding; - @media all and (max-width:(@device-width-small - 1px)) { - padding:@navigation-padding-mobile; - } - color: @drawer-icon-color; - &:hover { - color:@drawer-icon-hover-color; - } - } - .drawer-inner { - border-left: 5px solid darken(@drawer-color, 10%); - } - .drawer-item { - .drawer-item-open { - text-decoration: none; - color: @drawer-item-text-color; - border-bottom: 1px solid darken(@item-color, 10%); - .no-touch &:hover { - color:@drawer-item-text-hover-color; - background-color: @drawer-item-hover-color; - } - } - h5 { - font-size:16px; - font-weight:@font-weight-bold; - } - } - .drawer-item-open { - padding:@drawer-item-padding; - } -} \ No newline at end of file diff --git a/less/fonts.less b/less/fonts.less deleted file mode 100644 index a538e01d..00000000 --- a/less/fonts.less +++ /dev/null @@ -1,46 +0,0 @@ -// Font setup -// ========== - -body { - font-family: @font-family; - font-weight: @font-weight-light; - color:@font-color; - font-size:@font-size; - line-height: (@font-size + @font-extra-line-height); -} - -h1 { - font-size:(@font-size*2.5); - line-height: ((@font-size*2.5) + @font-extra-line-height); - font-weight: @font-weight-light; -} - -h2 { - font-size:(@font-size*2.25); - line-height: ((@font-size*2.25) + @font-extra-line-height); - font-weight: @font-weight-light; -} - -h3 { - font-size:(@font-size*2); - line-height: ((@font-size*2) + @font-extra-line-height); - font-weight: @font-weight-light; -} - -h4 { - font-size:(@font-size*1.75); - line-height: ((@font-size*1.75) + @font-extra-line-height); - font-weight: @font-weight-light; -} - -h5 { - font-size:(@font-size*1.25); - line-height: ((@font-size*1.25) + @font-extra-line-height); - font-weight: @font-weight-light; -} - -h6 { - font-size:(@font-size*1); - line-height: ((@font-size*1) + @font-extra-line-height); - font-weight: @font-weight-light; -} \ No newline at end of file diff --git a/less/icons.less b/less/icons.less index b3b54f59..d6f2208d 100644 --- a/less/icons.less +++ b/less/icons.less @@ -1,6 +1,3 @@ -// Icons -// ===== - @font-face { font-family: 'vanilla'; src:url('fonts/vanilla.eot'); @@ -21,19 +18,11 @@ text-transform: none; line-height: 1; + /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } -.icon { - display:block; - width:@icon-size; - height:@icon-size; - font-size:@icon-size; - text-decoration:none; - color:@foreground-color; -} - .icon-arrow-left:before { content: "\e600"; } diff --git a/less/layout.less b/less/layout.less deleted file mode 100644 index a0ec899d..00000000 --- a/less/layout.less +++ /dev/null @@ -1,14 +0,0 @@ -// Layout -// ====== - -#wrapper { - width:100%; - .ie8 & { - max-width:@ie8-max-width; - margin:0 auto; - } - padding-top:@navigation-height; - @media all and (max-width:(@device-width-medium - 1px)) { - padding-top:@navigation-height-mobile; - } -} \ No newline at end of file diff --git a/less/loading.less b/less/loading.less deleted file mode 100644 index bab6d90b..00000000 --- a/less/loading.less +++ /dev/null @@ -1,15 +0,0 @@ -// Loading overlay styling -// ======================= - -.loading { - text-align: center; - background-color: @transparency; - .no-opacity & { - background-image:@transparency-fallback-png; - } - .loading-image { - background-image: url(assets/ajax-loader.gif); - background-repeat: no-repeat; - background-position: center; - } -} \ No newline at end of file diff --git a/less/navigation.less b/less/navigation.less deleted file mode 100644 index 838cd541..00000000 --- a/less/navigation.less +++ /dev/null @@ -1,27 +0,0 @@ -// Navigation styling -// ================== - -.navigation { - width:100%; - .ie8 & { - max-width:@ie8-max-width; - } - background-color:@navigation-color; - height:@navigation-height; - @media all and (max-width:(@device-width-medium - 1px)) { - height:@navigation-height-mobile; - } - border-bottom:@navigation-border; - .navigation-inner { - } - .icon { - padding:@navigation-padding; - @media all and (max-width:(@device-width-medium - 1px)) { - padding:@navigation-padding-mobile; - } - color:@navigation-icon-color; - .no-touch &:hover { - color:@navigation-icon-hover-color; - } - } -} \ No newline at end of file diff --git a/less/notify.less b/less/notify.less deleted file mode 100644 index ea8692ea..00000000 --- a/less/notify.less +++ /dev/null @@ -1,134 +0,0 @@ -// Notify styling -// ============== - -.notify { - - .notify-popup { - background-color: @notify-color; - color: @notify-text-color; - - a { - outline: none; - text-decoration: none; - } - } - - .notify-type-prompt, .notify-type-alert { - .notify-popup-inner { - padding-top:@notify-popup-padding; - } - } - - .notify-popup-icon { - .icon { - font-size:60px; - width:60px; - height:60px; - color: @notify-icon-color; - } - } - - .notify-popup-buttons { - text-align:center; - margin-top:10px; - } - - .notify-popup-button { - background-color:@notify-button-color; - color:@notify-button-text-color; - padding:@button-padding; - display:inline-block; - .no-touch &:hover { - background-color:darken(@notify-button-hover-color, 10%); - color:@notify-button-text-hover-color; - } - } - - .notify-popup-content { - .responsive-layout - .ie8 & { - max-width: @ie8-max-width; - margin:0 auto; - } - } - - .notify-popup-content-inner { - padding-left:80px; - @media all and (max-width:(@device-width-medium - 1px)) { - padding-left:0px; - } - } - - .notify-popup-inner { - padding: @notify-popup-padding; - } - - .notify-popup-toolbar { - text-align:right; - } - - .notify-popup-done { - padding:@notify-popup-padding; - display:inline-block; - } - - .notify-popup-icon-close { - color: @notify-icon-color; - .no-touch &:hover { - color:@notify-icon-hover-color; - } - } - - .notify-shadow { - .no-opacity & { - background-image:@transparency-fallback-png; - } - background-color: @transparency; - } -} - -.notify-push { - position:fixed; - top:(@navigation-height + 20px); - right:20px; - width:380px; - background-color:@notify-color; - transition:all 0.3s; - opacity:0; - margin-top:-30px; - color:#fff; - z-index:50; - border: 1px solid @notify-text-color; - border-radius:3px; - @media all and (max-width:@device-width-medium) { - width:90%; - max-width:380px; - top:(@navigation-height-mobile + 20px); - right:5%; - } - &.show { - margin-top:0px; - opacity:1; - } -} - -.notify-push-inner { - padding:30px 0px 30px 30px; - margin-right:(30px + @icon-size*2); - cursor: pointer; -} - -.notify-push-close { - display: inline-block; - text-decoration: none; - position:absolute; - right:30px; - top:50%; - margin-top:-(@icon-size/2); - .icon { - .no-touch &:hover { - color:@notify-icon-hover-color; - } - color:@notify-icon-color; - } -} \ No newline at end of file diff --git a/less/page.less b/less/page.less deleted file mode 100644 index b8954eee..00000000 --- a/less/page.less +++ /dev/null @@ -1,16 +0,0 @@ -// Page styling -// ============ - -.page { - background-color:@primary-color; - .page-inner { - } - .page-title { - .responsive-layout; - text-align:center; - color: #fff; - } - .page-title-inner { - padding:@page-title-padding; - } -} \ No newline at end of file diff --git a/less/responsive.less b/less/responsive.less deleted file mode 100644 index 48fce4db..00000000 --- a/less/responsive.less +++ /dev/null @@ -1,29 +0,0 @@ -// Responsive layouts -// ================== - -.responsive-large { - @media all and (min-width:@device-width-large) { - width:@device-width-large; - margin:0 auto; - } -} - -.responsive-medium { - @media all and (max-width:@device-width-medium) and (min-width:(@device-width-small)) { - width:@device-width-small; - margin:0 auto; - } -} - -.responsive-small { - @media all and (max-width:(@device-width-small - 1px)) { - width:100%; - margin:0 auto; - } -} - -.responsive-layout { - .responsive-large; - .responsive-medium; - .responsive-small; -} \ No newline at end of file diff --git a/less/theme.less b/less/theme.less index 55eb3aa0..d1508cd2 100644 --- a/less/theme.less +++ b/less/theme.less @@ -1,47 +1,248 @@ -// Bespoke theme styling -// ===================== +// Variable setup +// ============== -// Custom class to be added to article -// =================================== +.media-sizing { + .responsive-large; + .responsive-medium; + .responsive-small; +} -.image-1 { +.visibility-hidden { + visibility:hidden; +} + +@navigation-height: 60px; +@navigation-height-mobile: 40px; +@navigation-padding: ((@navigation-height - @icon-size)/2); + +// Font setup +// ========== +body { + font-family: @font-family; + font-weight: @font-weight-light; + color:@font-color; + font-size:@font-size; + line-height: (@font-size + @font-line-height-extra); +} + +h1 { + font-size:(@font-size*2.5); + line-height: ((@font-size*2.5) + @font-line-height-extra); + font-weight: @font-weight-light; +} + +h2 { + font-size:(@font-size*2.25); + line-height: ((@font-size*2.25) + @font-line-height-extra); + font-weight: @font-weight-light; +} + +h3 { + font-size:(@font-size*2); + line-height: ((@font-size*2) + @font-line-height-extra); + font-weight: @font-weight-light; +} + +h4 { + font-size:(@font-size*1.75); + line-height: ((@font-size*1.75) + @font-line-height-extra); + font-weight: @font-weight-light; +} + +h5 { + font-size:(@font-size*1.25); + line-height: ((@font-size*1.25) + @font-line-height-extra); + font-weight: @font-weight-light; +} + +h6 { + font-size:(@font-size*1); + line-height: ((@font-size*1) + @font-line-height-extra); + font-weight: @font-weight-light; +} + +// Icon setup +// ========== + +.icon { + display:block; + width:@icon-size; + height:@icon-size; + font-size:@icon-size; + text-decoration:none; + color:@foreground-color; +} + +.navigation { + width:100%; + .ie8 & { + max-width:@ie8-max-width; + } + background-color:@background-color; + height:@navigation-height; + border-bottom:1px solid @primary-color; + .navigation-inner { + padding:@navigation-padding; + } + .icon { + color:@primary-color; + &:hover { + color:darken(@primary-color, 20%); + } + } +} + +#wrapper { + width:100%; + .ie8 & { + max-width:@ie8-max-width; + } + padding-top:@navigation-height; +} + +.page { + background-color:@primary-color; + .page-inner { + } + .page-title { + .media-sizing; + text-align:center; + color: @inverted-foreground-color; + } + .page-title-inner { + padding:@page-title-padding; + } +} + +.article { + background-color:@background-color; .article-inner { padding-top:1px; padding-top: 280px; - background-image: url(assets/backgroundA.jpg); + background-image: url(assets/backgroundB.jpg); background-position: top; background-repeat:no-repeat; @media all and (max-width:700px) { - background-image: url(assets/backgroundA-mobile.jpg); + background-image: url(assets/backgroundB-mobile.jpg); padding-top: 150px; } } + .article-title { + .media-sizing; + text-align: left; + } + .article-title-inner { + padding:@article-title-padding; + background-color:@background-color; + } + .article-body { + .media-sizing; + } + .article-body-inner { + padding:@article-body-padding; + } +} + +.block { + .media-sizing; + .block-inner { + padding:0px 20px 40px; + } + .block-title { + text-align:left; + } + .block-title-inner { + padding:@block-title-padding; + } + .block-body{ + } + .block-body-inner { + padding:@block-body-padding; + } +} + +.component { + .component-inner{ + } + .component-title{ + margin:@title-spacing; + } + .component-title-inner { + } + .component-body{ + margin:@body-spacing; + } + .component-body-inner{ + } +} + + +.buttons { + .button { + background-color:@button-color; + color:@button-text-color; + &:hover { + background-color:@button-hover-color; + color:@button-text-hover-color; + } + &.disabled { + background-color:@button-disabled-color; + color:@button-text-disabled-color; + } + } +} + +// Loading overlay +// =============== + +.loading { + width: 100%; + height: 100%; + position: absolute; + text-align: center; + top: 0; + left: 0; + z-index: 5000; + background-color: rgba(255,255,255,0.8); + .loading-image { + width: 100%; + height: 100px; + position: absolute; + top: 50%; + margin-top: -50px; + background-image: url(assets/ajax-loader.gif); + background-repeat: no-repeat; + background-position: center; + } +} + +// Bespoke theme styling +// ===================== + +// Custom class to be added to article +.image-1 { + .article-title { + background-image: url(assets/backgroundA.jpg); + @media all and (max-width:700px) { + background-image: url(assets/backgroundA-mobile.jpg); + } + } } .image-2 { - .article-inner { - padding-top:1px; - padding-top: 280px; + .article-title { background-image: url(assets/backgroundB.jpg); - background-position: top; - background-repeat:no-repeat; @media all and (max-width:700px) { background-image: url(assets/backgroundB-mobile.jpg); - padding-top: 150px; } } } .image-3 { - .article-inner { - padding-top:1px; - padding-top: 280px; + .article-title { background-image: url(assets/backgroundC.jpg); - background-position: top; - background-repeat:no-repeat; @media all and (max-width:700px) { background-image: url(assets/backgroundC-mobile.jpg); - padding-top: 150px; } } } \ No newline at end of file diff --git a/less/variables.less b/less/variables.less index 399f30f0..2031f905 100644 --- a/less/variables.less +++ b/less/variables.less @@ -1,10 +1,5 @@ -// ========= -// Variables -// ========= - // Main colors // =========== - @primary-color:#3eb4e4; @secondary-color:#1b87b2; @tertiary-color:darken(#1b87b2, 10%); @@ -16,26 +11,9 @@ @inverted-background-color:#3eb4e4; @transparency:rgba(255,255,255,0.8); -@transparency-fallback-png:url('assets/transparency-light.png'); -// ================ -// Validation Error -// ================ - -// Validation Error color -// ====================== - -@validation-error-text-color:#f55; -@validation-error-icon-color:#f55; -@validation-error-border-color:#f55; - -// ========== // Item setup // ========== - -// Item color -// ========== - @item-color:@primary-color; @item-hover-color:@secondary-color; @item-disabled-color:#666; @@ -47,10 +25,6 @@ @item-text-visited-color:#fff; @item-text-selected-color:#fff; - -// Item padding -// ============ - @item-padding-top:10px; @item-padding-right:10px; @item-padding-bottom:10px; @@ -58,29 +32,10 @@ @item-padding:@item-padding-top @item-padding-right @item-padding-bottom @item-padding-left; - -// Item border -// =========== - -@item-border-width:1px; -@item-border-style:solid; -@item-border-color:@primary-color; -@item-border-hover-color:@primary-color; -@item-border-disabled-color:@primary-color; -@item-border-visited-color:@primary-color; -@item-border-selected-color:@primary-color; -@item-border: @item-border-width @item-border-style @item-border-color; - - -// Item spacing -// ============ - @item-spacing:2px; - // Button // ====== - @button-color:#3eb4e4; @button-hover-color:#1b87b2; @button-disabled-color:#ccc; @@ -96,273 +51,66 @@ @button-padding:@button-padding-top @button-padding-right @button-padding-bottom @button-padding-left; -@button-margin-top:10px; -@button-margin-right:0px; -@button-margin-bottom:10px; -@button-margin-left:0px; - -@button-margin:@button-margin-top @button-margin-right @button-margin-bottom @button-margin-left; - - // Border // ====== +@border-width:1px; +@border-style:solid; +@border-color:#c5c5c5; +@border: @border-width @border-style @border-color; -@button-border-width:1px; -@button-border-style:solid; -@button-border-color:#c5c5c5; -@button-border-hover-color:#c5c5c5; -@button-border-disabled-color:#c5c5c5; -@button-border: @button-border-width @button-border-style @button-border-color; - - -// Device widths -// ============= +// Responsive breakpoints +// ====================== +.responsive-large { + @media all and (min-width:1024px) { + width:1024px; + margin:0 auto; + } +} + +.responsive-medium { + @media all and (max-width:760px) and (min-width:520px) { + width:520px; + margin:0 auto; + } +} + +.responsive-small { + @media all and (max-width:519px) { + width:100%; + margin:0 auto; + } +} -@device-width-small: 520px; -@device-width-medium: 760px; -@device-width-large: 1024px; @ie8-max-width:1024px; -// ============== // Global spacing // ============== - -// Title paddings -// ============== - -@menu-title-padding-top:30px; -@menu-title-padding-sides:30px; -@menu-title-padding-bottom:30px; - -@menu-title-padding:@menu-title-padding-top @menu-title-padding-sides @menu-title-padding-bottom; - -@page-title-padding-top:50px; -@page-title-padding-sides:10px; -@page-title-padding-bottom:50px; - -@page-title-padding:@page-title-padding-top @page-title-padding-sides @page-title-padding-bottom; - -@article-title-padding-top:30px; -@article-title-padding-sides:20px; -@article-title-padding-bottom:20px; - -@article-title-padding:@article-title-padding-top @article-title-padding-sides @article-title-padding-bottom; - -@block-title-padding-top:0px; -@block-title-padding-sides:0px; -@block-title-padding-bottom:0px; - -@block-title-padding:@block-title-padding-top @block-title-padding-sides @block-title-padding-bottom; - -@component-title-padding-top:0px; -@component-title-padding-sides:0px; -@component-title-padding-bottom:0px; - -@component-title-padding:@component-title-padding-top @component-title-padding-sides @component-title-padding-bottom; - - -// Title margins -// ============= - -@menu-title-margin-top:30px; -@menu-title-margin-sides:30px; -@menu-title-margin-bottom:30px; - -@menu-title-margin:@menu-title-margin-top @menu-title-margin-sides @menu-title-margin-bottom; - -@page-title-margin-top:10px; -@page-title-margin-sides:10px; -@page-title-margin-bottom:10px; - -@page-title-margin:@page-title-margin-top @page-title-margin-sides @page-title-margin-bottom; - -@article-title-margin-top:10px; -@article-title-margin-sides:10px; -@article-title-margin-bottom:10px; - -@article-title-margin:@article-title-margin-top @article-title-margin-sides @article-title-margin-bottom; - -@block-title-margin-top:0px; -@block-title-margin-sides:0px; -@block-title-margin-bottom:0px; - -@block-title-margin:@block-title-margin-top @block-title-margin-sides @block-title-margin-bottom; - -@component-title-margin-top:30px; -@component-title-margin-sides:0px; -@component-title-margin-bottom:0px; - -@component-title-margin:@component-title-margin-top @component-title-margin-sides @component-title-margin-bottom; - - -// Body paddings -// ============= - -@menu-body-padding-top:30px; -@menu-body-padding-sides:30px; -@menu-body-padding-bottom:0px; - -@menu-body-padding:@menu-body-padding-top @menu-body-padding-sides @menu-body-padding-bottom; - -@page-body-padding-top:10px; -@page-body-padding-sides:10px; -@page-body-padding-bottom:10px; - -@page-body-padding:@page-body-padding-top @page-body-padding-sides @page-body-padding-bottom; - -@article-body-padding-top:10px; -@article-body-padding-sides:20px; -@article-body-padding-bottom:40px; - -@article-body-padding:@article-body-padding-top @article-body-padding-sides @article-body-padding-bottom; - -@block-body-padding-top:0px; -@block-body-padding-sides:0px; -@block-body-padding-bottom:0px; - -@block-body-padding:@block-body-padding-top @block-body-padding-sides @block-body-padding-bottom; - -@component-body-padding-top:0px; -@component-body-padding-sides:0px; -@component-body-padding-bottom:0px; - -@component-body-padding:@component-body-padding-top @component-body-padding-sides @component-body-padding-bottom; - - -// Body margins -// ============ - -@menu-body-margin-top:10px; -@menu-body-margin-sides:10px; -@menu-body-margin-bottom:10px; - -@menu-body-margin:@menu-body-margin-top @menu-body-margin-sides @menu-body-margin-bottom; - -@page-body-margin-top:10px; -@page-body-margin-sides:10px; -@page-body-margin-bottom:10px; - -@page-body-margin:@page-body-margin-top @page-body-margin-sides @page-body-margin-bottom; - -@article-body-margin-top:10px; -@article-body-margin-sides:10px; -@article-body-margin-bottom:10px; - -@article-body-margin:@article-body-margin-top @article-body-margin-sides @article-body-margin-bottom; - -@block-body-margin-top:10px; -@block-body-margin-sides:10px; -@block-body-margin-bottom:10px; - -@block-body-margin:@block-body-margin-top @block-body-margin-sides @block-body-margin-bottom; - -@component-body-margin-top:20px; -@component-body-margin-sides:0px; -@component-body-margin-bottom:20px; - -@component-body-margin:@component-body-margin-top @component-body-margin-sides @component-body-margin-bottom; - - -// Instruction padding -// =================== - -@component-instruction-padding-top:0px; -@component-instruction-padding-sides:0px; -@component-instruction-padding-bottom:0px; - -@component-instruction-padding:@component-instruction-padding-top @component-instruction-padding-sides @component-instruction-padding-bottom; - - -// Instruction margin -// ================== - -@component-instruction-margin-top:0px; -@component-instruction-margin-sides:0px; -@component-instruction-padding-bottom:20px; - -@component-instruction-margin:@component-instruction-margin-top @component-instruction-margin-sides @component-instruction-padding-bottom; - -// Navigation -// ========== - -@navigation-color:#fff; -@navigation-icon-color:@primary-color; -@navigation-icon-hover-color:darken(@primary-color, 30%); - -@navigation-border-width:1px; -@navigation-border-style:solid; -@navigation-border-color:@primary-color; -@navigation-border: @navigation-border-width @navigation-border-style @navigation-border-color; - -@navigation-height: 60px; -@navigation-height-mobile: 50px; -@navigation-padding: ((@navigation-height - @icon-size)/2); -@navigation-padding-mobile: ((@navigation-height-mobile - @icon-size)/2); - - -// Drawer -// ====== - -@drawer-color:@primary-color; -@drawer-text-color:#fff; - -@drawer-icon-color:#fff; -@drawer-icon-hover-color:darken(@drawer-color, 30%); - -@drawer-item-color:#3eb4e4; -@drawer-item-hover-color:darken(@drawer-item-color,10%); - -@drawer-item-text-color:#fff; -@drawer-item-text-hover-color:#fff; - -@drawer-item-padding-top:10px; -@drawer-item-padding-right:10px; -@drawer-item-padding-bottom:10px; -@drawer-item-padding-left:10px; - -@drawer-item-padding:@drawer-item-padding-top @drawer-item-padding-right @drawer-item-padding-bottom @drawer-item-padding-left; - - -// Notify -// ====== - -@notify-color:#3eb4e4; -@notify-text-color:#fff; - -@notify-icon-color:#fff; -@notify-icon-hover-color:darken(@notify-color, 30%); - -@notify-button-color:#fff; -@notify-button-hover-color:darken(@notify-color, 30%); -@notify-button-text-color:#3eb4e4; -@notify-button-text-hover-color:#fff; - -@notify-popup-padding-top:30px; -@notify-popup-padding-right:30px; -@notify-popup-padding-bottom:30px; -@notify-popup-padding-left:30px; - -@notify-popup-padding:@notify-popup-padding-top @notify-popup-padding-right @notify-popup-padding-bottom @notify-popup-padding-left; - +@content-padding:40px 20px; +@page-title-padding:40px 20px; +@article-title-padding:40px 20px 0px; +@article-body-padding:10px 20px; +@block-title-padding:40px 0px 0px; +@block-body-padding:10px 0px; +@component-title-padding:0px; +@component-body-padding:0px; + +@title-spacing:10px 0px; +@body-spacing:0px 0px 20px; // Fonts // ===== - @import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600); @font-family:'Open Sans', sans-serif; @font-size:16px; -@font-extra-line-height:10px; +@font-line-height-extra:10px; @font-color:@foreground-color; @font-weight-light:300; @font-weight-normal:400; @font-weight-bold:600; - // Icons // ===== - @icon-size:24px; @icon-correct-color:#51FB66; -@icon-incorrect-color:#F14E4E; - +@icon-incorrect-color:#F14E4E; \ No newline at end of file diff --git a/package.json b/package.json index c490c79f..c77c6a5b 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,7 @@ "url": "https://github.com/adaptlearning/adapt-contrib-vanilla/issues" }, "devDependencies": { - "karma": "~0.10", + "karma": "~0.9", "karma-mocha": "*", "karma-expect": "*" } diff --git a/templates/article.hbs b/templates/article.hbs index 88b1c6a1..08cd18ac 100644 --- a/templates/article.hbs +++ b/templates/article.hbs @@ -2,10 +2,10 @@ {{! .block-container: Adapt will place the articles blocks inside this class}}
{{! Check if a page title exist and render it}} - {{#if displayTitle}} + {{#if title}}

- {{{displayTitle}}} + {{{title}}}

{{/if}} diff --git a/templates/block.hbs b/templates/block.hbs index 7822c0c4..30ca1f27 100644 --- a/templates/block.hbs +++ b/templates/block.hbs @@ -1,11 +1,11 @@ {{! Maintainers - Daryl Hedley}} {{! .component-container: Adapt will place the blocks components inside this class}} -
+
{{! Check if a page title exist and render it}} - {{#if displayTitle}} + {{#if title}}

- {{{displayTitle}}} + {{{title}}}

{{/if}} @@ -17,6 +17,4 @@
{{/if}} -
-
\ No newline at end of file diff --git a/templates/drawer.hbs b/templates/drawer.hbs deleted file mode 100644 index ac4dc2c4..00000000 --- a/templates/drawer.hbs +++ /dev/null @@ -1,10 +0,0 @@ -
-
- - - - -
-
-
-
\ No newline at end of file diff --git a/templates/drawerItem.hbs b/templates/drawerItem.hbs deleted file mode 100644 index 7286f2e5..00000000 --- a/templates/drawerItem.hbs +++ /dev/null @@ -1,8 +0,0 @@ - -
-
{{{title}}}
-
-
-
{{{description}}}
-
- \ No newline at end of file diff --git a/templates/navigation.hbs b/templates/navigation.hbs index d3b71427..2c242948 100644 --- a/templates/navigation.hbs +++ b/templates/navigation.hbs @@ -1,6 +1,5 @@ {{! Maintainers - Daryl Hedley}} {{! All links in the nav bar should have an attritbue of data-event, navigationView uses this to fire a global event}} -
- - +
+
\ No newline at end of file diff --git a/templates/notify.hbs b/templates/notify.hbs deleted file mode 100644 index f2bfa42b..00000000 --- a/templates/notify.hbs +++ /dev/null @@ -1,52 +0,0 @@ -{{! Maintainers - Daryl Hedley}} -
- {{#if_value_equals _type "popup"}} -
- -
- -
- {{/if_value_equals}} -
-
-
- {{#if _showIcon}} -
-
-
-
- {{/if}} - {{#if title}} -
-
- {{{title}}} -
-
- {{/if}} - {{#if body}} -
-
{{{body}}}
-
- {{/if}} - {{#if body}} -
- - {{#if_value_equals _type "alert"}} - {{{confirmText}}} - {{/if_value_equals}} - - {{#if_value_equals _type "prompt"}} - {{#each _prompts}} - {{{promptText}}} - {{/each}} - {{/if_value_equals}} - -
- {{/if}} -
-
-
-
- - -
\ No newline at end of file diff --git a/templates/notifyPush.hbs b/templates/notifyPush.hbs deleted file mode 100644 index 93ec7a15..00000000 --- a/templates/notifyPush.hbs +++ /dev/null @@ -1,15 +0,0 @@ -
-
-
- {{{title}}} -
-
-
-
- {{{body}}} -
-
-
- - - \ No newline at end of file diff --git a/templates/page.hbs b/templates/page.hbs index 74f48b01..ef3d76e9 100644 --- a/templates/page.hbs +++ b/templates/page.hbs @@ -2,10 +2,10 @@ {{! .article-container: Adapt will place the pages articles inside this class}}
{{! Check if a page title exist and render it}} - {{#if displayTitle}} + {{#if title}}

- {{{displayTitle}}} + {{{title}}}

{{/if}} diff --git a/templates/partials/buttons.hbs b/templates/partials/buttons.hbs deleted file mode 100644 index b64c17eb..00000000 --- a/templates/partials/buttons.hbs +++ /dev/null @@ -1,20 +0,0 @@ - - - {{{_buttons.submit}}} - - - - - {{{_buttons.reset}}} - - - - - {{{_buttons.showCorrectAnswer}}} - - - - - {{{_buttons.hideCorrectAnswer}}} - - \ No newline at end of file diff --git a/templates/partials/component.hbs b/templates/partials/component.hbs deleted file mode 100644 index 5cb62bad..00000000 --- a/templates/partials/component.hbs +++ /dev/null @@ -1,21 +0,0 @@ -{{#if displayTitle}} -
-

- {{{displayTitle}}} -

-
-{{/if}} -{{#if body}} -
-
- {{{body}}} -
-
-{{/if}} -{{#if instruction}} -
-
- {{{instruction}}} -
-
-{{/if}} \ No newline at end of file