Kirill
57 lines
2.3 KiB
TypeScript
57 lines
2.3 KiB
TypeScript
import Box from '@mui/material/Box'
|
||
import Link from '@mui/material/Link'
|
||
import Paper from '@mui/material/Paper'
|
||
import Stack from '@mui/material/Stack'
|
||
import Typography from '@mui/material/Typography'
|
||
import { STORE_EMAIL, STORE_PHONE, VK_URL } from '@/shared/config'
|
||
import { PICKUP_ADDRESS_FULL, PICKUP_COORDINATES } from '@/shared/constants/pickup-point'
|
||
import { usePageTitle } from '@/shared/lib/use-page-title'
|
||
import { AboutMap } from './AboutMap'
|
||
|
||
export function AboutPage() {
|
||
usePageTitle('О нас')
|
||
const { lat, lng } = PICKUP_COORDINATES
|
||
return (
|
||
<Box>
|
||
<Typography variant="h4" gutterBottom>
|
||
О нас
|
||
</Typography>
|
||
<Typography color="text.secondary" sx={{ mb: 3 }}>
|
||
Магазин изделий ручной работы. Мы отвечаем за качество и сроки изготовления всего, что вы видите в каталоге.
|
||
</Typography>
|
||
|
||
<Stack spacing={3}>
|
||
<Paper variant="outlined" sx={{ p: 2, borderRadius: 2 }}>
|
||
<Typography variant="h6" gutterBottom>
|
||
Контакты
|
||
</Typography>
|
||
<Typography variant="body2" sx={{ mt: 1 }}>
|
||
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="body2">
|
||
<Link href={VK_URL} target="_blank" rel="noopener noreferrer" underline="hover">
|
||
ВКонтакте
|
||
</Link>
|
||
</Typography>
|
||
<Typography sx={{ mb: 1, mt: 2 }}>Забрать заказ можно по адресу:</Typography>
|
||
<Typography sx={{ whiteSpace: 'pre-wrap', fontWeight: 600 }}>{PICKUP_ADDRESS_FULL}</Typography>
|
||
<Typography color="text.secondary" variant="body2" sx={{ mt: 1 }}>
|
||
Перед визитом согласуйте время — чтобы заказ точно был готов к выдаче.
|
||
</Typography>
|
||
</Paper>
|
||
|
||
<AboutMap lat={lat} lng={lng} />
|
||
</Stack>
|
||
</Box>
|
||
)
|
||
}
|