create-next-mui 0.0.1 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/next-mui-template-js/.vscode/settings.json +7 -0
- package/next-mui-template-js/.vscode/typescript.code-snippets +10 -0
- package/next-mui-template-js/esling.config.mjs +90 -0
- package/next-mui-template-js/next.config.ts +7 -0
- package/next-mui-template-js/package-lock.json +6689 -0
- package/next-mui-template-js/package.json +31 -0
- package/next-mui-template-js/public/next.svg +1 -0
- package/next-mui-template-js/public/vercel.svg +1 -0
- package/next-mui-template-js/src/app/favicon.ico +0 -0
- package/next-mui-template-js/src/app/globals.css +28 -0
- package/next-mui-template-js/src/app/layout.tsx +42 -0
- package/next-mui-template-js/src/app/page.tsx +7 -0
- package/next-mui-template-js/src/lib/router-link/index.ts +5 -0
- package/next-mui-template-js/src/sections/home/view.tsx +49 -0
- package/next-mui-template-js/src/theme/core/colors.json +46 -0
- package/next-mui-template-js/src/theme/core/components/button.ts +35 -0
- package/next-mui-template-js/src/theme/core/components/card.ts +17 -0
- package/next-mui-template-js/src/theme/core/components/index.ts +9 -0
- package/next-mui-template-js/src/theme/core/palette.ts +34 -0
- package/next-mui-template-js/src/theme/core/typography.ts +51 -0
- package/next-mui-template-js/src/theme/create-theme.ts +24 -0
- package/next-mui-template-js/src/theme/theme-provider.tsx +19 -0
- package/next-mui-template-js/tsconfig.json +34 -0
- package/next-mui-template-ts/.vscode/settings.json +7 -7
- package/next-mui-template-ts/.vscode/typescript.code-snippets +10 -10
- package/next-mui-template-ts/esling.config.mjs +90 -97
- package/next-mui-template-ts/next.config.ts +7 -7
- package/next-mui-template-ts/package-lock.json +6689 -6689
- package/next-mui-template-ts/package.json +31 -31
- package/next-mui-template-ts/src/app/globals.css +28 -28
- package/next-mui-template-ts/src/app/layout.tsx +42 -42
- package/next-mui-template-ts/src/app/page.tsx +7 -7
- package/next-mui-template-ts/src/lib/router-link/index.ts +5 -5
- package/next-mui-template-ts/src/sections/home/view.tsx +49 -49
- package/next-mui-template-ts/src/theme/core/colors.json +46 -46
- package/next-mui-template-ts/src/theme/core/components/button.ts +35 -35
- package/next-mui-template-ts/src/theme/core/components/card.ts +17 -17
- package/next-mui-template-ts/src/theme/core/components/index.ts +9 -9
- package/next-mui-template-ts/src/theme/core/palette.ts +34 -34
- package/next-mui-template-ts/src/theme/core/typography.ts +51 -51
- package/next-mui-template-ts/src/theme/create-theme.ts +24 -24
- package/next-mui-template-ts/src/theme/theme-provider.tsx +19 -19
- package/next-mui-template-ts/tsconfig.json +34 -34
- package/package.json +1 -1
- package/src/index.js +88 -88
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "next-mui-template",
|
|
3
|
-
"version": "0.0.1",
|
|
4
|
-
"private": true,
|
|
5
|
-
"scripts": {
|
|
6
|
-
"dev": "next dev",
|
|
7
|
-
"build": "next build",
|
|
8
|
-
"start": "next start",
|
|
9
|
-
"lint": "eslint ./src --fix "
|
|
10
|
-
},
|
|
11
|
-
"dependencies": {
|
|
12
|
-
"@emotion/react": "^11.14.0",
|
|
13
|
-
"@emotion/styled": "^11.14.1",
|
|
14
|
-
"@mui/icons-material": "^9.0.0",
|
|
15
|
-
"@mui/material": "^9.0.0",
|
|
16
|
-
"@mui/material-nextjs": "^9.0.1",
|
|
17
|
-
"next": "16.2.4",
|
|
18
|
-
"react": "19.2.4",
|
|
19
|
-
"react-dom": "19.2.4"
|
|
20
|
-
},
|
|
21
|
-
"devDependencies": {
|
|
22
|
-
"@types/node": "^20",
|
|
23
|
-
"@types/react": "^19",
|
|
24
|
-
"@types/react-dom": "^19",
|
|
25
|
-
"eslint": "^9",
|
|
26
|
-
"eslint-config-next": "16.2.4",
|
|
27
|
-
"eslint-plugin-perfectionist": "^4.15.1",
|
|
28
|
-
"eslint-plugin-unused-imports": "^4.3.0",
|
|
29
|
-
"typescript": "^5"
|
|
30
|
-
}
|
|
31
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "next-mui-template",
|
|
3
|
+
"version": "0.0.1",
|
|
4
|
+
"private": true,
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "next dev",
|
|
7
|
+
"build": "next build",
|
|
8
|
+
"start": "next start",
|
|
9
|
+
"lint": "eslint ./src --fix "
|
|
10
|
+
},
|
|
11
|
+
"dependencies": {
|
|
12
|
+
"@emotion/react": "^11.14.0",
|
|
13
|
+
"@emotion/styled": "^11.14.1",
|
|
14
|
+
"@mui/icons-material": "^9.0.0",
|
|
15
|
+
"@mui/material": "^9.0.0",
|
|
16
|
+
"@mui/material-nextjs": "^9.0.1",
|
|
17
|
+
"next": "16.2.4",
|
|
18
|
+
"react": "19.2.4",
|
|
19
|
+
"react-dom": "19.2.4"
|
|
20
|
+
},
|
|
21
|
+
"devDependencies": {
|
|
22
|
+
"@types/node": "^20",
|
|
23
|
+
"@types/react": "^19",
|
|
24
|
+
"@types/react-dom": "^19",
|
|
25
|
+
"eslint": "^9",
|
|
26
|
+
"eslint-config-next": "16.2.4",
|
|
27
|
+
"eslint-plugin-perfectionist": "^4.15.1",
|
|
28
|
+
"eslint-plugin-unused-imports": "^4.3.0",
|
|
29
|
+
"typescript": "^5"
|
|
30
|
+
}
|
|
31
|
+
}
|
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
html {
|
|
2
|
-
height: 100%;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
|
-
html,
|
|
6
|
-
body {
|
|
7
|
-
max-width: 100vw;
|
|
8
|
-
overflow-x: hidden;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
body {
|
|
12
|
-
min-height: 100%;
|
|
13
|
-
display: flex;
|
|
14
|
-
flex-direction: column;
|
|
15
|
-
-webkit-font-smoothing: antialiased;
|
|
16
|
-
-moz-osx-font-smoothing: grayscale;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
* {
|
|
20
|
-
margin: 0;
|
|
21
|
-
padding: 0;
|
|
22
|
-
box-sizing: border-box;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
a {
|
|
26
|
-
color: inherit;
|
|
27
|
-
text-decoration: none;
|
|
28
|
-
}
|
|
1
|
+
html {
|
|
2
|
+
height: 100%;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
html,
|
|
6
|
+
body {
|
|
7
|
+
max-width: 100vw;
|
|
8
|
+
overflow-x: hidden;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
body {
|
|
12
|
+
min-height: 100%;
|
|
13
|
+
display: flex;
|
|
14
|
+
flex-direction: column;
|
|
15
|
+
-webkit-font-smoothing: antialiased;
|
|
16
|
+
-moz-osx-font-smoothing: grayscale;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
* {
|
|
20
|
+
margin: 0;
|
|
21
|
+
padding: 0;
|
|
22
|
+
box-sizing: border-box;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
a {
|
|
26
|
+
color: inherit;
|
|
27
|
+
text-decoration: none;
|
|
28
|
+
}
|
|
@@ -1,42 +1,42 @@
|
|
|
1
|
-
import "./globals.css";
|
|
2
|
-
|
|
3
|
-
import { Geist, Geist_Mono } from "next/font/google";
|
|
4
|
-
|
|
5
|
-
import type { Metadata } from "next";
|
|
6
|
-
|
|
7
|
-
import { ThemeProvider } from "@/theme/theme-provider";
|
|
8
|
-
|
|
9
|
-
// ---------------------------------------------------------------
|
|
10
|
-
|
|
11
|
-
const geistSans = Geist({
|
|
12
|
-
variable: "--font-geist-sans",
|
|
13
|
-
subsets: ["latin"],
|
|
14
|
-
});
|
|
15
|
-
|
|
16
|
-
const geistMono = Geist_Mono({
|
|
17
|
-
variable: "--font-geist-mono",
|
|
18
|
-
subsets: ["latin"],
|
|
19
|
-
});
|
|
20
|
-
|
|
21
|
-
export const metadata: Metadata = {
|
|
22
|
-
title: "create-next-mui",
|
|
23
|
-
description: "create your nextjs project with mui setup",
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
export default function RootLayout({
|
|
27
|
-
children,
|
|
28
|
-
}: Readonly<{
|
|
29
|
-
children: React.ReactNode;
|
|
30
|
-
}>) {
|
|
31
|
-
return (
|
|
32
|
-
<html
|
|
33
|
-
lang="en"
|
|
34
|
-
suppressHydrationWarning
|
|
35
|
-
className={`${geistSans.variable} ${geistMono.variable}`}
|
|
36
|
-
>
|
|
37
|
-
<body>
|
|
38
|
-
<ThemeProvider> {children} </ThemeProvider>
|
|
39
|
-
</body>
|
|
40
|
-
</html>
|
|
41
|
-
);
|
|
42
|
-
}
|
|
1
|
+
import "./globals.css";
|
|
2
|
+
|
|
3
|
+
import { Geist, Geist_Mono } from "next/font/google";
|
|
4
|
+
|
|
5
|
+
import type { Metadata } from "next";
|
|
6
|
+
|
|
7
|
+
import { ThemeProvider } from "@/theme/theme-provider";
|
|
8
|
+
|
|
9
|
+
// ---------------------------------------------------------------
|
|
10
|
+
|
|
11
|
+
const geistSans = Geist({
|
|
12
|
+
variable: "--font-geist-sans",
|
|
13
|
+
subsets: ["latin"],
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
const geistMono = Geist_Mono({
|
|
17
|
+
variable: "--font-geist-mono",
|
|
18
|
+
subsets: ["latin"],
|
|
19
|
+
});
|
|
20
|
+
|
|
21
|
+
export const metadata: Metadata = {
|
|
22
|
+
title: "create-next-mui",
|
|
23
|
+
description: "create your nextjs project with mui setup",
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
export default function RootLayout({
|
|
27
|
+
children,
|
|
28
|
+
}: Readonly<{
|
|
29
|
+
children: React.ReactNode;
|
|
30
|
+
}>) {
|
|
31
|
+
return (
|
|
32
|
+
<html
|
|
33
|
+
lang="en"
|
|
34
|
+
suppressHydrationWarning
|
|
35
|
+
className={`${geistSans.variable} ${geistMono.variable}`}
|
|
36
|
+
>
|
|
37
|
+
<body>
|
|
38
|
+
<ThemeProvider> {children} </ThemeProvider>
|
|
39
|
+
</body>
|
|
40
|
+
</html>
|
|
41
|
+
);
|
|
42
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { HomeView } from "@/sections/home/view";
|
|
2
|
-
|
|
3
|
-
// ---------------------------------------------------------------
|
|
4
|
-
|
|
5
|
-
export default function Page() {
|
|
6
|
-
return <HomeView />;
|
|
7
|
-
}
|
|
1
|
+
import { HomeView } from "@/sections/home/view";
|
|
2
|
+
|
|
3
|
+
// ---------------------------------------------------------------
|
|
4
|
+
|
|
5
|
+
export default function Page() {
|
|
6
|
+
return <HomeView />;
|
|
7
|
+
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
import Link, { type LinkProps } from "next/link";
|
|
4
|
-
|
|
5
|
-
export { Link as RouterLink, LinkProps as RouterLinkProps };
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import Link, { type LinkProps } from "next/link";
|
|
4
|
+
|
|
5
|
+
export { Link as RouterLink, LinkProps as RouterLinkProps };
|
|
@@ -1,49 +1,49 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
import Box from "@mui/material/Box";
|
|
4
|
-
import Stack from "@mui/material/Stack";
|
|
5
|
-
import Button from "@mui/material/Button";
|
|
6
|
-
import Container from "@mui/material/Container";
|
|
7
|
-
import Typography from "@mui/material/Typography";
|
|
8
|
-
import { RouterLink } from "@/lib/router-link";
|
|
9
|
-
|
|
10
|
-
// ---------------------------------------------------------------
|
|
11
|
-
|
|
12
|
-
export function HomeView() {
|
|
13
|
-
return (
|
|
14
|
-
<Container maxWidth="md">
|
|
15
|
-
<Box
|
|
16
|
-
sx={{
|
|
17
|
-
minHeight: "100vh",
|
|
18
|
-
display: "flex",
|
|
19
|
-
alignItems: "center",
|
|
20
|
-
justifyContent: "center",
|
|
21
|
-
}}
|
|
22
|
-
>
|
|
23
|
-
<Stack spacing={3} sx={{ alignItems: "center", textAlign: "center" }}>
|
|
24
|
-
<Typography variant="h2" component="h1">
|
|
25
|
-
Workspace Scaffolded Successfully!
|
|
26
|
-
</Typography>
|
|
27
|
-
<Typography variant="h6" color="text.secondary">
|
|
28
|
-
Next.js App Router + Modular MUI Theming System + Perfectionist
|
|
29
|
-
Linting Rules are locked and loaded.
|
|
30
|
-
</Typography>
|
|
31
|
-
<Stack direction="row" spacing={2}>
|
|
32
|
-
<Button variant="contained" color="primary" size="large">
|
|
33
|
-
Explore Theme Configuration
|
|
34
|
-
</Button>
|
|
35
|
-
<Button
|
|
36
|
-
size="large"
|
|
37
|
-
color="secondary"
|
|
38
|
-
variant="outlined"
|
|
39
|
-
LinkComponent={RouterLink}
|
|
40
|
-
href="/"
|
|
41
|
-
>
|
|
42
|
-
Read Documentation
|
|
43
|
-
</Button>
|
|
44
|
-
</Stack>
|
|
45
|
-
</Stack>
|
|
46
|
-
</Box>
|
|
47
|
-
</Container>
|
|
48
|
-
);
|
|
49
|
-
}
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import Box from "@mui/material/Box";
|
|
4
|
+
import Stack from "@mui/material/Stack";
|
|
5
|
+
import Button from "@mui/material/Button";
|
|
6
|
+
import Container from "@mui/material/Container";
|
|
7
|
+
import Typography from "@mui/material/Typography";
|
|
8
|
+
import { RouterLink } from "@/lib/router-link";
|
|
9
|
+
|
|
10
|
+
// ---------------------------------------------------------------
|
|
11
|
+
|
|
12
|
+
export function HomeView() {
|
|
13
|
+
return (
|
|
14
|
+
<Container maxWidth="md">
|
|
15
|
+
<Box
|
|
16
|
+
sx={{
|
|
17
|
+
minHeight: "100vh",
|
|
18
|
+
display: "flex",
|
|
19
|
+
alignItems: "center",
|
|
20
|
+
justifyContent: "center",
|
|
21
|
+
}}
|
|
22
|
+
>
|
|
23
|
+
<Stack spacing={3} sx={{ alignItems: "center", textAlign: "center" }}>
|
|
24
|
+
<Typography variant="h2" component="h1">
|
|
25
|
+
Workspace Scaffolded Successfully!
|
|
26
|
+
</Typography>
|
|
27
|
+
<Typography variant="h6" color="text.secondary">
|
|
28
|
+
Next.js App Router + Modular MUI Theming System + Perfectionist
|
|
29
|
+
Linting Rules are locked and loaded.
|
|
30
|
+
</Typography>
|
|
31
|
+
<Stack direction="row" spacing={2}>
|
|
32
|
+
<Button variant="contained" color="primary" size="large">
|
|
33
|
+
Explore Theme Configuration
|
|
34
|
+
</Button>
|
|
35
|
+
<Button
|
|
36
|
+
size="large"
|
|
37
|
+
color="secondary"
|
|
38
|
+
variant="outlined"
|
|
39
|
+
LinkComponent={RouterLink}
|
|
40
|
+
href="/"
|
|
41
|
+
>
|
|
42
|
+
Read Documentation
|
|
43
|
+
</Button>
|
|
44
|
+
</Stack>
|
|
45
|
+
</Stack>
|
|
46
|
+
</Box>
|
|
47
|
+
</Container>
|
|
48
|
+
);
|
|
49
|
+
}
|
|
@@ -1,46 +1,46 @@
|
|
|
1
|
-
{
|
|
2
|
-
"error": {
|
|
3
|
-
"light": "#FF6183",
|
|
4
|
-
"main": "#DC103C",
|
|
5
|
-
"dark": "#AD1032",
|
|
6
|
-
"contrastText": "#FFFFFF"
|
|
7
|
-
},
|
|
8
|
-
"info": {
|
|
9
|
-
"light": "#4FB0E1",
|
|
10
|
-
"main": "#008BD1",
|
|
11
|
-
"dark": "#005D8B",
|
|
12
|
-
"contrastText": "#FFFFFF"
|
|
13
|
-
},
|
|
14
|
-
"success": {
|
|
15
|
-
"light": "#34FA91",
|
|
16
|
-
"main": "#0CC663",
|
|
17
|
-
"dark": "#0A974C",
|
|
18
|
-
"contrastText": "#FFFFFF"
|
|
19
|
-
},
|
|
20
|
-
"warning": {
|
|
21
|
-
"light": "#E4A942",
|
|
22
|
-
"main": "#E79200",
|
|
23
|
-
"dark": "#AC7312",
|
|
24
|
-
"contrastText": "#FFFFFF"
|
|
25
|
-
},
|
|
26
|
-
"purple": {
|
|
27
|
-
"light": "#A463E5",
|
|
28
|
-
"main": "#9437F1",
|
|
29
|
-
"dark": "#6C0CCB",
|
|
30
|
-
"contrastText": "#FFFFFF"
|
|
31
|
-
},
|
|
32
|
-
|
|
33
|
-
"grey": {
|
|
34
|
-
"50": "#FFFFFF",
|
|
35
|
-
"100": "#FFF5F5",
|
|
36
|
-
"200": "#F4F4F4",
|
|
37
|
-
"300": "#F2F2F2",
|
|
38
|
-
"400": "#D8D3D3",
|
|
39
|
-
"500": "#D2D2D2",
|
|
40
|
-
"600": "#C2C2C2",
|
|
41
|
-
"700": "#959595",
|
|
42
|
-
"800": "#3E3E3E",
|
|
43
|
-
"900": "#141615",
|
|
44
|
-
"950": "#000000"
|
|
45
|
-
}
|
|
46
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"error": {
|
|
3
|
+
"light": "#FF6183",
|
|
4
|
+
"main": "#DC103C",
|
|
5
|
+
"dark": "#AD1032",
|
|
6
|
+
"contrastText": "#FFFFFF"
|
|
7
|
+
},
|
|
8
|
+
"info": {
|
|
9
|
+
"light": "#4FB0E1",
|
|
10
|
+
"main": "#008BD1",
|
|
11
|
+
"dark": "#005D8B",
|
|
12
|
+
"contrastText": "#FFFFFF"
|
|
13
|
+
},
|
|
14
|
+
"success": {
|
|
15
|
+
"light": "#34FA91",
|
|
16
|
+
"main": "#0CC663",
|
|
17
|
+
"dark": "#0A974C",
|
|
18
|
+
"contrastText": "#FFFFFF"
|
|
19
|
+
},
|
|
20
|
+
"warning": {
|
|
21
|
+
"light": "#E4A942",
|
|
22
|
+
"main": "#E79200",
|
|
23
|
+
"dark": "#AC7312",
|
|
24
|
+
"contrastText": "#FFFFFF"
|
|
25
|
+
},
|
|
26
|
+
"purple": {
|
|
27
|
+
"light": "#A463E5",
|
|
28
|
+
"main": "#9437F1",
|
|
29
|
+
"dark": "#6C0CCB",
|
|
30
|
+
"contrastText": "#FFFFFF"
|
|
31
|
+
},
|
|
32
|
+
|
|
33
|
+
"grey": {
|
|
34
|
+
"50": "#FFFFFF",
|
|
35
|
+
"100": "#FFF5F5",
|
|
36
|
+
"200": "#F4F4F4",
|
|
37
|
+
"300": "#F2F2F2",
|
|
38
|
+
"400": "#D8D3D3",
|
|
39
|
+
"500": "#D2D2D2",
|
|
40
|
+
"600": "#C2C2C2",
|
|
41
|
+
"700": "#959595",
|
|
42
|
+
"800": "#3E3E3E",
|
|
43
|
+
"900": "#141615",
|
|
44
|
+
"950": "#000000"
|
|
45
|
+
}
|
|
46
|
+
}
|
|
@@ -1,35 +1,35 @@
|
|
|
1
|
-
import { Theme, Components } from "@mui/material";
|
|
2
|
-
|
|
3
|
-
import type {} from "@mui/material/themeCssVarsAugmentation";
|
|
4
|
-
|
|
5
|
-
// ---------------------------------------------------------------
|
|
6
|
-
|
|
7
|
-
const MuiButton: Components<Theme>["MuiButton"] = {
|
|
8
|
-
styleOverrides: {
|
|
9
|
-
root: ({ theme }) => ({
|
|
10
|
-
textTransform: "unset",
|
|
11
|
-
borderRadius: theme.spacing(1.5),
|
|
12
|
-
color: theme.vars.palette.common.black,
|
|
13
|
-
variants: [
|
|
14
|
-
{
|
|
15
|
-
props: { variant: "contained" },
|
|
16
|
-
style: {
|
|
17
|
-
borderRadius: theme.spacing(1.5),
|
|
18
|
-
color: theme.vars.palette.common.white,
|
|
19
|
-
backgroundColor: theme.vars.palette.grey[900],
|
|
20
|
-
},
|
|
21
|
-
},
|
|
22
|
-
{
|
|
23
|
-
props: { variant: "outlined" },
|
|
24
|
-
style: {
|
|
25
|
-
borderRadius: theme.spacing(1.5),
|
|
26
|
-
color: theme.vars.palette.common.black,
|
|
27
|
-
borderColor: theme.vars.palette.common.black,
|
|
28
|
-
},
|
|
29
|
-
},
|
|
30
|
-
],
|
|
31
|
-
}),
|
|
32
|
-
},
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
export { MuiButton };
|
|
1
|
+
import { Theme, Components } from "@mui/material";
|
|
2
|
+
|
|
3
|
+
import type {} from "@mui/material/themeCssVarsAugmentation";
|
|
4
|
+
|
|
5
|
+
// ---------------------------------------------------------------
|
|
6
|
+
|
|
7
|
+
const MuiButton: Components<Theme>["MuiButton"] = {
|
|
8
|
+
styleOverrides: {
|
|
9
|
+
root: ({ theme }) => ({
|
|
10
|
+
textTransform: "unset",
|
|
11
|
+
borderRadius: theme.spacing(1.5),
|
|
12
|
+
color: theme.vars.palette.common.black,
|
|
13
|
+
variants: [
|
|
14
|
+
{
|
|
15
|
+
props: { variant: "contained" },
|
|
16
|
+
style: {
|
|
17
|
+
borderRadius: theme.spacing(1.5),
|
|
18
|
+
color: theme.vars.palette.common.white,
|
|
19
|
+
backgroundColor: theme.vars.palette.grey[900],
|
|
20
|
+
},
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
props: { variant: "outlined" },
|
|
24
|
+
style: {
|
|
25
|
+
borderRadius: theme.spacing(1.5),
|
|
26
|
+
color: theme.vars.palette.common.black,
|
|
27
|
+
borderColor: theme.vars.palette.common.black,
|
|
28
|
+
},
|
|
29
|
+
},
|
|
30
|
+
],
|
|
31
|
+
}),
|
|
32
|
+
},
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
export { MuiButton };
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import { Theme, Components } from "@mui/material";
|
|
2
|
-
|
|
3
|
-
import type {} from "@mui/material/themeCssVarsAugmentation";
|
|
4
|
-
|
|
5
|
-
// ---------------------------------------------------------------
|
|
6
|
-
|
|
7
|
-
const MuiCard: Components<Theme>["MuiCard"] = {
|
|
8
|
-
styleOverrides: {
|
|
9
|
-
root: ({ theme }) => ({
|
|
10
|
-
borderRadius: theme.spacing(2.5),
|
|
11
|
-
boxShadow: `-4px -4px 24px 4px rgba(20, 22, 21, 0.04),
|
|
12
|
-
4px 12px 12px 4px rgba(20, 22, 21, 0.04)`,
|
|
13
|
-
}),
|
|
14
|
-
},
|
|
15
|
-
};
|
|
16
|
-
|
|
17
|
-
export { MuiCard };
|
|
1
|
+
import { Theme, Components } from "@mui/material";
|
|
2
|
+
|
|
3
|
+
import type {} from "@mui/material/themeCssVarsAugmentation";
|
|
4
|
+
|
|
5
|
+
// ---------------------------------------------------------------
|
|
6
|
+
|
|
7
|
+
const MuiCard: Components<Theme>["MuiCard"] = {
|
|
8
|
+
styleOverrides: {
|
|
9
|
+
root: ({ theme }) => ({
|
|
10
|
+
borderRadius: theme.spacing(2.5),
|
|
11
|
+
boxShadow: `-4px -4px 24px 4px rgba(20, 22, 21, 0.04),
|
|
12
|
+
4px 12px 12px 4px rgba(20, 22, 21, 0.04)`,
|
|
13
|
+
}),
|
|
14
|
+
},
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
export { MuiCard };
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { MuiCard } from "./card";
|
|
2
|
-
import { MuiButton } from "./button";
|
|
3
|
-
|
|
4
|
-
// ---------------------------------------------------------------
|
|
5
|
-
|
|
6
|
-
export const components = {
|
|
7
|
-
MuiCard,
|
|
8
|
-
MuiButton,
|
|
9
|
-
};
|
|
1
|
+
import { MuiCard } from "./card";
|
|
2
|
+
import { MuiButton } from "./button";
|
|
3
|
+
|
|
4
|
+
// ---------------------------------------------------------------
|
|
5
|
+
|
|
6
|
+
export const components = {
|
|
7
|
+
MuiCard,
|
|
8
|
+
MuiButton,
|
|
9
|
+
};
|
|
@@ -1,34 +1,34 @@
|
|
|
1
|
-
import COLORS from "./colors.json";
|
|
2
|
-
|
|
3
|
-
// ---------------------------------------------------------------
|
|
4
|
-
|
|
5
|
-
const GREY = COLORS.grey;
|
|
6
|
-
|
|
7
|
-
const INFO = COLORS.info;
|
|
8
|
-
const ERROR = COLORS.error;
|
|
9
|
-
const SUCCESS = COLORS.success;
|
|
10
|
-
const WARNING = COLORS.warning;
|
|
11
|
-
|
|
12
|
-
const PURPLE = COLORS.purple;
|
|
13
|
-
|
|
14
|
-
// ---------------------------------------------------------------
|
|
15
|
-
|
|
16
|
-
export const palette = {
|
|
17
|
-
grey: GREY,
|
|
18
|
-
info: INFO,
|
|
19
|
-
error: ERROR,
|
|
20
|
-
purple: PURPLE,
|
|
21
|
-
success: SUCCESS,
|
|
22
|
-
warning: WARNING,
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
// ---------------------------------------------------------------
|
|
26
|
-
|
|
27
|
-
declare module "@mui/material/styles" {
|
|
28
|
-
interface Palette {
|
|
29
|
-
purple: Palette["primary"];
|
|
30
|
-
}
|
|
31
|
-
interface PaletteOptions {
|
|
32
|
-
purple?: PaletteOptions["primary"];
|
|
33
|
-
}
|
|
34
|
-
}
|
|
1
|
+
import COLORS from "./colors.json";
|
|
2
|
+
|
|
3
|
+
// ---------------------------------------------------------------
|
|
4
|
+
|
|
5
|
+
const GREY = COLORS.grey;
|
|
6
|
+
|
|
7
|
+
const INFO = COLORS.info;
|
|
8
|
+
const ERROR = COLORS.error;
|
|
9
|
+
const SUCCESS = COLORS.success;
|
|
10
|
+
const WARNING = COLORS.warning;
|
|
11
|
+
|
|
12
|
+
const PURPLE = COLORS.purple;
|
|
13
|
+
|
|
14
|
+
// ---------------------------------------------------------------
|
|
15
|
+
|
|
16
|
+
export const palette = {
|
|
17
|
+
grey: GREY,
|
|
18
|
+
info: INFO,
|
|
19
|
+
error: ERROR,
|
|
20
|
+
purple: PURPLE,
|
|
21
|
+
success: SUCCESS,
|
|
22
|
+
warning: WARNING,
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
// ---------------------------------------------------------------
|
|
26
|
+
|
|
27
|
+
declare module "@mui/material/styles" {
|
|
28
|
+
interface Palette {
|
|
29
|
+
purple: Palette["primary"];
|
|
30
|
+
}
|
|
31
|
+
interface PaletteOptions {
|
|
32
|
+
purple?: PaletteOptions["primary"];
|
|
33
|
+
}
|
|
34
|
+
}
|