forked from CITKParus/P8-Panels
131 lines
3.4 KiB
JavaScript
131 lines
3.4 KiB
JavaScript
import { createTheme } from "@mui/material/styles"; //Интерфейсные элементы
|
|
|
|
//---------
|
|
//Константы
|
|
//---------
|
|
|
|
//Насыщенность шрифта
|
|
const FONT_WEIGHT_NORMAL = 400;
|
|
const FONT_WEIGHT_BOLD = 700;
|
|
|
|
//Выравнивание текста
|
|
const TEXT_ALIGN_CENTER = "center";
|
|
|
|
//Стиль для детализации прогресса и сообщения таблицы детализации
|
|
const smallSizedText = {
|
|
fontSize: "12px",
|
|
fontWeight: FONT_WEIGHT_NORMAL,
|
|
whiteSpace: "pre-line",
|
|
textAlign: TEXT_ALIGN_CENTER,
|
|
wordWrap: "break-word",
|
|
letterSpacing: "0.00938em",
|
|
lineHeight: "1.5"
|
|
};
|
|
|
|
//Стили кастомных шрифтов
|
|
const customTypography = {
|
|
h1: {
|
|
fontSize: "40px",
|
|
fontWeight: FONT_WEIGHT_NORMAL,
|
|
textAlign: TEXT_ALIGN_CENTER
|
|
},
|
|
h2: {
|
|
fontSize: "40px",
|
|
fontWeight: FONT_WEIGHT_BOLD,
|
|
textAlign: TEXT_ALIGN_CENTER
|
|
},
|
|
h3: {
|
|
fontSize: "30px",
|
|
fontWeight: FONT_WEIGHT_BOLD,
|
|
textAlign: TEXT_ALIGN_CENTER
|
|
},
|
|
h4: {
|
|
fontSize: "16px",
|
|
fontWeight: FONT_WEIGHT_NORMAL,
|
|
textAlign: TEXT_ALIGN_CENTER
|
|
},
|
|
subtitle1: {
|
|
fontSize: "30px",
|
|
fontWeight: FONT_WEIGHT_NORMAL,
|
|
textAlign: TEXT_ALIGN_CENTER
|
|
},
|
|
subtitle2: {
|
|
fontSize: "20px",
|
|
fontWeight: FONT_WEIGHT_BOLD,
|
|
textAlign: TEXT_ALIGN_CENTER
|
|
},
|
|
body3: {
|
|
fontSize: "9px",
|
|
whiteSpace: "pre-line",
|
|
textAlign: TEXT_ALIGN_CENTER
|
|
},
|
|
PlanSpecInfo: {
|
|
fontSize: "14px",
|
|
fontWeight: FONT_WEIGHT_NORMAL,
|
|
textAlign: TEXT_ALIGN_CENTER,
|
|
wordWrap: "break-word",
|
|
letterSpacing: "0.00938em",
|
|
lineHeight: "1.5"
|
|
},
|
|
PlanSpecProgressDetail: {
|
|
...smallSizedText
|
|
},
|
|
ProductDetailMessage: {
|
|
...smallSizedText
|
|
}
|
|
};
|
|
|
|
//---------
|
|
//Описание темы
|
|
//---------
|
|
|
|
const lightTheme = createTheme({
|
|
palette: {
|
|
type: "light",
|
|
background: {
|
|
main: "#fff",
|
|
secondary: "#fff",
|
|
progress: "#fff",
|
|
detail_table: "#fff",
|
|
detail_info: "#fff",
|
|
product_selector: "#fff",
|
|
plans_zero_docs: "#ebecec",
|
|
plans_drawer_paper: "#fff"
|
|
},
|
|
text: {
|
|
title: { fontColor: "rgba(0, 0, 0, 0.65)" },
|
|
detail_table: { fontColor: "rgba(0, 0, 0, 0.87)" },
|
|
secondary: { fontColor: "rgba(0, 0, 0, 0.298)" },
|
|
plans_finder: { fontColor: "black" },
|
|
more_button: { fontColor: "#1976d2" }
|
|
}
|
|
},
|
|
typography: { ...customTypography }
|
|
});
|
|
|
|
const darkTheme = createTheme({
|
|
palette: {
|
|
type: "dark",
|
|
background: {
|
|
main: "#161616",
|
|
secondary: "#d2d2d2",
|
|
progress: "#e8e8e8",
|
|
detail_table: "#3f3f3f",
|
|
detail_info: "#d0d0d0",
|
|
product_selector: "#eee",
|
|
plans_zero_docs: "#323232",
|
|
plans_drawer_paper: "#3f3f3f"
|
|
},
|
|
text: {
|
|
title: { fontColor: "#fff" },
|
|
detail_table: { fontColor: "#fff" },
|
|
secondary: { fontColor: "rgba(0, 0, 0, 0.298)" },
|
|
plans_finder: { fontColor: "#fff" },
|
|
more_button: { fontColor: "#fff" }
|
|
}
|
|
},
|
|
typography: { ...customTypography }
|
|
});
|
|
|
|
export { lightTheme, darkTheme };
|