feat(select): add hover styles and fix disabled

* Adds hover styles to the select component. * Fixes the disabled styles that were being applied to the wrong element. Closes #7518. Closes #7765
angular · Mar 30, 2016 · 7bc3cc1 · 7bc3cc1
1 parent cc4f626
commit 7bc3cc1
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/src/components/select/select-theme.scss b/src/components/select/select-theme.scss
@@ -53,11 +53,16 @@ md-select-menu.md-THEME_NAME-theme {
       color: '{{background-900-0.87}}';
 
       &[disabled] {
-        color: '{{background-400-0.87}}';
+        ._md-text {
+          color: '{{background-400-0.87}}';
+        }
       }
 
-      &:focus:not([disabled]) {
-        background: '{{background-200}}';
+      &:not([disabled]) {
+        &:focus,
+        &:hover {
+          background: '{{background-200}}'
+        }
       }
 
       &[selected] {
@@ -76,7 +81,6 @@ md-select-menu.md-THEME_NAME-theme {
   }
 }
 
-
 [md-checkbox-enabled].md-THEME_NAME-theme {
   @include checkbox-primary('[selected]');
 

diff --git a/src/components/select/select.scss b/src/components/select/select.scss
@@ -189,6 +189,7 @@ md-option {
   display: flex;
   align-items: center;
   width: auto;
+  transition: background 0.15s linear;
 
   &[disabled] {
     cursor: default;