From 92aff331bd9397cc5469a70ca502dfc239239652 Mon Sep 17 00:00:00 2001
From: Marcy Sutton <marcy@substantial.com>
Date: Mon, 27 Apr 2015 14:07:36 -0700
Subject: [PATCH] fix(button): icon inherits colors

Closes #2434
Closes #2551
Closes #2586
---
 src/components/button/button-theme.scss | 43 ++++++++++++++++++-------
 src/components/icon/icon-theme.scss     |  4 +--
 2 files changed, 34 insertions(+), 13 deletions(-)

diff --git a/src/components/button/button-theme.scss b/src/components/button/button-theme.scss
index 82b8b8885ae..da16bd0f3d8 100644
--- a/src/components/button/button-theme.scss
+++ b/src/components/button/button-theme.scss
@@ -40,10 +40,10 @@ a.md-button.md-THEME_NAME-theme,
     &.md-fab {
       color: '{{primary-contrast}}';
       background-color: '{{primary-color}}';
-      md-icon {
-        color: '{{primary-contrast}}';
-      }
       &:not([disabled]) {
+        md-icon {
+          color: '{{primary-contrast}}';
+        }
         &:hover {
           background-color: '{{primary-color}}';
         }
@@ -52,12 +52,20 @@ a.md-button.md-THEME_NAME-theme,
         }
       }
     }
+    &:not([disabled]) {
+      md-icon {
+        color: '{{primary-color}}';
+      }
+    }
   }
   &.md-fab {
     border-radius: $button-fab-border-radius;
     background-color: '{{accent-color}}';
     color: '{{accent-contrast}}';
     &:not([disabled]) {
+      .md-icon {
+        color: '{{accent-contrast}}';
+      }
       &:hover {
         background-color: '{{accent-color}}';
       }
@@ -71,6 +79,9 @@ a.md-button.md-THEME_NAME-theme,
     color: '{{background-contrast}}';
     background-color: '{{background-50}}';
     &:not([disabled]) {
+      .md-icon {
+        color: '{{background-contrast}}';
+      }
       &:hover {
         background-color: '{{background-50}}';
       }
@@ -87,10 +98,10 @@ a.md-button.md-THEME_NAME-theme,
     &.md-fab {
       color: '{{warn-contrast}}';
       background-color: '{{warn-color}}';
-      md-icon {
-        color: '{{warn-contrast}}';
-      }
       &:not([disabled]) {
+        md-icon {
+          color: '{{warn-contrast}}';
+        }
         &:hover {
           background-color: '{{warn-color}}';
         }
@@ -99,6 +110,11 @@ a.md-button.md-THEME_NAME-theme,
         }
       }
     }
+    &:not([disabled]) {
+      md-icon {
+        color: '{{warn-color}}';
+      }
+    }
   }
 
   &.md-accent {
@@ -107,10 +123,10 @@ a.md-button.md-THEME_NAME-theme,
     &.md-fab {
       color: '{{accent-contrast}}';
       background-color: '{{accent-color}}';
-      md-icon {
-        color: '{{accent-contrast}}';
-      }
       &:not([disabled]) {
+        md-icon {
+          color: '{{accent-contrast}}';
+        }
         &:hover {
           background-color: '{{accent-color}}';
         }
@@ -119,16 +135,21 @@ a.md-button.md-THEME_NAME-theme,
         }
       }
     }
+    &:not([disabled]) {
+      md-icon {
+        color: '{{accent-color}}';
+      }
+    }
   }
 
   &[disabled],
   &.md-raised[disabled],
   &.md-fab[disabled] {
-    color: '{{foreground-2}}';
+    color: '{{foreground-3}}';
     cursor: not-allowed;
 
     md-icon {
-      color: '{{foreground-2}}';
+      color: '{{foreground-3}}';
     }
   }
   &.md-raised[disabled],
diff --git a/src/components/icon/icon-theme.scss b/src/components/icon/icon-theme.scss
index 5fa78265f1c..b04fd40da37 100644
--- a/src/components/icon/icon-theme.scss
+++ b/src/components/icon/icon-theme.scss
@@ -6,11 +6,11 @@ md-icon.md-THEME_NAME-theme {
   }
 
   &.md-accent {
-      color: '{{accent-color}}';
+    color: '{{accent-color}}';
   }
 
   &.md-warn {
-      color: '{{warn-color}}';
+    color: '{{warn-color}}';
   }
 }