From: harry <harmanmanchanda182@gmail.com>
Date: Tue, 17 Jan 2017 17:55:42 +0000 (+0530)
Subject: Putting logic at the top of the mixin instead of in between the css properties
X-Git-Tag: 6.3.1~30^2
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=refs%2Fpull%2F9648%2Fhead;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Putting logic at the top of the mixin instead of in between the css properties
---

diff --git a/scss/components/_button.scss b/scss/components/_button.scss
index 69f5d4a42..032e71c6d 100644
--- a/scss/components/_button.scss
+++ b/scss/components/_button.scss
@@ -164,17 +164,15 @@ $button-transition: background-color 0.25s ease-out, color 0.25s ease-out !defau
   $background: $primary-color,
   $color: $button-color
 ) {
+  @if $color == auto {
+    $color: color-pick-contrast($background, ($button-color, $button-color-alt));
+  }
+
   opacity: $button-opacity-disabled;
   cursor: not-allowed;
 
   &, &:hover, &:focus {
     background-color: $background;
-    
-    // If color is set to `auto`, the function `color-pick-contrast` automatically generates a color based on the background color 
-    @if $color == auto {
-      $color: color-pick-contrast($background, ($button-color, $button-color-alt));
-    }
-
     color: $color;
   }
 }