color instead of opacity?

mui · Mar 26, 2020 · 0e2a8c8 · 0e2a8c8
1 parent da46bcf
commit 0e2a8c8
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 10 deletions.
diff --git a/packages/material-ui-lab/src/Autocomplete/Autocomplete.js b/packages/material-ui-lab/src/Autocomplete/Autocomplete.js
@@ -135,20 +135,13 @@ export const styles = (theme) => ({
     marginRight: -2,
     padding: 4,
     visibility: 'hidden',
-    color: 'currentColor',
-    opacity: 0.6,
   },
   /* Styles applied to the clear indicator if the input is dirty. */
   clearIndicatorDirty: {},
   /* Styles applied to the popup indicator. */
   popupIndicator: {
     padding: 2,
     marginRight: -2,
-    color: 'currentColor',
-    opacity: 0.6,
-    '&:disabled': {
-      color: 'currentColor',
-    },
   },
   /* Styles applied to the popup indicator if the popup is open. */
   popupIndicatorOpen: {

diff --git a/packages/material-ui/src/NativeSelect/NativeSelect.js b/packages/material-ui/src/NativeSelect/NativeSelect.js
@@ -72,9 +72,11 @@ export const styles = (theme) => ({
     position: 'absolute',
     right: 0,
     top: 'calc(50% - 12px)', // Center vertically
-    color: 'currentColor',
-    opacity: 0.6, // Reduced opacity to account for the icon's large surface area.
     pointerEvents: 'none', // Don't block pointer events on the select under the icon.
+    color: theme.palette.action.active,
+    '&$disabled': {
+      color: theme.palette.action.disabled,
+    },
   },
   /* Styles applied to the icon component if the popup is open. */
   iconOpen: {

diff --git a/packages/material-ui/src/NativeSelect/NativeSelectInput.js b/packages/material-ui/src/NativeSelect/NativeSelectInput.js
@@ -35,7 +35,11 @@ const NativeSelectInput = React.forwardRef(function NativeSelectInput(props, ref
         {...other}
       />
       {props.multiple ? null : (
-        <IconComponent className={clsx(classes.icon, classes[`icon${capitalize(variant)}`])} />
+        <IconComponent
+          className={clsx(classes.icon, classes[`icon${capitalize(variant)}`], {
+            [classes.disabled]: disabled,
+          })}
+        />
       )}
     </React.Fragment>
   );

diff --git a/packages/material-ui/src/Select/SelectInput.js b/packages/material-ui/src/Select/SelectInput.js
@@ -349,6 +349,7 @@ const SelectInput = React.forwardRef(function SelectInput(props, ref) {
       <IconComponent
         className={clsx(classes.icon, classes[`icon${capitalize(variant)}`], {
           [classes.iconOpen]: open,
+          [classes.disabled]: disabled,
         })}
       />
       <Menu