feat: add 4k media query in MUI theme

cardano-foundation · Aug 28, 2023 · 6bdc9f5 · 6bdc9f5
1 parent 7dc0fdb
commit 6bdc9f5
Showing 1 changed file with 22 additions and 12 deletions.
diff --git a/ui/summit-2023/src/common/styles/theme.ts b/ui/summit-2023/src/common/styles/theme.ts
@@ -1,19 +1,29 @@
 import { createTheme } from '@mui/material/styles';
 import componentsOverride from './overrides';
+import { createBreakpoints } from '@mui/system';
+
+declare module '@mui/material/styles' {
+    interface BreakpointOverrides {
+        xxl: true;
+    }
+}
+const breakpoints = createBreakpoints({ values: { xs: 0, sm: 600, md: 960, lg: 1280, xl: 1920, xxl: 2160 } });
 
 const theme = createTheme({
-  palette: {
-    primary: {
-      main: '#03021F',
-    },
-    secondary: {
-      main: '#F5F9FF',
-    },
-    error: {
-      main: '#C20024',
-    },
-  },
-});
+      palette: {
+        primary: {
+          main: '#03021F',
+        },
+        secondary: {
+          main: '#F5F9FF',
+        },
+        error: {
+          main: '#C20024',
+        },
+      },
+      breakpoints,
+    }
+ );
 
 theme.components = componentsOverride(theme);