[core] Force visibility on a few components in ink save print mode (#20749)

Author: coktopus

packages/material-ui/src/ButtonBase/ButtonBase.js

@@ -39,6 +39,9 @@ export const styles = {
       pointerEvents: 'none', // Disable link interactions
       cursor: 'default',
     },
+    '@media print': {
+      colorAdjust: 'exact',
+    },
   },
   /* Pseudo-class applied to the root element if `disabled={true}`. */
   disabled: {},

packages/material-ui/src/LinearProgress/LinearProgress.js

@@ -21,6 +21,9 @@ export const styles = (theme) => {
       position: 'relative',
       overflow: 'hidden',
       height: 4,
+      '@media print': {
+        colorAdjust: 'exact',
+      },
     },
     /* Styles applied to the root and bar2 element if `color="primary"`; bar2 if `variant="buffer"`. */
     colorPrimary: {

packages/material-ui/src/Slider/Slider.js

@@ -156,6 +156,9 @@ export const styles = (theme) => ({
         padding: '0 20px',
       },
     },
+    '@media print': {
+      colorAdjust: 'exact',
+    },
   },
   /* Styles applied to the root element if `color="primary"`. */
   colorPrimary: {

packages/material-ui/src/Switch/Switch.js

@@ -22,6 +22,9 @@ export const styles = (theme) => ({
     flexShrink: 0,
     zIndex: 0, // Reset the stacking context.
     verticalAlign: 'middle', // For correct alignment with the text.
+    '@media print': {
+      colorAdjust: 'exact',
+    },
   },
   /* Styles applied to the root element if `edge="start"`. */
   edgeStart: {