ORGANISATION-KA-INTERNATIONALE/konstitisyon.nu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use Nextjs integration for Mui

Browse Source
This commit is contained in:
Cédric Famibelle-Pronzola
2024-05-17 08:42:30 +04:00
parent cfa4ff6b0d
commit 03ce161f65
4 changed files with 37 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/layout.js
+10 -1
View File
@@ -1,12 +1,21 @@
import {AppRouterCacheProvider} from '@mui/material-nextjs/v13-appRouter'
import {ThemeProvider} from '@mui/material/styles'
import '@fontsource/roboto/300.css' import '@fontsource/roboto/300.css'
import '@fontsource/roboto/400.css' import '@fontsource/roboto/400.css'
import '@fontsource/roboto/500.css' import '@fontsource/roboto/500.css'
import '@fontsource/roboto/700.css' import '@fontsource/roboto/700.css'
import theme from '../src/theme.js'
export default function RootLayout({children}) { // eslint-disable-line react/prop-types export default function RootLayout({children}) { // eslint-disable-line react/prop-types
return ( return (
<html lang='fr'> <html lang='fr'>
<body>{children}</body> <body>
<AppRouterCacheProvider>
<ThemeProvider theme={theme}>
{children}
</ThemeProvider>
</AppRouterCacheProvider>
</body>
</html> </html>
) )
} }
package.json
+2
View File
@@ -7,11 +7,13 @@
}, },
"dependencies": { "dependencies": {
"@directus/sdk": "^16.0.0", "@directus/sdk": "^16.0.0",
"@emotion/cache": "^11.11.0",
"@emotion/react": "^11.11.4", "@emotion/react": "^11.11.4",
"@emotion/styled": "^11.11.5", "@emotion/styled": "^11.11.5",
"@fontsource/roboto": "^5.0.13", "@fontsource/roboto": "^5.0.13",
"@mui/icons-material": "^5.15.18", "@mui/icons-material": "^5.15.18",
"@mui/material": "^5.15.18", "@mui/material": "^5.15.18",
"@mui/material-nextjs": "^5.15.11",
"next": "^14.2.3", "next": "^14.2.3",
"react": "^18.3.1", "react": "^18.3.1",
"react-dom": "^18.3.1" "react-dom": "^18.3.1"
src/theme.js
+18
View File
@@ -0,0 +1,18 @@
'use client'
import {Roboto} from 'next/font/google'
import {createTheme} from '@mui/material/styles'
const roboto = Roboto({ // eslint-disable-line new-cap
weight: ['300', '400', '500', '700'],
subsets: ['latin'],
display: 'swap',
})
const theme = createTheme({
typography: {
fontFamily: roboto.style.fontFamily,
},
})
export default theme
yarn.lock
+7
View File
@@ -307,6 +307,13 @@
dependencies: dependencies:
"@babel/runtime" "^7.23.9" "@babel/runtime" "^7.23.9"
"@mui/material-nextjs@^5.15.11":
version "5.15.11"
resolved "https://registry.yarnpkg.com/@mui/material-nextjs/-/material-nextjs-5.15.11.tgz#bf75eece88fb088e74eb5f0eef01f9f64f8ec7f4"
integrity sha512-cp5RWYbBngyi7NKP91R9QITllfxumCVPFjqe4AKzNROVuCot0VpgkafxXqfbv0uFsyUU0ROs0O2M3r17q604Aw==
dependencies:
"@babel/runtime" "^7.23.9"
"@mui/material@^5.15.18": "@mui/material@^5.15.18":
version "5.15.18" version "5.15.18"
resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.15.18.tgz#1184e88cebb5c58625ca799531c0611c1fd9a2a8" resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.15.18.tgz#1184e88cebb5c58625ca799531c0611c1fd9a2a8"