test commit

This commit is contained in:
Kirill
2026-05-19 09:00:26 +05:00
parent 0ee9e76a30
commit 9999b28d49
9 changed files with 249 additions and 68 deletions
+26 -18
View File
@@ -18,7 +18,7 @@ export function MainLayout({ children }: PropsWithChildren) {
<Box sx={{ display: 'flex', flexDirection: 'column', minHeight: '100vh' }}>
<AppHeader />
<Box component="main" sx={{ flex: 1, py: 3 }}>
<Box component="main" sx={{ flex: 1, py: { xs: 4, md: 6 } }}>
<Container maxWidth="lg">{children}</Container>
</Box>
@@ -29,32 +29,29 @@ export function MainLayout({ children }: PropsWithChildren) {
borderTop: 1,
borderColor: 'divider',
bgcolor: 'background.default',
py: { xs: 3, md: 4 },
py: { xs: 4, md: 6 },
}}
>
<Container maxWidth="lg">
<Grid container spacing={3}>
<Grid container spacing={4}>
<Grid size={{ xs: 12, sm: 4 }}>
<Typography variant="subtitle1" gutterBottom sx={{ fontWeight: 700 }}>
<Typography variant="subtitle1" gutterBottom sx={{ fontWeight: 600, letterSpacing: '-0.25px' }}>
Магазин
</Typography>
<Stack spacing={1}>
<Stack spacing={1.5}>
<Link component={RouterLink} to="/" color="inherit" underline="hover" variant="body2">
Каталог
</Link>
<Link component={RouterLink} to="/privacy" color="inherit" underline="hover" variant="body2">
Политика конфиденциальности
</Link>
<Typography variant="body2" color="text.secondary">
Изделия ручной работы: вещи с характером и вниманием к деталям.
</Typography>
</Stack>
</Grid>
<Grid size={{ xs: 12, sm: 4 }}>
<Typography variant="subtitle1" gutterBottom sx={{ fontWeight: 700 }}>
<Typography variant="subtitle1" gutterBottom sx={{ fontWeight: 600, letterSpacing: '-0.25px' }}>
Покупателям
</Typography>
<Stack spacing={1}>
<Stack spacing={1.5}>
<Link component={RouterLink} to="/me" color="inherit" underline="hover" variant="body2">
Личный кабинет
</Link>
@@ -67,10 +64,10 @@ export function MainLayout({ children }: PropsWithChildren) {
</Stack>
</Grid>
<Grid size={{ xs: 12, sm: 4 }}>
<Typography variant="subtitle1" gutterBottom sx={{ fontWeight: 700 }}>
<Typography variant="subtitle1" gutterBottom sx={{ fontWeight: 600, letterSpacing: '-0.25px' }}>
Контакты
</Typography>
<Stack spacing={0.75}>
<Stack spacing={1}>
<Typography variant="body2">
Email:{' '}
<Link href={`mailto:${STORE_EMAIL}`} underline="hover">
@@ -97,15 +94,26 @@ export function MainLayout({ children }: PropsWithChildren) {
</Link>
</Stack>
</Grid>
<Grid size={{ xs: 12, sm: 4 }}>
<Typography variant="subtitle1" gutterBottom sx={{ fontWeight: 600, letterSpacing: '-0.25px' }}>
Юридическая информация
</Typography>
<Stack spacing={1.5}>
<Link component={RouterLink} to="/privacy" color="inherit" underline="hover" variant="body2">
Политика конфиденциальности
</Link>
<Link component={RouterLink} to="/terms" color="inherit" underline="hover" variant="body2">
Пользовательское соглашение
</Link>
</Stack>
</Grid>
<Divider sx={{ my: 2 }} />
<Typography
variant="caption"
color="text.secondary"
sx={{ display: 'block', textAlign: { xs: 'left', sm: 'center' } }}
>
</Grid>
<Divider sx={{ my: 3 }} />
<Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 0.5 }}>
<Typography variant="caption" color="text.secondary" sx={{ display: 'block', textAlign: 'center' }}>
© {year} {STORE_NAME}
</Typography>
</Box>
</Container>
</Box>
</Box>
+82 -44
View File
@@ -24,97 +24,135 @@ function AppThemeInner({ children }: PropsWithChildren) {
case 'forest':
return {
...common,
primary: { main: isDark ? '#4CAF50' : '#2E7D32' },
secondary: { main: isDark ? '#A1887F' : '#6D4C41' },
info: { main: isDark ? '#29B6F6' : '#0288D1' },
success: { main: isDark ? '#66BB6A' : '#2E7D32' },
warning: { main: isDark ? '#FFB74D' : '#ED6C02' },
error: { main: isDark ? '#EF5350' : '#D32F2F' },
divider: isDark ? 'rgba(255,255,255,0.10)' : 'rgba(0,0,0,0.10)',
primary: { main: isDark ? '#8FBC8F' : '#2E8B57' },
secondary: { main: isDark ? '#CD853F' : '#8B4513' },
info: { main: isDark ? '#4682B4' : '#1E90FF' },
success: { main: isDark ? '#90EE90' : '#32CD32' },
warning: { main: isDark ? '#FFD700' : '#FFA500' },
error: { main: isDark ? '#F08080' : '#CD5C5C' },
divider: isDark ? 'rgba(255,255,255,0.12)' : 'rgba(0,0,0,0.08)',
text,
chip,
background: isDark
? { default: '#0E1510', paper: '#121B14' }
: { default: '#F6FAF6', paper: '#FFFFFF' },
? { default: '#0F1720', paper: '#1A242E' }
: { default: '#F8F6F3', paper: '#FFFFFF' },
}
case 'ocean':
return {
...common,
primary: { main: isDark ? '#42A5F5' : '#1565C0' },
secondary: { main: isDark ? '#4DD0E1' : '#00838F' },
info: { main: isDark ? '#4FC3F7' : '#0288D1' },
success: { main: isDark ? '#26C6DA' : '#00838F' },
warning: { main: isDark ? '#FFCC80' : '#ED6C02' },
error: { main: isDark ? '#EF5350' : '#D32F2F' },
divider: isDark ? 'rgba(255,255,255,0.10)' : 'rgba(0,0,0,0.10)',
primary: { main: isDark ? '#5F9EA0' : '#20B2AA' },
secondary: { main: isDark ? '#7B68EE' : '#6A5ACD' },
info: { main: isDark ? '#87CEEB' : '#00BFFF' },
success: { main: isDark ? '#98FB98' : '#00FA9A' },
warning: { main: isDark ? '#FFE4B5' : '#FFDAB9' },
error: { main: isDark ? '#FF6347' : '#FF4500' },
divider: isDark ? 'rgba(255,255,255,0.12)' : 'rgba(0,0,0,0.08)',
text,
chip,
background: isDark
? { default: '#0B1220', paper: '#0F172A' }
: { default: '#F6FAFF', paper: '#FFFFFF' },
? { default: '#0A1A2A', paper: '#0F1D35' }
: { default: '#F0F8FF', paper: '#FFFFFF' },
}
case 'berry':
return {
...common,
primary: { main: isDark ? '#BA68C8' : '#7B1FA2' },
secondary: { main: isDark ? '#F06292' : '#C2185B' },
info: { main: isDark ? '#64B5F6' : '#1976D2' },
success: { main: isDark ? '#81C784' : '#2E7D32' },
warning: { main: isDark ? '#FFB74D' : '#ED6C02' },
error: { main: isDark ? '#EF5350' : '#D32F2F' },
divider: isDark ? 'rgba(255,255,255,0.10)' : 'rgba(0,0,0,0.10)',
primary: { main: isDark ? '#9370DB' : '#8A2BE2' },
secondary: { main: isDark ? '#FF69B4' : '#FF1493' },
info: { main: isDark ? '#00CED1' : '#00BFFF' },
success: { main: isDark ? '#00FF7F' : '#7CFC00' },
warning: { main: isDark ? '#FFD700' : '#FFA500' },
error: { main: isDark ? '#FF4500' : '#FF6347' },
divider: isDark ? 'rgba(255,255,255,0.12)' : 'rgba(0,0,0,0.08)',
text,
chip,
background: isDark
? { default: '#140A17', paper: '#1B0F20' }
: { default: '#FFF7FD', paper: '#FFFFFF' },
? { default: '#1A0A1A', paper: '#250E25' }
: { default: '#FFF0F5', paper: '#FFFFFF' },
}
case 'craft':
default:
return {
...common,
primary: { main: isDark ? '#BCAAA4' : '#6D4C41' },
secondary: { main: isDark ? '#FFCCBC' : '#8D6E63' },
info: { main: isDark ? '#90CAF9' : '#1976D2' },
success: { main: isDark ? '#A5D6A7' : '#2E7D32' },
warning: { main: isDark ? '#FFB74D' : '#ED6C02' },
error: { main: isDark ? '#EF9A9A' : '#D32F2F' },
divider: isDark ? 'rgba(255,255,255,0.10)' : 'rgba(0,0,0,0.10)',
primary: { main: isDark ? '#A0522D' : '#8B4513' },
secondary: { main: isDark ? '#D2B48C' : '#DEB887' },
info: { main: isDark ? '#6495ED' : '#4169E1' },
success: { main: isDark ? '#9ACD32' : '#6B8E23' },
warning: { main: isDark ? '#F4A460' : '#CD853F' },
error: { main: isDark ? '#DC143C' : '#B22222' },
divider: isDark ? 'rgba(255,255,255,0.12)' : 'rgba(0,0,0,0.08)',
text,
chip,
background: isDark
? { default: '#12100F', paper: '#191615' }
: { default: '#FAF8F5', paper: '#FFFFFF' },
? { default: '#1A1410', paper: '#251E17' }
: { default: '#FAF9F6', paper: '#FFFFFF' },
}
}
})(),
shape: { borderRadius: 12 },
typography: {
fontFamily: '"Segoe UI", system-ui, sans-serif',
h4: { fontWeight: 700 },
h5: { fontWeight: 600 },
fontFamily: '"Outfit", "Segoe UI", system-ui, sans-serif',
h4: { fontWeight: 700, letterSpacing: '-0.5px' },
h5: { fontWeight: 600, letterSpacing: '-0.25px' },
h6: { fontWeight: 600 },
subtitle1: { fontWeight: 600 },
subtitle2: { fontWeight: 500 },
body1: { fontSize: '0.875rem' },
body2: { fontSize: '0.75rem' },
button: { textTransform: 'none', fontWeight: 600 },
},
components: {
MuiButton: {
styleOverrides: {
root: { textTransform: 'none', borderRadius: 12, fontWeight: 600 },
root: {
textTransform: 'none',
borderRadius: 12,
fontWeight: 600,
transition: 'all 0.2s ease-in-out',
},
contained: {
boxShadow: '0 4px 14px 0 rgba(0,0,0,0.15)',
'&:hover': {
boxShadow: '0 6px 20px 0 rgba(0,0,0,0.25)',
transform: 'translateY(-1px)',
transform: 'translateY(-2px)',
},
'&:active': {
boxShadow: '0 2px 8px 0 rgba(0,0,0,0.15)',
transform: 'translateY(0)',
},
},
outlined: {
'&:hover': { boxShadow: '0 2px 8px 0 rgba(0,0,0,0.1)' },
border: '1px solid',
'&:hover': {
boxShadow: '0 2px 8px 0 rgba(0,0,0,0.1)',
borderWidth: '2px',
},
'&:active': {
boxShadow: 'none',
},
},
text: {
'&:hover': {
boxShadow: '0 1px 3px 0 rgba(0,0,0,0.1)',
backgroundColor: 'action.hover',
},
'&:active': {
backgroundColor: 'action.selected',
},
},
},
},
MuiIconButton: {
styleOverrides: {
root: {
transition: 'all 0.2s ease',
'&:hover': { transform: 'scale(1.1)' },
transition: 'all 0.2s ease-in-out',
'&:hover': {
backgroundColor: 'action.hover',
transform: 'scale(1.1)',
},
'&:active': {
backgroundColor: 'action.selected',
transform: 'scale(0.95)',
},
},
},
},
+5 -2
View File
@@ -1,5 +1,5 @@
import { lazy, Suspense } from 'react'
import { Navigate, Route, Routes } from 'react-router-dom'
import { Route, Routes } from 'react-router-dom'
import { MainLayout } from '@/app/layout/MainLayout'
import { AboutPage } from '@/pages/about'
// import { AdminLayoutPage } from '@/pages/admin-layout'
@@ -9,8 +9,10 @@ import { CheckoutPage } from '@/pages/checkout'
import { HomePage } from '@/pages/home'
import { InfoPage } from '@/pages/info'
// import { MeLayoutPage } from '@/pages/me'
import { NotFoundPage } from '@/pages/not-found'
import { PrivacyPolicyPage } from '@/pages/privacy-policy'
import { ProductPage } from '@/pages/product'
import { TermsPage } from '@/pages/terms'
import { SkeletonPage } from '@/shared/ui/SkeletonPage'
const AdminLayoutPage = lazy(() => import('@/pages/admin-layout').then((m) => ({ default: m.AdminLayoutPage })))
@@ -36,6 +38,7 @@ export function AppRoutes() {
<Route path="/about" element={<AboutPage />} />
<Route path="/info" element={<InfoPage />} />
<Route path="/privacy" element={<PrivacyPolicyPage />} />
<Route path="/terms" element={<TermsPage />} />
<Route
path="/me/*"
element={
@@ -45,7 +48,7 @@ export function AppRoutes() {
}
/>
<Route path="/products/:id" element={<ProductPage />} />
<Route path="*" element={<Navigate to="/" replace />} />
<Route path="*" element={<NotFoundPage />} />
</Routes>
</MainLayout>
)
+1
View File
@@ -0,0 +1 @@
export { NotFoundPage } from './ui/NotFoundPage'
@@ -0,0 +1,46 @@
import { Box, Typography, Button, Stack, Paper } from '@mui/material'
import { Link as RouterLink } from 'react-router-dom'
export function NotFoundPage() {
return (
<Box
sx={{
display: 'flex',
flexDirection: 'column',
minHeight: '100vh',
bgcolor: 'background.default',
alignItems: 'center',
justifyContent: 'center',
py: 4,
px: 2,
}}
>
<Paper sx={{ p: 4, borderRadius: 3, bgcolor: 'background.paper' }}>
<Stack spacing={3} alignItems="center" textAlign="center">
<Box sx={{ fontSize: 96, lineHeight: 1 }}>404</Box>
<Typography variant="h4" component="h1" gutterBottom>
Страница не найдена
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ maxWidth: 400 }}>
Извините, но запрашиваемая страница не существует или была удалена.
</Typography>
<Stack direction="row" spacing={2} sx={{ mt: 2 }}>
<Button
variant="contained"
size="large"
onClick={() => {
window.location.href = '/'
}}
sx={{ px: 4 }}
>
Вернуться на главную
</Button>
<Button variant="outlined" size="large" component={RouterLink} to="/" sx={{ px: 4 }}>
Посмотреть каталог
</Button>
</Stack>
</Stack>
</Paper>
</Box>
)
}
+8 -1
View File
@@ -194,7 +194,14 @@ export function ProductPage() {
{reviewsQuery.isLoading && <Typography color="text.secondary">Загрузка отзывов</Typography>}
{reviewsQuery.isError && <Alert severity="warning">Не удалось загрузить отзывы.</Alert>}
{reviewsQuery.data && reviewsQuery.data.total === 0 && (
<Typography color="text.secondary">Пока нет опубликованных отзывов на этот товар.</Typography>
<Box sx={{ textAlign: 'center', py: 3 }}>
<Typography variant="h6" color="text.secondary" sx={{ mb: 1 }}>
Отзывов пока нет
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ maxWidth: 400 }}>
Будьте первым, кто оставит отзыв на этот товар. Ваше мнение поможет улучшить качество наших изделий.
</Typography>
</Box>
)}
{reviewsQuery.data && reviewsQuery.data.items.length > 0 && (
<Stack spacing={1.25}>
+1
View File
@@ -0,0 +1 @@
export { TermsPage } from './ui/TermsPage'
+69
View File
@@ -0,0 +1,69 @@
import { Box, Typography, Button, Stack } from '@mui/material'
import { Link as RouterLink } from 'react-router-dom'
export function TermsPage() {
return (
<Box
sx={{
display: 'flex',
flexDirection: 'column',
minHeight: '100vh',
bgcolor: 'background.default',
alignItems: 'center',
justifyContent: 'flex-start',
py: 4,
px: 2,
}}
>
<Box sx={{ maxWidth: 800, width: '100%', py: 4 }}>
<Typography variant="h4" component="h1" gutterBottom sx={{ mb: 4 }}>
Пользовательское соглашение
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ mb: 3 }}>
Последнее обновление: 18 мая 2026 г.
</Typography>
<Box sx={{ bgcolor: 'background.paper', p: 3, borderRadius: 2 }}>
<Typography variant="body2" color="text.primary" sx={{ lineHeight: 1.7, mb: 2 }}>
1. ОБЩИЕ ПОЛОЖЕНИЯ
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ mb: 2 }}>
Настоящее пользовательское соглашение (далее «Соглашение») регулирует отношения между пользователями сайта
и администрацией сайта в связи с использованием сайта Любимый Креатив.
</Typography>
<Typography variant="body2" color="text.primary" sx={{ lineHeight: 1.7, mb: 2 }}>
2. ПРЕДМЕТ СОГЛАШЕНИЯ
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ mb: 2 }}>
Сайт предоставляет пользователям возможность ознакомиться с информацией о товарах, совершать покупки и
оставлять отзывы.
</Typography>
<Typography variant="body2" color="text.primary" sx={{ lineHeight: 1.7, mb: 2 }}>
3. ПРАВА И ОБЯЗАННОСТИ ПОЛЬЗОВАТЕЛЯ
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ mb: 2 }}>
Пользователь обязуется предоставлять достоверную информацию при регистрации и оформлении заказов, не
использовать сайт в незаконных целях, соблюдать правила поведения при оставлении отзывов и комментариев.
</Typography>
<Typography variant="body2" color="text.primary" sx={{ lineHeight: 1.7, mb: 2 }}>
4. ОТВЕТСТВЕННОСТЬ
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ mb: 2 }}>
Администрация сайта не несет ответственности за прямые или косвенные убытки, возникшие в результате
использования информации, размещенной на сайте.
</Typography>
</Box>
<Stack direction="row" justifyContent="center" mt={4}>
<Button variant="outlined" size="medium" component={RouterLink} to="/" sx={{ px: 3 }}>
Вернуться на главную
</Button>
</Stack>
</Box>
</Box>
)
}
@@ -53,7 +53,15 @@ export function ReviewsBlock() {
)}
{q.isError && <Alert severity="error">Не удалось загрузить отзывы.</Alert>}
{!q.isLoading && !q.isError && q.data && items.length === 0 && (
<Typography color="text.secondary">Пока нет опубликованных отзывов о товарах.</Typography>
<Box sx={{ textAlign: 'center', py: 4 }}>
<Typography variant="h6" color="text.secondary" sx={{ mb: 2 }}>
Отзывов пока нет
</Typography>
<Typography variant="body2" color="text.secondary" sx={{ maxWidth: 400 }}>
Будьте первым, кто оставит отзыв о наших товарах. Ваше мнение поможет другим покупателям сделать правильный
выбор.
</Typography>
</Box>
)}
{items.length > 0 && (
<Stack spacing={2}>