Fix ClassesTable deprecation dark mode style

mui · Jan 5, 2024 · b9dda34 · b9dda34
1 parent 3686a07
commit b9dda34
Showing 1 changed file with 26 additions and 12 deletions.
diff --git a/docs/src/modules/components/ApiPage/table/ClassesTable.tsx b/docs/src/modules/components/ApiPage/table/ClassesTable.tsx
@@ -32,18 +32,6 @@ const StyledTable = styled('table')(
       borderColor: alpha(darkTheme.palette.primary[100], 0.8),
       backgroundColor: `var(--muidocs-palette-primary-50, ${lightTheme.palette.primary[50]})`,
     },
-  }),
-  ({ theme }) => ({
-    [`:where(${theme.vars ? '[data-mui-color-scheme="dark"]' : '.mode-dark'}) &`]: {
-      '& .class-name': {
-        color: `var(--muidocs-palette-primary-200, ${darkTheme.palette.primary[200]})`,
-      },
-      '& .class-key': {
-        color: `var(--muidocs-palette-text-primary, ${darkTheme.palette.text.primary})`,
-        borderColor: alpha(darkTheme.palette.primary[400], 0.1),
-        backgroundColor: alpha(darkTheme.palette.primary[900], 0.4),
-      },
-    },
     '& .classes-table-deprecated': {
       '& code ': { all: 'unset' },
     },
@@ -71,6 +59,32 @@ const StyledTable = styled('table')(
       },
     },
   }),
+  ({ theme }) => ({
+    [`:where(${theme.vars ? '[data-mui-color-scheme="dark"]' : '.mode-dark'}) &`]: {
+      '& .class-name': {
+        color: `var(--muidocs-palette-primary-200, ${darkTheme.palette.primary[200]})`,
+      },
+      '& .class-key': {
+        color: `var(--muidocs-palette-text-primary, ${darkTheme.palette.text.primary})`,
+        borderColor: alpha(darkTheme.palette.primary[400], 0.1),
+        backgroundColor: alpha(darkTheme.palette.primary[900], 0.4),
+      },
+      '& .classes-table-alert': {
+        color: `var(--muidocs-palette-warning-50, ${darkTheme.palette.warning[50]})`,
+        backgroundColor: alpha(darkTheme.palette.warning[700], 0.15),
+        borderColor: alpha(darkTheme.palette.warning[600], 0.3),
+        '& strong': {
+          color: `var(--muidocs-palette-warning-200, ${darkTheme.palette.warning[200]})`,
+        },
+        '&>svg': {
+          fill: `var(--muidocs-palette-warning-400, ${darkTheme.palette.warning[400]})`,
+        },
+        '& a': {
+          color: `var(--muidocs-palette-warning-100, ${darkTheme.palette.warning[100]})`,
+        },
+      },
+    },
+  }),
 );
 
 interface ClassesTableProps {