refactor theme

ApayRus · ApayRus · commit 4c06d85e7752 · 2022-05-07T14:03:16.000+03:00
diff --git a/pages/_app.jsx b/pages/_app.jsx
@@ -1,7 +1,8 @@
 import React from 'react'
 import Head from 'next/head'
 import CssBaseline from '@material-ui/core/CssBaseline'
-import ThemeProvider from '../components/Theme'
+import { ThemeProvider } from '@material-ui/core'
+import theme from '../theme'
 
 export default function MyApp(props) {
 	const { Component, pageProps } = props
@@ -15,19 +16,17 @@ export default function MyApp(props) {
 	}, [])
 
 	return (
-		<React.Fragment>
+		<ThemeProvider theme={theme}>
 			<Head>
 				<title>My page</title>
 				<meta
 					name='viewport'
 					content='minimum-scale=1, initial-scale=1, width=device-width'
 				/>
 			</Head>
-			<ThemeProvider>
-				{/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}
-				<CssBaseline />
-				<Component {...pageProps} />
-			</ThemeProvider>
-		</React.Fragment>
+			{/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}
+			<CssBaseline />
+			<Component {...pageProps} />
+		</ThemeProvider>
 	)
 }
diff --git a/pages/_document.jsx b/pages/_document.jsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Document, { Html, Head, Main, NextScript } from 'next/document'
 import { ServerStyleSheets } from '@material-ui/core/styles'
-import { theme } from '../components/Theme'
+import { theme } from '../theme'
 
 export default class MyDocument extends Document {
 	render() {
diff --git a/theme.js b/theme.js
@@ -1,9 +1,9 @@
-import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles'
+import { createTheme } from '@material-ui/core/styles'
 
 import { red } from '@material-ui/core/colors'
 
 // Create a theme instance.
-export const theme = createMuiTheme({
+export const theme = createTheme({
 	palette: {
 		primary: {
 			main: '#556cd6'
@@ -20,8 +20,4 @@ export const theme = createMuiTheme({
 	}
 })
 
-const Theme = ({ children }) => {
-	return <ThemeProvider theme={theme}>{children}</ThemeProvider>
-}
-
-export default Theme
+export default theme
