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 66 67 68 69 70 71 72 73 74 75 | 2x 2x 2x 2x 2x 8x | import Box from '@mui/material/Box';
import Typography from '@mui/material/Typography';
import useMediaQuery from '@mui/material/useMediaQuery';
import { useTheme } from '@mui/material/styles';
import ActiveButton from '../ActiveButton';
import { useTranslation } from 'react-i18next';
function Footer() {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
const { t } = useTranslation();
const links = [
{ to: '/contact', labelKey: 'footer.contact' },
{ to: '/legal-mentions', labelKey: 'footer.legalMentions' },
{ to: '/terms', labelKey: 'footer.terms' },
{ to: '/privacy-policy', labelKey: 'footer.privacy' },
];
return (
<Box component="footer" sx={{
bgcolor: theme.palette.background.paper,
color: theme.palette.text.primary,
borderTop: `1px solid ${theme.palette.divider}`,
}}>
{/* Ligne de boutons */}
<Box
sx={{
display: 'flex',
flexDirection: isMobile ? 'column' : 'row',
alignItems: 'center',
justifyContent: 'center',
gap: isMobile ? 1 : 2,
py: isMobile ? 1 : 1.5,
}}
>
{links.map(link => (
<ActiveButton
key={link.to}
to={link.to}
variant="text"
size="small"
sx={{
fontSize: isMobile ? '0.7rem' : '0.8rem',
color: theme.palette.text.primary,
}}
>
{t(link.labelKey)}
</ActiveButton>
))}
</Box>
{/* Copyright */}
<Box sx={{
py: isMobile ? 0.5 : 1,
}}>
<Typography
variant="caption"
component="div"
align="center"
sx={{
color: theme.palette.text.secondary,
fontSize: isMobile ? '0.5rem' : '0.6rem',
lineHeight:1,
}}
>
{t('footer.copy', { year: new Date().getFullYear() })}
</Typography>
</Box>
</Box>
);
}
export default Footer;
|