From 40a9101229803b4a81af3523eefe95aeb7027d43 Mon Sep 17 00:00:00 2001
From: crisbeto <crisbeto@abv.bg>
Date: Sat, 14 Oct 2017 12:42:42 +0200
Subject: [PATCH] fix(select,input): inconsistent disabled text color

* Fixes the select and input having different disabled text colors since the color isn't based on a palette. Adds a mixin to ensure that they can't get out of sync in the future.
* Fixes the input having the wrong disabled text color (0.38 alpha for light themes and 0.5 for dark ones). It seems like the colors that were used before were in reference to the underline, not the text (see https://material.io/guidelines/components/text-fields.html#text-fields-states).

Fixes #7793.
---
 src/lib/core/style/_form-common.scss |  8 ++++++++
 src/lib/input/_input-theme.scss      |  5 +----
 src/lib/select/_select-theme.scss    | 20 +++++++++-----------
 3 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/src/lib/core/style/_form-common.scss b/src/lib/core/style/_form-common.scss
index 19d0cee24698..93260883c969 100644
--- a/src/lib/core/style/_form-common.scss
+++ b/src/lib/core/style/_form-common.scss
@@ -6,3 +6,11 @@
   background-size: 4px 1px;
   background-repeat: repeat-x;
 }
+
+// Determines the text color of a disabled control since the values are not part of a palette.
+@mixin mat-control-disabled-text($theme) {
+  $foreground: map-get($theme, foreground);
+  $is-dark-theme: map-get($theme, is-dark);
+
+  color: mat-color($foreground, secondary-text, if($is-dark-theme, 0.5, 0.38));
+}
diff --git a/src/lib/input/_input-theme.scss b/src/lib/input/_input-theme.scss
index 9cd15260e3c2..6661e6b2f68d 100644
--- a/src/lib/input/_input-theme.scss
+++ b/src/lib/input/_input-theme.scss
@@ -5,11 +5,8 @@
 
 
 @mixin mat-input-theme($theme) {
-  $foreground: map-get($theme, foreground);
-  $is-dark-theme: map-get($theme, is-dark);
-
   .mat-input-element:disabled {
-    color: mat-color($foreground, secondary-text, if($is-dark-theme, 0.7, 0.42));
+    @include mat-control-disabled-text($theme);
   }
 }
 
diff --git a/src/lib/select/_select-theme.scss b/src/lib/select/_select-theme.scss
index 685f8f2b82a1..1f435b5b34b1 100644
--- a/src/lib/select/_select-theme.scss
+++ b/src/lib/select/_select-theme.scss
@@ -10,12 +10,6 @@
   $primary: map-get($theme, primary);
   $accent: map-get($theme, accent);
   $warn: map-get($theme, warn);
-  $is-dark-theme: map-get($theme, is-dark);
-
-  .mat-select-disabled .mat-select-value,
-  .mat-select-arrow {
-    color: mat-color($foreground, secondary-text);
-  }
 
   .mat-select-content, .mat-select-panel-done-animating {
     background: mat-color($background, card);
@@ -25,6 +19,14 @@
     color: mat-color($foreground, text);
   }
 
+  .mat-select-disabled .mat-select-value {
+    @include mat-control-disabled-text($theme);
+  }
+
+  .mat-select-arrow {
+    color: mat-color($foreground, secondary-text);
+  }
+
   .mat-select-panel {
     .mat-option.mat-selected:not(.mat-option-multiple) {
       background: mat-color($background, hover, 0.12);
@@ -51,13 +53,9 @@
     }
 
     .mat-select.mat-select-disabled .mat-select-arrow {
-      color: mat-color($foreground, secondary-text);
+      @include mat-control-disabled-text($theme);
     }
   }
-
-  .mat-select.mat-select-disabled .mat-select-arrow {
-    color: mat-color($warn);
-  }
 }
 
 @mixin mat-select-typography($config) {