aboutsummaryrefslogtreecommitdiff
path: root/modern/src/common
diff options
context:
space:
mode:
Diffstat (limited to 'modern/src/common')
-rw-r--r--modern/src/common/theme/index.js6
-rw-r--r--modern/src/common/theme/palette.js43
2 files changed, 21 insertions, 28 deletions
diff --git a/modern/src/common/theme/index.js b/modern/src/common/theme/index.js
index 0f163e7e..e8ce698b 100644
--- a/modern/src/common/theme/index.js
+++ b/modern/src/common/theme/index.js
@@ -4,8 +4,8 @@ import palette from './palette';
import dimensions from './dimensions';
import components from './components';
-export default (server) => useMemo(() => createTheme({
- palette: palette(server),
+export default (server, darkMode) => useMemo(() => createTheme({
+ palette: palette(server, darkMode),
dimensions,
components,
-}), [server]);
+}), [server, darkMode]);
diff --git a/modern/src/common/theme/palette.js b/modern/src/common/theme/palette.js
index 7bd63dac..f32ed93e 100644
--- a/modern/src/common/theme/palette.js
+++ b/modern/src/common/theme/palette.js
@@ -1,29 +1,22 @@
-import { useMediaQuery } from '@mui/material';
import { grey, green, indigo } from '@mui/material/colors';
const validatedColor = (color) => (/^#([0-9A-Fa-f]{3}){1,2}$/.test(color) ? color : null);
-export default (server) => {
- const preferDarkMode = useMediaQuery('(prefers-color-scheme: dark)');
- const serverDarkMode = server?.attributes?.darkMode;
- const darkMode = serverDarkMode !== undefined ? serverDarkMode : preferDarkMode;
-
- return {
- mode: darkMode ? 'dark' : 'light',
- background: {
- default: darkMode ? grey[900] : grey[50],
- },
- primary: {
- main: validatedColor(server?.attributes?.colorPrimary) || (darkMode ? indigo[200] : indigo[900]),
- },
- secondary: {
- main: validatedColor(server?.attributes?.colorSecondary) || (darkMode ? green[200] : green[800]),
- },
- neutral: {
- main: grey[500],
- },
- geometry: {
- main: '#3bb2d0',
- },
- };
-};
+export default (server, darkMode) => ({
+ mode: darkMode ? 'dark' : 'light',
+ background: {
+ default: darkMode ? grey[900] : grey[50],
+ },
+ primary: {
+ main: validatedColor(server?.attributes?.colorPrimary) || (darkMode ? indigo[200] : indigo[900]),
+ },
+ secondary: {
+ main: validatedColor(server?.attributes?.colorSecondary) || (darkMode ? green[200] : green[800]),
+ },
+ neutral: {
+ main: grey[500],
+ },
+ geometry: {
+ main: '#3bb2d0',
+ },
+});