[demo] Fix submenu collapsed padding in bw theme

marmelab · Feb 24, 2025 · 75cf474 · 75cf474
1 parent 0a8bb4f
commit 75cf474
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 1 deletion.
diff --git a/examples/demo/src/layout/SubMenu.tsx b/examples/demo/src/layout/SubMenu.tsx
@@ -51,6 +51,7 @@ const SubMenu = (props: Props) => {
                     dense={dense}
                     component="div"
                     disablePadding
+                    className="SubMenu"
                     sx={{
                         '& .MuiMenuItem-root': {
                             transition:

diff --git a/examples/demo/src/themes/themes.tsx b/examples/demo/src/themes/themes.tsx
@@ -30,10 +30,39 @@ export interface Theme {
     dark?: RaThemeOptions;
 }
 
+const BW_SIDEBAR_OVERRIDE = {
+    styleOverrides: {
+        root: {
+            '& .SubMenu .MuiMenuItem-root': {
+                paddingLeft: 24,
+            },
+            '& .RaMenu-closed .SubMenu .MuiMenuItem-root': {
+                paddingLeft: 8,
+            },
+        },
+    },
+};
+
 export const themes: Theme[] = [
     { name: 'soft', light: softLightTheme, dark: softDarkTheme },
     { name: 'default', light: defaultLightTheme, dark: defaultDarkTheme },
-    { name: 'B&W', light: bwLightTheme, dark: bwDarkTheme },
+    {
+        name: 'B&W',
+        light: {
+            ...bwLightTheme,
+            components: {
+                ...bwLightTheme.components,
+                RaSidebar: BW_SIDEBAR_OVERRIDE,
+            },
+        },
+        dark: {
+            ...bwDarkTheme,
+            components: {
+                ...bwDarkTheme.components,
+                RaSidebar: BW_SIDEBAR_OVERRIDE,
+            },
+        },
+    },
     { name: 'nano', light: nanoLightTheme, dark: nanoDarkTheme },
     { name: 'radiant', light: radiantLightTheme, dark: radiantDarkTheme },
     { name: 'house', light: houseLightTheme, dark: houseDarkTheme },