diff options
author | Corey Sewell <corey@gdmedia.tv> | 2014-11-14 20:40:27 +1300 |
---|---|---|
committer | Corey Sewell <corey@gdmedia.tv> | 2014-11-14 20:44:05 +1300 |
commit | 28bd7c0707e3a29f4f74fbdeab88beaa81cd06d4 (patch) | |
tree | 2d1f7e7bfaf049f0829f0896d3b0e7c3c16b7a63 /paper/bootswatch.less | |
parent | 3f867ba1163807a2d43f33ba8d38b5947c45b6fe (diff) |
Add support for SASS/SCSS
Refactored less files to be more scss friendly
* Ensured no variables are used before assignment
* Removed interpolated variable usage with similar substitute
Added SCSS Grunt tasks
* convert_less - Converts theme less files to scss
* swatch_scss - Same as original swatch task, but using sass
* compress_scss - Same as original compress task, but using sass
Added dependencies for SCSS
Updated _config.yml so jekyll includes theme _bootswatch.scss and _variables.scss files
Added .sass-cache dir to .gitignore
Diffstat (limited to 'paper/bootswatch.less')
-rw-r--r-- | paper/bootswatch.less | 60 |
1 files changed, 30 insertions, 30 deletions
diff --git a/paper/bootswatch.less b/paper/bootswatch.less index 9e22fe28..25abb599 100644 --- a/paper/bootswatch.less +++ b/paper/bootswatch.less @@ -36,34 +36,33 @@ // Buttons ==================================================================== -#btn(@class) { +#btn(@class,@bg) { .btn-@{class} { - @bg: "btn-@{class}-bg"; - #gradient > .radial(@@bg 80%, darken(@@bg, 6%) 81%); + #gradient > .radial(@bg 80%, darken(@bg, 6%) 81%); background-size: 200%; background-position: 50%; transition: background-size 2s; &:hover { background-size: 100%; - border-color: darken(@@bg, 6%); + border-color: darken(@bg, 6%); } &:active { - background-color: darken(@@bg, 6%); - #gradient > .radial(darken(@@bg, 6%) 10%, @@bg 11%); + background-color: darken(@bg, 6%); + #gradient > .radial(darken(@bg, 6%) 10%, @bg 11%); background-size: 1000%; .box-shadow(2px 2px 2px rgba(0,0,0,.3)); } } } -#btn(default); -#btn(primary); -#btn(success); -#btn(info); -#btn(warning); -#btn(danger); +#btn(default,@btn-default-bg); +#btn(primary,@btn-primary-bg); +#btn(success,@btn-success-bg); +#btn(info,@btn-info-bg); +#btn(warning,@btn-warning-bg); +#btn(danger,@btn-danger-bg); .btn { text-transform: uppercase; @@ -287,31 +286,32 @@ select.form-control { border-radius: 0 3px 3px 0; } - &:last-child&:before { - display: block; - content: 'div::before'; - position: absolute; - width: 100%; - height: 100%; - left: 0; - right: 0; - z-index: -1; - background-color: lighten(@progress-bar-bg, 35%); + &:last-child { + &:before { + display: block; + content: 'div::before'; + position: absolute; + width: 100%; + height: 100%; + left: 0; + right: 0; + z-index: -1; + background-color: lighten(@progress-bar-bg, 35%); + } } - - &-success:last-child&:before { + + &-success:last-child.progress-bar:before { background-color: lighten(@brand-success, 35%); } - - &-info:last-child&:before { + + &-info:last-child.progress-bar:before { background-color: lighten(@brand-info, 45%); } - - &-warning:last-child&:before { + &-warning:last-child.progress-bar:before { background-color: lighten(@brand-warning, 35%); } - - &-danger:last-child&:before { + + &-danger:last-child.progress-bar:before { background-color: lighten(@brand-danger, 25%); } } |