styling; Map page is now at /; enable password reset page

This commit is contained in:
2025-10-07 12:17:53 +09:00
parent bfb79c96de
commit 4bc39eb8eb
5 changed files with 119 additions and 16 deletions

View File

@ -47,7 +47,7 @@ const pages = [
component: <PasswordReset />,
drawer: false,
dashboard: false,
enabled: false,
enabled: true,
},
{
label: "Настройки",
@ -61,8 +61,10 @@ const pages = [
{
label: "Главная",
path: "/",
icon: <Home24Color />,
component: <Main />,
icon: <Map24Filled />,
component: <MapTest />,
// icon: <Home24Color />,
// component: <Main />,
drawer: true,
dashboard: true,
enabled: true,
@ -121,15 +123,15 @@ const pages = [
dashboard: true,
enabled: true,
},
{
label: "ИКС",
path: "/map-test",
icon: <Map24Filled />,
component: <MapTest />,
drawer: true,
dashboard: true,
enabled: true,
},
// {
// label: "ИКС",
// path: "/map-test",
// icon: <Map24Filled />,
// component: <MapTest />,
// drawer: true,
// dashboard: true,
// enabled: true,
// },
{
label: "Map line test",
path: "/map-line-test",

View File

@ -15,7 +15,105 @@ export default function MainLayout() {
return (
<div className={classes.root}>
<Background />
<div style={{ position: 'absolute', inset: 0, display: 'flex', width: '100vw', height: '100vh' }}>
<Outlet />
</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>
)
}

View File

@ -41,7 +41,8 @@ function PasswordReset() {
height: 'min-content',
borderRadius: '1rem',
border: '1px solid #00000030',
padding: '2rem'
padding: '2rem',
background: 'var(--colorNeutralBackground1)'
}}>
<Text size={600} weight='medium'>
Восстановление пароля

View File

@ -61,7 +61,8 @@ const SignIn = () => {
height: 'min-content',
borderRadius: '1rem',
border: '1px solid #00000030',
padding: '2rem'
padding: '2rem',
background: 'var(--colorNeutralBackground1)'
}}>
<Text align='center' size={500} weight='bold'>
Вход

View File

@ -36,7 +36,8 @@ const SignUp = () => {
height: 'min-content',
borderRadius: '1rem',
border: '1px solid #00000030',
padding: '2rem'
padding: '2rem',
background: 'var(--colorNeutralBackground1)'
}}>
<Text align='center' size={500} weight='bold'>
Регистрация