base commit

client/src/app/App.tsx

@@ -2,7 +2,7 @@ import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom'
 import { MainLayout } from '@/app/layout/MainLayout'
 import { AppProviders } from '@/app/providers/AppProviders'
 import { AdminLayoutPage } from '@/pages/admin-layout'
-import { AuthPage } from '@/pages/auth'
+import { AuthCallbackPage, AuthPage } from '@/pages/auth'
 import { CartPage } from '@/pages/cart'
 import { CheckoutPage } from '@/pages/checkout'
 import { HomePage } from '@/pages/home'
@@ -18,6 +18,7 @@ export function App() {
             <Route path="/" element={<HomePage />} />
             <Route path="/admin/*" element={<AdminLayoutPage />} />
             <Route path="/auth" element={<AuthPage />} />
+            <Route path="/auth/callback" element={<AuthCallbackPage />} />
             <Route path="/cart" element={<CartPage />} />
             <Route path="/checkout" element={<CheckoutPage />} />
             <Route path="/me/*" element={<MeLayoutPage />} />

client/src/app/layout/AppHeader.tsx

@@ -62,11 +62,11 @@ function ThemeControlsDesktop(props: {
           '& .MuiInputLabel-root.MuiInputLabel-shrink': { color: 'rgba(255,255,255,0.92)' },
         }}
       >
-        <InputLabel id="scheme-label">Тема</InputLabel>
+        <InputLabel id="scheme-label">Схема</InputLabel>
         <Select
           labelId="scheme-label"
           value={scheme}
-          label="Тема"
+          label="Схема"
           onChange={onSchemeChange}
           sx={{
             color: 'inherit',
@@ -93,11 +93,11 @@ function ThemeControlsDesktop(props: {
           '& .MuiInputLabel-root.MuiInputLabel-shrink': { color: 'rgba(255,255,255,0.92)' },
         }}
       >
-        <InputLabel id="mode-label">Режим</InputLabel>
+        <InputLabel id="mode-label">Тема</InputLabel>
         <Select
           labelId="mode-label"
           value={mode}
-          label="Режим"
+          label="Тема"
           onChange={onModeChange}
           sx={{
             color: 'inherit',
@@ -139,8 +139,8 @@ function ThemeControlsMobile(props: {
   return (
     <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
       <FormControl size="small" fullWidth>
-        <InputLabel id="scheme-label-mobile">Тема</InputLabel>
-        <Select labelId="scheme-label-mobile" value={scheme} label="Тема" onChange={onSchemeChange}>
+        <InputLabel id="scheme-label-mobile">Схема</InputLabel>
+        <Select labelId="scheme-label-mobile" value={scheme} label="Схема" onChange={onSchemeChange}>
           <MenuItem value="craft">Крафт</MenuItem>
           <MenuItem value="forest">Лес</MenuItem>
           <MenuItem value="ocean">Океан</MenuItem>
@@ -149,8 +149,8 @@ function ThemeControlsMobile(props: {
       </FormControl>
 
       <FormControl size="small" fullWidth>
-        <InputLabel id="mode-label-mobile">Режим</InputLabel>
-        <Select labelId="mode-label-mobile" value={mode} label="Режим" onChange={onModeChange}>
+        <InputLabel id="mode-label-mobile">Тема</InputLabel>
+        <Select labelId="mode-label-mobile" value={mode} label="Тема" onChange={onModeChange}>
           <MenuItem value="system">Авто (система)</MenuItem>
           <MenuItem value="light">Светлая</MenuItem>
           <MenuItem value="dark">Тёмная</MenuItem>

client/src/app/layout/MainLayout.tsx

@@ -1,10 +1,18 @@
 import { type PropsWithChildren } from 'react'
 import Box from '@mui/material/Box'
 import Container from '@mui/material/Container'
+import Divider from '@mui/material/Divider'
+import Grid from '@mui/material/Grid'
+import Link from '@mui/material/Link'
+import Stack from '@mui/material/Stack'
 import Typography from '@mui/material/Typography'
+import { Link as RouterLink } from 'react-router-dom'
 import { AppHeader } from '@/app/layout/AppHeader'
+import { STORE_EMAIL, STORE_NAME, STORE_PHONE, STORE_SOCIAL_NOTE } from '@/shared/config'
 
 export function MainLayout({ children }: PropsWithChildren) {
+  const year = new Date().getFullYear()
+
   return (
     <Box sx={{ display: 'flex', flexDirection: 'column', minHeight: '100vh' }}>
       <AppHeader />
@@ -12,17 +20,76 @@ export function MainLayout({ children }: PropsWithChildren) {
       <Box component="main" sx={{ flex: 1, py: 3 }}>
         <Container maxWidth="lg">{children}</Container>
       </Box>
+
       <Box
         component="footer"
         sx={{
-          py: 2,
-          textAlign: 'center',
+          mt: 'auto',
           borderTop: 1,
           borderColor: 'divider',
-          color: 'text.secondary',
+          bgcolor: 'background.default',
+          py: { xs: 3, md: 4 },
         }}
       >
-        <Typography variant="body2">Изделия ручной работы · доставка по договорённости</Typography>
+        <Container maxWidth="lg">
+          <Grid container spacing={3}>
+            <Grid size={{ xs: 12, sm: 4 }}>
+              <Typography variant="subtitle1" fontWeight={700} gutterBottom>
+                Магазин
+              </Typography>
+              <Stack spacing={1}>
+                <Link component={RouterLink} to="/" color="inherit" underline="hover" variant="body2">
+                  Каталог
+                </Link>
+                <Typography variant="body2" color="text.secondary">
+                  Изделия ручной работы: вещь с характером и вниманием к деталям.
+                </Typography>
+                <Typography variant="body2" color="text.secondary">
+                  Как заказать: добавьте позиции в корзину и оформите доставку или самовывоз на чек-ауте.
+                </Typography>
+              </Stack>
+            </Grid>
+            <Grid size={{ xs: 12, sm: 4 }}>
+              <Typography variant="subtitle1" fontWeight={700} gutterBottom>
+                Покупателям
+              </Typography>
+              <Stack spacing={1}>
+                <Link component={RouterLink} to="/me" 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" fontWeight={700} gutterBottom>
+                Контакты
+              </Typography>
+              <Stack spacing={0.75}>
+                <Typography variant="body2">
+                  Email:{' '}
+                  <Link href={`mailto:${STORE_EMAIL}`} underline="hover">
+                    {STORE_EMAIL}
+                  </Link>
+                </Typography>
+                <Typography variant="body2">
+                  Телефон:{' '}
+                  <Link href={`tel:${STORE_PHONE.replace(/\s/g, '')}`} underline="hover">
+                    {STORE_PHONE}
+                  </Link>
+                </Typography>
+                <Typography variant="caption" color="text.secondary">
+                  {STORE_SOCIAL_NOTE}
+                </Typography>
+              </Stack>
+            </Grid>
+          </Grid>
+          <Divider sx={{ my: 2 }} />
+          <Typography variant="caption" color="text.secondary" display="block" textAlign={{ xs: 'left', sm: 'center' }}>
+            © {year} {STORE_NAME}. Сделано для демонстрации возможностей витрины.
+          </Typography>
+        </Container>
       </Box>
     </Box>
   )