Files
pawol.nu/app/theme-registy.js
T
2023-07-26 08:05:23 +04:00

85 lines
2.0 KiB
JavaScript

'use client'
import PropTypes from 'prop-types'
import {experimental_extendTheme as extendTheme, Experimental_CssVarsProvider as CssVarsProvider, getInitColorSchemeScript} from '@mui/material/styles'
import CssBaseline from '@mui/material/CssBaseline'
import {grey, green, yellow} from '@mui/material/colors'
import '@fontsource/roboto/300.css'
import '@fontsource/roboto/400.css'
import '@fontsource/roboto/500.css'
import '@fontsource/roboto/700.css'
import '../styles/nprogress.css'
import PlausibleProvider from 'next-plausible'
import ChanjeTem from '../components/chanje-tem'
import NextAppDirEmotionCacheProvider from './emotion-cache-provider'
const theme = extendTheme({
colorSchemes: {
light: {
palette: {
primary: green,
secondary: {
main: green[50]
},
divider: green[200],
info: {
main: grey[900]
},
text: {
primary: grey[900],
secondary: grey[800],
},
}
},
dark: {
palette: {
primary: {
main: yellow[500],
contrastText: '#000'
},
secondary: {
main: yellow[500]
},
info: {
main: '#fff'
},
divider: green[700],
background: {
default: '#082211',
paper: '#082211'
},
text: {
primary: '#fff',
secondary: grey[100]
}
}
}
}
})
export default function ThemeRegistry(props) {
const {children} = props
return (
<>
{getInitColorSchemeScript()}
<PlausibleProvider domain='oki.re'>
<NextAppDirEmotionCacheProvider options={{key: 'mui'}}>
<CssVarsProvider theme={theme}>
<CssBaseline enableColorScheme />
<ChanjeTem />
{children}
</CssVarsProvider>
</NextAppDirEmotionCacheProvider>
</PlausibleProvider>
</>
)
}
ThemeRegistry.propTypes = {
children: PropTypes.node.isRequired
}