Permalink
Browse files

Build: Update to use grunt-jsass, fixes node 5+, refine variable usage

Fixes gh-152
Closes gh-154
  • Loading branch information...
arschmitz authored and sfrisk committed Mar 29, 2016
1 parent f1a5d2b commit 344d41a4c4d5f1aabdcbb79cd3b9cd51c43b421d
View
@@ -4,6 +4,7 @@
"eqeqeq": true,
"eqnull": true,
"expr": true,
"esnext": true,
"immed": true,
"noarg": true,
"quotmark": "double",
View
@@ -1,7 +1,7 @@
sudo: false
language: node_js
node_js:
- "0.10"
- "5"
cache:
directories:
- node_modules
View
@@ -51,12 +51,12 @@
"grunt-csscomb": "3.0.0",
"grunt-git-authors": "2.0.0",
"grunt-html": "5.0.1",
"grunt-jsass": "1.1.0",
"grunt-jscs": "2.3.0",
"grunt-sass": "1.0.0",
"grunt-selenium-server": "0.1.2",
"grunt-svgmin": "2.0.0",
"grunt-svgstore": "0.5.0",
"jsass-vars": "0.0.3",
"load-grunt-config": "0.16.0",
"perfjankie": "1.2.2"
},
@@ -39,49 +39,49 @@
}
.btn {
@include btn( map-get($ui-btn, margin));
@include btn( map-get($btn-element, margin));
}
/* Button Colors */
.btn-default {
@include btn-colors($ui-btn-default);
@include btn-colors($btn-default);
}
.btn-primary {
@include btn-colors($ui-btn-primary);
@include btn-colors($btn-primary);
}
.btn-success {
@include btn-colors($ui-btn-success);
@include btn-colors($btn-success);
}
.btn-info {
@include btn-colors($ui-btn-info);
@include btn-colors($btn-info);
}
.btn-warning {
@include btn-colors($ui-btn-warning);
@include btn-colors($btn-warning);
}
.btn-danger {
@include btn-colors($ui-btn-danger );
@include btn-colors($btn-danger );
}
/* Button Sizes */
.btn-lg {
@include btn-size($ui-btn-lg);
@include btn-size($btn-lg);
}
.btn-md {
@include btn-size($ui-btn-md);
@include btn-size($btn-md);
}
.btn-sm {
@include btn-size($ui-btn-sm);
@include btn-size($btn-sm);
}
.btn-xs {
@include btn-size($ui-btn-xs);
@include btn-size($btn-xs);
}
@@ -1,28 +1,28 @@
@mixin btn($margin) {
border: 1px solid transparent;
cursor: pointer;
letter-spacing: map-get($ui-btn, letter-spacing);
font-family: $ui-btn-font;
font-weight: map-get($ui-btn, font-weight);
letter-spacing: map-get($btn-element, letter-spacing);
font-family: $btn-font;
font-weight: map-get($btn-element, font-weight);
margin: $margin;
text-decoration: none;
text-transform: map-get($ui-btn, text-transform);
text-transform: map-get($btn-element, text-transform);
}
@mixin btn-colors($btn-colors) {
color: map-get($btn-colors, color);
background: map-deep-get($btn-colors, "background", "base");
border-color: map-get($btn-colors, border);
@if (map-get($btn-colors, shadow) == true) {
transition: map-get($ui-btn-shadows, transition);
box-shadow: map-get($ui-btn-shadows, box-shadow-base);
transition: map-get($btn-shadows, transition);
box-shadow: map-get($btn-shadows, box-shadow-base);
}
&:active,
&.active {
@include btn-active($btn-colors);
@if (map-get($btn-colors, shadow) == true) {
box-shadow: map-get($ui-btn-shadows, box-shadow-active);
box-shadow: map-get($btn-shadows, box-shadow-active);
}
}
@@ -40,7 +40,7 @@
&.disabled {
@include btn-disabled($btn-colors);
@if (map-get($btn-colors, shadow) == true) {
box-shadow: map-get($ui-btn-shadows, box-shadow-disabled);
box-shadow: map-get($btn-shadows, box-shadow-disabled);
}
}
}
@@ -71,17 +71,17 @@
}
@mixin btn-disabled($btn-colors) {
cursor: map-get($ui-btn-disabled, cursor);
color: rgba(map-get($btn-colors, color), map-get($ui-btn-disabled, "color-opacity"));
cursor: map-get($btn-disable, cursor);
color: rgba(map-get($btn-colors, color), map-get($btn-disable, "color-opacity"));
$bg: map-deep-get($btn-colors, "background", "base");
@if ($bg == transparent) {
background: map-deep-get($btn-colors, "background", "base");
} @else {
background: rgba($bg, map-get($ui-btn-disabled, "background-opacity"));
background: rgba($bg, map-get($btn-disable, "background-opacity"));
}
@if (map-get($btn-colors, border) == transparent) {
border-color: map-get($btn-colors, border);
} @else {
border-color: rgba(map-get($btn-colors, border), map-get($ui-btn-disabled, "background-opacity"));
border-color: rgba(map-get($btn-colors, border), map-get($btn-disable, "background-opacity"));
}
}
@@ -11,6 +11,6 @@
* 1. font-size: em(14px);
* 2. font-size: em(30px/14px);
*/
@function em($value, $context: map-get($font-default, font-size)) {
@function em($value, $context: map-get($typography-font-default, font-size)) {
@return ($value / $context * 1em);
}
@@ -10,38 +10,38 @@
"mixins";
body {
font: $normal #{ map-get( $font-default, font-size ) }/1.5 $sans;
font: $typography-normal #{ map-get( $typography-font-default, font-size ) }/1.5 $typography-sans;
@media ( max-width: $viewport-md-min ) {
@media ( max-width: $breakpoints-viewport-md-min ) {
font-size: 16px;
}
@media ( max-width: $viewport-sm-min ) {
@media ( max-width: $breakpoints-viewport-sm-min ) {
font-size: 14px;
}
}
h1 {
@include heading($h1);
@include heading($typography-h1);
}
h2 {
@include heading($h2);
@include heading($typography-h2);
}
h3 {
@include heading($h3);
@include heading($typography-h3);
}
h4 {
@include heading($h4);
@include heading($typography-h4);
}
h5 {
@include heading($h5);
@include heading($typography-h5);
}
h6 {
@include heading($h6);
@include heading($typography-h6);
}
/*
@@ -52,21 +52,21 @@ h6 {
hr {
border: 0;
border-bottom: map-get($hr, thickness) map-get($hr, style) map-get($hr, color);
border-bottom: map-get($typography-hr, thickness) map-get($typography-hr, style) map-get($typography-hr, color);
}
blockquote {
margin: 0;
padding-left: map-get($blockquote,padding-left); //TODO consider all padding variables
padding-left: map-get($typography-blockquote,padding-left); //TODO consider all padding variables
position: relative;
border-left: map-get($blockquote,border);
font-style: map-get($blockquote,font-style);
border-left: map-get($typography-blockquote,border);
font-style: map-get($typography-blockquote,font-style);
}
pre {
padding: 16px 20px;
background: map-get($pre,background);
font: normal 12px/1.4 $monospace;
background: map-get($typography-pre,background);
font: normal 12px/1.4 $typography-monospace;
}
/*
@@ -90,27 +90,27 @@ dd {
*/
a {
@include link($link);
@include link($typography-link);
&:visited {
@include link($link-visited);
@include link($typography-link-visited);
}
&:active,
&:focus {
@include link($link-focus);
@include link($typography-link-focus);
}
&:hover {
@include link($link-hover);
@include link($typography-link-hover);
}
}
b,
strong {
font-weight: $bold;
font-weight: $typography-bold;
}
code {
background: map-get($code,background);
background: map-get($typography-code,background);
font-size: em( 16px );
padding: em( 4px, 16px ) em( 8px, 16px );
border-radius: map-get($code,border-radius);
border-radius: map-get($typography-code,border-radius);
}
Oops, something went wrong.

0 comments on commit 344d41a

Please sign in to comment.