styling; Map page is now at /; enable password reset page
This commit is contained in:
@ -47,7 +47,7 @@ const pages = [
|
|||||||
component: <PasswordReset />,
|
component: <PasswordReset />,
|
||||||
drawer: false,
|
drawer: false,
|
||||||
dashboard: false,
|
dashboard: false,
|
||||||
enabled: false,
|
enabled: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "Настройки",
|
label: "Настройки",
|
||||||
@ -61,8 +61,10 @@ const pages = [
|
|||||||
{
|
{
|
||||||
label: "Главная",
|
label: "Главная",
|
||||||
path: "/",
|
path: "/",
|
||||||
icon: <Home24Color />,
|
icon: <Map24Filled />,
|
||||||
component: <Main />,
|
component: <MapTest />,
|
||||||
|
// icon: <Home24Color />,
|
||||||
|
// component: <Main />,
|
||||||
drawer: true,
|
drawer: true,
|
||||||
dashboard: true,
|
dashboard: true,
|
||||||
enabled: true,
|
enabled: true,
|
||||||
@ -121,15 +123,15 @@ const pages = [
|
|||||||
dashboard: true,
|
dashboard: true,
|
||||||
enabled: true,
|
enabled: true,
|
||||||
},
|
},
|
||||||
{
|
// {
|
||||||
label: "ИКС",
|
// label: "ИКС",
|
||||||
path: "/map-test",
|
// path: "/map-test",
|
||||||
icon: <Map24Filled />,
|
// icon: <Map24Filled />,
|
||||||
component: <MapTest />,
|
// component: <MapTest />,
|
||||||
drawer: true,
|
// drawer: true,
|
||||||
dashboard: true,
|
// dashboard: true,
|
||||||
enabled: true,
|
// enabled: true,
|
||||||
},
|
// },
|
||||||
{
|
{
|
||||||
label: "Map line test",
|
label: "Map line test",
|
||||||
path: "/map-line-test",
|
path: "/map-line-test",
|
||||||
|
@ -15,7 +15,105 @@ export default function MainLayout() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={classes.root}>
|
<div className={classes.root}>
|
||||||
|
<Background />
|
||||||
|
<div style={{ position: 'absolute', inset: 0, display: 'flex', width: '100vw', height: '100vh' }}>
|
||||||
<Outlet />
|
<Outlet />
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const Background = () => {
|
||||||
|
return (
|
||||||
|
<svg id="corp-bg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 900" preserveAspectRatio="xMidYMid slice" style={{ width: '100%', height: '100vh', display: 'block' }}>
|
||||||
|
<defs>
|
||||||
|
<style>
|
||||||
|
{`:root {
|
||||||
|
--c1: #0f4c81; /* deep blue */
|
||||||
|
--c2: #1fb6ff; /* bright cyan */
|
||||||
|
--c3: #7bd389; /* muted green */
|
||||||
|
--muted: rgba(255,255,255,0.06);
|
||||||
|
}`}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<linearGradient id="grad-main" x1="0" x2="1" y1="0" y2="1">
|
||||||
|
<stop offset="0" stop-color="var(--c2)" stop-opacity="0.95" />
|
||||||
|
<stop offset="0.45" stop-color="var(--c1)" stop-opacity="0.95" />
|
||||||
|
<stop offset="1" stop-color="var(--c3)" stop-opacity="0.9" />
|
||||||
|
</linearGradient>
|
||||||
|
|
||||||
|
<filter id="f-blur">
|
||||||
|
<feGaussianBlur stdDeviation="40" result="b" />
|
||||||
|
<feColorMatrix type="matrix"
|
||||||
|
values="1 0 0 0 0
|
||||||
|
0 1 0 0 0
|
||||||
|
0 0 1 0 0
|
||||||
|
0 0 0 0.6 0" in="b" />
|
||||||
|
</filter>
|
||||||
|
|
||||||
|
<pattern id="dots" width="20" height="20" patternUnits="userSpaceOnUse">
|
||||||
|
<rect width="100%" height="100%" fill="none" />
|
||||||
|
<circle cx="2" cy="2" r="1.1" fill="white" fill-opacity="0.06" />
|
||||||
|
</pattern>
|
||||||
|
|
||||||
|
<pattern id="diagonal" width="12" height="12" patternUnits="userSpaceOnUse" patternTransform="rotate(20)">
|
||||||
|
<rect width="12" height="12" fill="transparent" />
|
||||||
|
<path d="M0 0 L0 1" stroke="white" stroke-opacity="0.02" stroke-width="1" />
|
||||||
|
</pattern>
|
||||||
|
|
||||||
|
<radialGradient id="spot" cx="70%" cy="20%" r="50%">
|
||||||
|
<stop offset="0" stop-color="#ffffff" stop-opacity="0.06" />
|
||||||
|
<stop offset="1" stop-color="#ffffff" stop-opacity="0" />
|
||||||
|
</radialGradient>
|
||||||
|
|
||||||
|
<clipPath id="blob-clip">
|
||||||
|
<path id="blobPath"
|
||||||
|
d="M420 80C520 10 760 10 890 100C1040 210 1080 360 980 470C880 580 640 620 480 540C300 440 320 180 420 80Z" />
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
|
||||||
|
<rect width="100%" height="100%" fill="url(#grad-main)" />
|
||||||
|
|
||||||
|
<g filter="url(#f-blur)" opacity="0.95">
|
||||||
|
<path d="M-60 150 C180 40 420 10 700 120 C1040 260 1180 520 960 760 C760 980 420 920 140 800 C-80 700 -40 300 -60 150 Z"
|
||||||
|
fill="white" fill-opacity="0.02" />
|
||||||
|
<path d="M1200 40 C1060 -20 900 10 760 120 C620 240 620 420 760 560 C900 700 1160 760 1320 640 C1460 540 1440 200 1200 40 Z"
|
||||||
|
fill="white" fill-opacity="0.03" />
|
||||||
|
</g>
|
||||||
|
|
||||||
|
<g transform="translate(60,30) scale(1.2)" opacity="0.9">
|
||||||
|
<g clip-path="url(#blob-clip)">
|
||||||
|
<rect width="100%" height="100%" fill="url(#spot)" />
|
||||||
|
</g>
|
||||||
|
<path id="morph" fill="white" fill-opacity="0.06">
|
||||||
|
<animate attributeName="d"
|
||||||
|
dur="18s"
|
||||||
|
repeatCount="indefinite"
|
||||||
|
values="
|
||||||
|
M420 80C520 10 760 10 890 100C1040 210 1080 360 980 470C880 580 640 620 480 540C300 440 320 180 420 80Z;
|
||||||
|
M380 60C520 0 760 40 930 120C1080 220 1060 360 940 460C800 560 600 620 420 560C240 500 250 200 380 60Z;
|
||||||
|
M440 100C580 30 820 10 980 140C1130 280 1100 430 980 540C840 660 600 680 420 600C220 500 300 160 440 100Z;
|
||||||
|
M420 80C520 10 760 10 890 100C1040 210 1080 360 980 470C880 580 640 620 480 540C300 440 320 180 420 80Z"/>
|
||||||
|
</path>
|
||||||
|
</g>
|
||||||
|
|
||||||
|
<g opacity="0.12">
|
||||||
|
<rect x="40" y="60" width="360" height="620" rx="20" fill="url(#diagonal)" />
|
||||||
|
<rect x="980" y="80" width="380" height="540" rx="26" fill="url(#dots)" />
|
||||||
|
</g>
|
||||||
|
|
||||||
|
<g>
|
||||||
|
<rect x="80" y="420" width="1280" height="120" rx="60" fill="white" fill-opacity="0.02" transform="skewX(-18)" />
|
||||||
|
<rect x="-60" y="260" width="820" height="60" rx="30" fill="white" fill-opacity="0.015" transform="skewX(10)" />
|
||||||
|
</g>
|
||||||
|
|
||||||
|
<g stroke="white" stroke-opacity="0.06" stroke-width="1" fill="none">
|
||||||
|
<path d="M120 720 C320 600 520 540 720 580 C920 620 1120 760 1360 700" />
|
||||||
|
<path d="M40 620 C240 540 460 460 680 490 C920 520 1080 680 1360 640" />
|
||||||
|
</g>
|
||||||
|
|
||||||
|
<rect width="100%" height="100%" fill="black" opacity="0.02" />
|
||||||
|
|
||||||
|
</svg>
|
||||||
)
|
)
|
||||||
}
|
}
|
@ -41,7 +41,8 @@ function PasswordReset() {
|
|||||||
height: 'min-content',
|
height: 'min-content',
|
||||||
borderRadius: '1rem',
|
borderRadius: '1rem',
|
||||||
border: '1px solid #00000030',
|
border: '1px solid #00000030',
|
||||||
padding: '2rem'
|
padding: '2rem',
|
||||||
|
background: 'var(--colorNeutralBackground1)'
|
||||||
}}>
|
}}>
|
||||||
<Text size={600} weight='medium'>
|
<Text size={600} weight='medium'>
|
||||||
Восстановление пароля
|
Восстановление пароля
|
||||||
|
@ -61,7 +61,8 @@ const SignIn = () => {
|
|||||||
height: 'min-content',
|
height: 'min-content',
|
||||||
borderRadius: '1rem',
|
borderRadius: '1rem',
|
||||||
border: '1px solid #00000030',
|
border: '1px solid #00000030',
|
||||||
padding: '2rem'
|
padding: '2rem',
|
||||||
|
background: 'var(--colorNeutralBackground1)'
|
||||||
}}>
|
}}>
|
||||||
<Text align='center' size={500} weight='bold'>
|
<Text align='center' size={500} weight='bold'>
|
||||||
Вход
|
Вход
|
||||||
|
@ -36,7 +36,8 @@ const SignUp = () => {
|
|||||||
height: 'min-content',
|
height: 'min-content',
|
||||||
borderRadius: '1rem',
|
borderRadius: '1rem',
|
||||||
border: '1px solid #00000030',
|
border: '1px solid #00000030',
|
||||||
padding: '2rem'
|
padding: '2rem',
|
||||||
|
background: 'var(--colorNeutralBackground1)'
|
||||||
}}>
|
}}>
|
||||||
<Text align='center' size={500} weight='bold'>
|
<Text align='center' size={500} weight='bold'>
|
||||||
Регистрация
|
Регистрация
|
||||||
|
Reference in New Issue
Block a user