initial commit

2026-05-13 17:48:36 +05:30
commit 5a80256856
305 changed files with 80994 additions and 0 deletions
--- a/src/themes/index.js
+++ b/src/themes/index.js
@@ -0,0 +1,122 @@
+import PropTypes from 'prop-types';
+import { useMemo } from 'react';
+
+// material-ui
+import { CssBaseline, GlobalStyles, StyledEngineProvider } from '@mui/material';
+import { createTheme, ThemeProvider } from '@mui/material/styles';
+
+// project import
+import useConfig from 'hooks/useConfig';
+import Palette from './palette';
+import Typography from './typography';
+import CustomShadows from './shadows';
+import componentsOverride from './overrides';
+
+// ==============================|| DEFAULT THEME - MAIN  ||============================== //
+
+export default function ThemeCustomization({ children }) {
+  const { themeDirection, mode, presetColor, fontFamily } = useConfig();
+
+  const theme = useMemo(() => Palette(mode, presetColor), [mode, presetColor]);
+
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  const themeTypography = useMemo(() => Typography(fontFamily), [fontFamily]);
+  const themeCustomShadows = useMemo(() => CustomShadows(theme), [theme]);
+
+  const themeOptions = useMemo(
+    () => ({
+      breakpoints: {
+        values: {
+          xs: 0, // Extra-small: 0px and up
+          custom300: 300, // above 350
+          custom350: 350, // above 350
+          custom400: 400, // above 400
+          custom450: 450, // above 450
+          custom500: 500, // above 450
+          custom550: 550, // above 450
+          custom600: 600, // above 450
+          custom650: 650, // above 450
+          custom700: 700, // above 450
+          custom750: 750, // above 450
+          sm: 768, // Small: 768px and up
+          custom800: 800, // above 450,
+          custom850: 850, // above 450,
+          custom900: 900, // above 450
+          custom950: 950, // above 450
+          custom1000: 1000, // above 450
+          md: 1024, // Medium: 1024px and up
+          lg: 1266, // Large: 1266px and up
+          custom1300: 1300, // Large: 1266px and up
+          custom1350: 1350, // Large: 1266px and up
+          xl: 1440 // Extra-large: 1440px and up
+        }
+      },
+      direction: themeDirection,
+      mixins: {
+        toolbar: {
+          minHeight: 60,
+          paddingTop: 8,
+          paddingBottom: 8
+        }
+      },
+      palette: theme.palette,
+      customShadows: themeCustomShadows,
+      typography: themeTypography
+    }),
+    [themeDirection, theme, themeTypography, themeCustomShadows]
+  );
+
+  const themes = createTheme(themeOptions);
+  themes.components = componentsOverride(themes);
+
+  return (
+    <StyledEngineProvider injectFirst>
+      <ThemeProvider theme={themes}>
+        <CssBaseline />
+        <GlobalStyles
+          styles={{
+            // '*': { // this * access even the internal scroll bar,
+            //   // scrollbarWidth: '100px', // works in Firefox only
+            //   scrollbarColor: `${theme.palette.primary.main} ${theme.palette.secondary.lighter}`
+            // },
+            // '*::-webkit-scrollbar': {
+            //   width: '22px', // vertical
+            //   height: '22px' // horizontal
+            // },
+            // '*::-webkit-scrollbar-thumb': {
+            //   backgroundColor: '#65387A'
+            //   // borderRadius: '5px'
+            // },
+            // '*::-webkit-scrollbar-track': {
+            //   backgroundColor: `${theme.palette.secondary.lighter}`
+            // }
+            overflow: 'auto',
+            '&::-webkit-scrollbar': {
+              width: '14px', // scroll bar width
+              cursor: 'pointer'
+            },
+            '&::-webkit-scrollbar-thumb': {
+              backgroundColor: theme.palette.primary.main, // thumb color
+              // borderRadius: '8px',
+              cursor: 'pointer'
+            },
+            '&::-webkit-scrollbar-thumb:hover': {
+              backgroundColor: theme.palette.primary.dark, // hover color
+              cursor: 'pointer'
+            },
+            '&::-webkit-scrollbar-track': {
+              backgroundColor: theme.palette.primary.lighter,
+              cursor: 'pointer'
+            }
+          }}
+        />
+
+        {children}
+      </ThemeProvider>
+    </StyledEngineProvider>
+  );
+}
+
+ThemeCustomization.propTypes = {
+  children: PropTypes.node
+};