From: harry <harmanmanchanda182@gmail.com>
Date: Sat, 14 Jan 2017 21:42:28 +0000 (+0530)
Subject: Mixin comments for button disabled. Using background and color simultaneously
X-Git-Tag: 6.3.1~30^2~3
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=1e9837a9e898012acc0eb9c60105716f16a7cd61;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Mixin comments for button disabled. Using background and color simultaneously
---

diff --git a/scss/components/_button.scss b/scss/components/_button.scss
index cdb4295ba..23f475875 100644
--- a/scss/components/_button.scss
+++ b/scss/components/_button.scss
@@ -158,22 +158,22 @@ $button-transition: background-color 0.25s ease-out, color 0.25s ease-out !defau
 }
 
 /// Adds disabled styles to a button by fading the element, reseting the cursor, and disabling pointer events.
+/// @param [Color] $background [$primary-color] - Background color of the disabled button. Set to `auto` to have the mixin automatically generate a hover color.
+/// @param [Color] $color [$button-color] - Text color of the disabled button. Set to `auto` to have the mixin automatically generate a hover color.
 @mixin button-disabled(
   $background: $primary-color,
   $color: $button-color
 ) {
   opacity: $button-opacity-disabled;
   cursor: not-allowed;
-  background-color: $background;
-  
-  @if $color == auto {
-    $color: color-pick-contrast($background, ($button-color, $button-color-alt));
-  }
 
-  color: $color;
-
-  &:hover, &:focus {
+  &, &:hover, &:focus {
     background-color: $background;
+  
+    @if $color == auto {
+      $color: color-pick-contrast($background, ($button-color, $button-color-alt));
+    }
+
     color: $color;
   }
 }