diff --git a/src/Components/Content/index.tsx b/src/Components/Content/index.tsx index 4e1be81..a67fe2a 100644 --- a/src/Components/Content/index.tsx +++ b/src/Components/Content/index.tsx @@ -1,7 +1,6 @@ import * as React from "react"; import { Box } from "@mui/material"; -import theme from "../../theme"; -import Users from "../Users"; +import Support from "../Support"; const Content: React.FC = () => { @@ -13,9 +12,11 @@ const Content: React.FC = () => { display: "flex", flexDirection: "column", alignItems: "center", - overflowY: "scroll" + overflow: "auto", + overflowY: "auto", + padding: "60px" }}> - + ); diff --git a/src/Components/Error404/index.tsx b/src/Components/Error404/index.tsx index ec18095..bb28b21 100644 --- a/src/Components/Error404/index.tsx +++ b/src/Components/Error404/index.tsx @@ -5,7 +5,7 @@ import theme from "../../theme"; import CssBaseline from '@mui/material/CssBaseline'; -const Authorization: React.FC = () => { +const Error404: React.FC = () => { return ( @@ -54,4 +54,4 @@ const Authorization: React.FC = () => { } -export default Authorization; \ No newline at end of file +export default Error404; \ No newline at end of file diff --git a/src/Components/Header/index.tsx b/src/Components/Header/index.tsx index 0f44676..0155823 100644 --- a/src/Components/Header/index.tsx +++ b/src/Components/Header/index.tsx @@ -12,7 +12,8 @@ const Header: React.FC = () => { backgroundColor: theme.palette.menu.main, width: "100%", height: "85px", - borderBottom: "1px solid #45494c", + borderBottom: "1px solid", + borderColor: theme.palette.grayDark.main, display: "flex", justifyContent: "space-between" }}> diff --git a/src/Components/Pagination/index.tsx b/src/Components/Pagination/index.tsx new file mode 100644 index 0000000..27badda --- /dev/null +++ b/src/Components/Pagination/index.tsx @@ -0,0 +1,41 @@ +import * as React from "react"; +import { Box, Pagination } from "@mui/material"; +import theme from "../../theme"; + + +const Users: React.FC = () => { + return ( + + + + + + + + ); +} + + +export default Users; \ No newline at end of file diff --git a/src/Components/Support/index.tsx b/src/Components/Support/index.tsx new file mode 100644 index 0000000..eee1f17 --- /dev/null +++ b/src/Components/Support/index.tsx @@ -0,0 +1,306 @@ +import * as React from "react"; +import { Box, Button } from "@mui/material"; +import SearchOutlinedIcon from '@mui/icons-material/SearchOutlined'; +import HighlightOffOutlinedIcon from '@mui/icons-material/HighlightOffOutlined'; +import CircleIcon from '@mui/icons-material/Circle'; +import theme from "../../theme"; +import { green } from '@mui/material/colors'; +import Pagination from "../Pagination"; + + +const Users: React.FC = () => { + return ( + + + + + + + + + + + + + + + 10.09.2022 + + + ДЕНЬГИ НЕ ПРИШЛИ + + + + + + ИНФО + + + + + + 09.09.2022 + + + ВЫВОД + + + + + + ИНФО + + + + + + 09.09.2022 + + + ЗДРАВСТВУЙТЕ, МОЖНО ЛИ ОПЛАТИТЬ ЛИЦОМ НЕ ДОСТИГШИМ 18 ЛЕТ, ОПЛАТИТЬ 300 РУБЛЕЙ ЧЕРЕЗ КИВИ + + + + + + ИНФО + + + + + + 07.09.2022 + + + ПРОБЛЕМЫ С ВЫВОДОМ + + + + + + ИНФО + + + + + + + + + + + ); +} + + +export default Users; \ No newline at end of file diff --git a/src/Components/Users/index.tsx b/src/Components/Users/index.tsx index ef723d9..99ef391 100644 --- a/src/Components/Users/index.tsx +++ b/src/Components/Users/index.tsx @@ -22,14 +22,13 @@ const Users: React.FC = () => { variant="caption" sx={{ width: "90%", - height: "1660px", + height: "60px", display: "flex", flexDirection: "column", justifyContent: "center", alignItems: "center", border: "2px solid", fontWeight: "normal", - marginTop: "60px", borderColor: theme.palette.golden.main }}> ИНФОРМАЦИЯ О ПРОЕКТЕ @@ -45,7 +44,7 @@ const Users: React.FC = () => { @@ -81,7 +80,7 @@ const Users: React.FC = () => { @@ -113,7 +112,7 @@ const Users: React.FC = () => { @@ -196,7 +195,7 @@ const Users: React.FC = () => { backgroundColor: theme.palette.content.main, color: theme.palette.secondary.main, borderBottom: "1px solid", - borderColor: theme.palette.gray.main, + borderColor: theme.palette.grayLight.main, } }} InputLabelProps={{ style: { @@ -231,7 +230,7 @@ const Users: React.FC = () => { backgroundColor: theme.palette.content.main, color: theme.palette.secondary.main, borderBottom: "1px solid", - borderColor: theme.palette.gray.main, + borderColor: theme.palette.grayLight.main, } }} InputLabelProps={{ style: { diff --git a/src/theme.ts b/src/theme.ts index b3b60d6..d1a7a89 100644 --- a/src/theme.ts +++ b/src/theme.ts @@ -18,14 +18,23 @@ const theme = createTheme({ content: { main: "#26272c" }, - gray: { + grayLight: { main: "#707070" }, + grayDark: { + main: "#45494c" + }, + grayMedium: { + main: "#424242" + }, golden: { main: "#eaba5b" }, goldenDark: { main: "#fe9903" + }, + goldenMedium: { + main: "#2a2b1d" } }, @@ -88,7 +97,13 @@ declare module '@mui/material/styles' { content: { main: string; }, - gray: { + grayLight: { + main: string; + }, + grayDark: { + main: string; + }, + grayMedium: { main: string; }, golden: { @@ -97,14 +112,20 @@ declare module '@mui/material/styles' { goldenDark: { main: string; }, + goldenMedium: { + main: string; + } } } interface PaletteOptions { menu?: PaletteColorOptions; content?: PaletteColorOptions; - gray?: PaletteColorOptions; + grayLight?: PaletteColorOptions; + grayDark?: PaletteColorOptions; + grayMedium?: PaletteColorOptions; golden?: PaletteColorOptions; goldenDark?: PaletteColorOptions; + goldenMedium?: PaletteColorOptions; } // allow configuration using `createTheme` interface TypographyVariants {