Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | 1x 1x 41x 41x | 'use client';
import { Container, Text } from '@mantine/core';
import { useTranslations } from 'next-intl';
import { FiArrowLeft } from 'react-icons/fi';
import { GiCookingPot } from 'react-icons/gi';
import NavButton from '../buttons/NavButton';
import StyledText from '../StyledText';
import classes from './UnderConstruction.module.css';
const UnderConstruction = () => {
const translate = useTranslations('underConstruction');
return (
<Container className={classes.container}>
<div className={classes.iconWrapper}>
<svg width="0" height="0">
<title>{translate('gradientIconTitle')}</title>
<linearGradient id="pot-gradient" x1="100%" y1="100%" x2="0%" y2="0%">
<stop stopColor="var(--mantine-color-pink-6)" offset="0%" />
<stop stopColor="var(--mantine-color-violet-6)" offset="100%" />
</linearGradient>
</svg>
<GiCookingPot style={{ fill: 'url(#pot-gradient)' }} />
</div>
<StyledText
componentType="title"
gradient
className={classes.title}
order={1}
>
<span data-testid="underconstruction-title">{translate('title')}</span>
</StyledText>
<Text
size="xl"
fw={500}
mt="md"
mb="xs"
data-testid="underconstruction-subtitle"
>
{translate('subtitle')}
</Text>
<Text
c="dimmed"
size="lg"
maw={600}
mx="auto"
mb={40}
data-testid="underconstruction-description"
>
{translate('description')}
</Text>
<NavButton
label={translate('backButton')}
href="/"
icon={<FiArrowLeft size={20} />}
dataTestId="underconstruction-back"
/>
</Container>
);
};
export default UnderConstruction;
|