fork refine

This commit is contained in:
Stefan Pejcic
2024-02-05 10:23:04 +01:00
parent 3fffde9a8f
commit 8496a83edb
3634 changed files with 715528 additions and 2 deletions

View File

@@ -0,0 +1,101 @@
import type { Theme, ThemeOptions } from "@mui/material/styles";
import { createTheme } from "@mui/material/styles";
import { lightPalette } from "./palette/lightPalette";
import { darkPalette } from "./palette/darkPalette";
import { typography } from "./typography";
import { RefinePalettes } from "./palette";
const commonThemeProperties: ThemeOptions = {
shape: {
borderRadius: 6,
},
typography: {
...typography,
},
};
const LightTheme = createTheme({
...commonThemeProperties,
palette: lightPalette,
components: {
MuiAppBar: {
styleOverrides: {
colorDefault: {
backgroundColor: "#fff",
},
},
},
MuiPaper: {
styleOverrides: {
root: {
backgroundImage:
"linear-gradient(rgba(255, 255, 255, 0.01), rgba(255, 255, 255, 0.01))",
},
},
},
MuiTypography: {
styleOverrides: {
h5: {
fontWeight: 800,
lineHeight: "2rem",
},
},
},
},
});
const DarkTheme = createTheme({
...commonThemeProperties,
palette: darkPalette,
components: {
MuiPaper: {
styleOverrides: {
root: {
backgroundImage:
"linear-gradient(rgba(255, 255, 255, 0.025), rgba(255, 255, 255, 0.025))",
},
},
},
MuiAppBar: {
defaultProps: {
color: "transparent",
},
},
MuiTypography: {
styleOverrides: {
h5: {
fontWeight: 800,
lineHeight: "2rem",
},
},
},
},
});
const RefineThemes = Object.keys(RefinePalettes).reduce((acc, key) => {
const paletteName = key as keyof typeof RefinePalettes;
return {
...acc,
[key]: createTheme({
palette: {
...RefinePalettes[paletteName],
},
components: {
MuiButton: {
styleOverrides: {
root: ({ ownerState }) => ({
...(ownerState.variant === "contained" &&
ownerState.color === "primary" && {
color: "#fff",
}),
}),
},
},
},
}),
};
}, {}) as Record<keyof typeof RefinePalettes, Theme>;
export { LightTheme, DarkTheme, RefineThemes };

View File

@@ -0,0 +1,39 @@
import type { PaletteOptions } from "@mui/material/styles";
export const darkPalette: PaletteOptions = {
mode: "dark",
primary: {
main: "#67be23",
contrastText: "#fff",
},
secondary: {
main: "#2A132E",
contrastText: "#fff",
},
background: {
default: "#212121",
paper: "#242424",
},
success: {
main: "#67be23",
contrastText: "#fff",
},
error: {
main: "#ee2a1e",
contrastText: "#fff",
},
warning: {
main: "#fa8c16",
contrastText: "#fff",
},
info: {
main: "#1890ff",
contrastText: "#fff",
},
divider: "rgba(0,0,0,0)",
text: {
primary: "#fff",
secondary: "rgba(255,255,255,0.7)",
disabled: "#d1d1d1",
},
};

View File

@@ -0,0 +1,3 @@
export { darkPalette } from "./darkPalette";
export { lightPalette } from "./lightPalette";
export { RefinePalettes } from "./refinePalette";

View File

@@ -0,0 +1,39 @@
import type { PaletteOptions } from "@mui/material/styles";
export const lightPalette: PaletteOptions = {
mode: "light",
primary: {
main: "#67be23",
contrastText: "#fff",
},
secondary: {
main: "#2A132E",
contrastText: "#fff",
},
background: {
default: "#f0f0f0",
paper: "#ffffff",
},
success: {
main: "#67be23",
contrastText: "#fff",
},
error: {
main: "#fa541c",
contrastText: "#fff",
},
warning: {
main: "#fa8c16",
contrastText: "#fff",
},
info: {
main: "#0b82f0",
contrastText: "#fff",
},
divider: "rgba(0,0,0,0)",
text: {
primary: "#626262",
secondary: "#9f9f9f",
disabled: "#c1c1c1",
},
};

View File

@@ -0,0 +1,114 @@
export const RefinePalettes = {
Blue: {
mode: "light",
primary: {
main: "#1976D2",
light: "#4791db",
dark: "#115293",
},
},
BlueDark: {
mode: "dark",
primary: {
main: "#67b7f7",
light: "#85c5f8",
dark: "#4880ac",
},
},
Purple: {
mode: "light",
primary: {
main: "#7B1FA2",
light: "#954bb4",
dark: "#561571",
},
},
PurpleDark: {
mode: "dark",
primary: {
main: "#AB47BC",
light: "#bb6bc9",
dark: "#773183",
},
},
Magenta: {
mode: "light",
primary: {
main: "#C2185B",
light: "#ce467b",
dark: "#87103f",
},
},
MagentaDark: {
mode: "dark",
primary: {
main: "#EC407A",
light: "#ef6694",
dark: "#a52c55",
},
},
Red: {
mode: "light",
primary: {
main: "#D32F2F",
light: "#db5858",
dark: "#932020",
},
},
RedDark: {
mode: "dark",
primary: {
main: "#EF5350",
light: "#f27573",
dark: "#a73a38",
},
},
Orange: {
mode: "light",
primary: {
main: "#F57C00",
light: "#f79633",
dark: "#ab5600",
},
},
OrangeDark: {
mode: "dark",
primary: {
main: "#FFA726",
light: "#ffb851",
dark: "#b2741a",
},
},
Yellow: {
mode: "light",
primary: {
main: "#FFA000",
light: "#ffb333",
dark: "#b27000",
},
},
YellowDark: {
mode: "dark",
primary: {
main: "#FFCA28",
light: "#ffd453",
dark: "#E87040",
},
},
Green: {
mode: "light",
primary: {
main: "#689F38",
light: "#86b25f",
dark: "#486f27",
},
},
GreenDark: {
mode: "dark",
primary: {
main: "#9CCC65",
light: "#afd683",
dark: "#6d8e46",
},
},
} as const;

View File

@@ -0,0 +1,17 @@
import type { TypographyVariantsOptions } from "@mui/material/styles";
export const typography: TypographyVariantsOptions = {
fontFamily: [
"Montserrat",
"-apple-system",
"BlinkMacSystemFont",
'"Segoe UI"',
"Roboto",
'"Helvetica Neue"',
"Arial",
"sans-serif",
'"Apple Color Emoji"',
'"Segoe UI Emoji"',
'"Segoe UI Symbol"',
].join(","),
};