sombochea/verdaccio-ui
1
0
Fork 1
mirror of https://github.com/SomboChea/ui synced 2026-01-20 18:15:51 +07:00
Code Issues Releases Wiki Activity

feat(style): added dark mode (#446)

Browse Source
This commit is contained in:
Priscila Oliveira
2020-03-31 08:44:59 +02:00
committed by GitHub
parent 91434cc814
commit cdad5cf70d
43 changed files with 378 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/design-tokens/ThemeProvider.tsx
View File

@@ -2,12 +2,23 @@ import React from 'react';
import { ThemeProvider as MuiThemeProvider } from '@material-ui/core/styles';
import { ThemeProvider as EmotionThemeProvider } from 'emotion-theming';
import theme from './theme';
import ThemeContext from './ThemeContext';
import { getTheme, ThemeMode } from './theme';
import useLocalStorage from './useLocalStorage';
const ThemeProvider: React.FC = ({ children }) => (
<EmotionThemeProvider theme={theme}>
<MuiThemeProvider theme={theme}>{children}</MuiThemeProvider>
</EmotionThemeProvider>
);
const ThemeProvider: React.FC = ({ children }) => {
const isDarkModeDefault = window?.__VERDACCIO_BASENAME_UI_OPTIONS?.darkMode;
const [isDarkMode, setIsDarkMode] = useLocalStorage('darkMode', !!isDarkModeDefault);
const themeMode: ThemeMode = isDarkMode ? 'dark' : 'light';
return (
<ThemeContext.Provider value={{ isDarkMode, setIsDarkMode }}>
<EmotionThemeProvider theme={getTheme(themeMode)}>
<MuiThemeProvider theme={getTheme(themeMode)}>{children}</MuiThemeProvider>
</EmotionThemeProvider>
</ThemeContext.Provider>
);
};
export default ThemeProvider;