Fix button background color not being used when defined in settings.

diff --git a/scss/foundation/_settings.scss b/scss/foundation/_settings.scss
index d59257b89741b479200e5c87047049e242935cc0..b3a3ca67819f3ca23e27274a97045a5cb7e1f25d 100644 (file)
--- a/scss/foundation/_settings.scss
+++ b/scss/foundation/_settings.scss
@@ -355,7 +355,7 @@
 // We use these to control button border styles.
 // $button-border-width: 0px;
 // $button-border-style: solid;
-// $bg: $primary-color;
+// $button-bg: $primary-color;
 // $button-border-color: scale-color($bg, $lightness: $button-function-factor);
 
 // We use this to set the default radius used throughout the core.

diff --git a/scss/foundation/components/_buttons.scss b/scss/foundation/components/_buttons.scss
index 1d06eb234f62fcc8e4507e3f04e397e4d24c01c3..d7502fb2f14597c23ac67c7dd9441d4c7ab6642b 100644 (file)
--- a/scss/foundation/components/_buttons.scss
+++ b/scss/foundation/components/_buttons.scss
@@ -36,8 +36,8 @@ $button-function-factor: -20% !default;
 // We use these to control button border styles.
 $button-border-width: 0px !default;
 $button-border-style: solid !default;
-$bg: $primary-color !default;
-$button-border-color: scale-color($bg, $lightness: $button-function-factor) !default;
+$button-bg: $primary-color !default;
+$button-border-color: scale-color($button-bg, $lightness: $button-function-factor) !default;
 
 // We use this to set the default radius used throughout the core.
 $button-radius: $global-radius !default;
@@ -117,10 +117,10 @@ $button-disabled-opacity: 0.7 !default;
 //
 // We use this mixin to add button color styles
 //
-// $bg - Primary color set in settings file. Default: $primary-color.
+// $bg - Primary color set in settings file. Default: $button-bg.
 // $radius - If true, set to button radius which is $global-radius || explicitly set radius amount in px (ex. $radius:10px). Default: true
 // $disabled - We can set $disabled:true to create a disabled transparent button. Default: false
-@mixin button-style($bg:$primary-color, $radius:false, $disabled:false) {
+@mixin button-style($bg:$button-bg, $radius:false, $disabled:false) {
 
   // We control which background styles are used,
   // these can be removed by setting $bg:false
@@ -166,13 +166,13 @@ $button-disabled-opacity: 0.7 !default;
 // We use this to quickly create buttons with a single mixin. As @jaredhardy puts it, "the kitchen sink mixin"
 //
 // $padding - Used to build padding for buttons Default: $button-med ||= rem-calc(12)
-// $bg - Primary color set in settings file. Default: $primary-color.
+// $bg - Primary color set in settings file. Default: $button-bg.
 // $radius - If true, set to button radius which is $global-radius || explicitly set radius amount in px (ex. $radius:10px). Default:false.
 // $full-width - We can set $full-width:true to remove side padding extend width. Default:false.
 // $disabled - We can set $disabled:true to create a disabled transparent button. Default:false.
 // $is-input - <input>'s and <button>'s take on strange padding. We added this to help fix that. Default:false.
 // $is-prefix - Not used? Default:false.
-@mixin button($padding:$button-med, $bg:$primary-color, $radius:false, $full-width:false, $disabled:false, $is-prefix:false) {
+@mixin button($padding:$button-med, $bg:$button-bg, $radius:false, $full-width:false, $disabled:false, $is-prefix:false) {
   @include button-base;
   @include button-size($padding, $full-width);
   @include button-style($bg, $radius, $disabled);
@@ -205,7 +205,7 @@ $button-disabled-opacity: 0.7 !default;
       &.radius { @include button-style($bg:false, $radius:true); }
       &.round  { @include button-style($bg:false, $radius:$button-round); }
 
-      &.disabled, &[disabled] { @include button-style($bg:$primary-color, $disabled:true);
+      &.disabled, &[disabled] { @include button-style($bg:$button-bg, $disabled:true);
         &.secondary { @include button-style($bg:$secondary-color, $disabled:true); }
         &.success { @include button-style($bg:$success-color, $disabled:true); }
         &.alert { @include button-style($bg:$alert-color, $disabled:true); }