import Link from 'next/link'
import Image from 'next/image'
import {Container, Typography} from '@mui/material'

export default function NotFound() {
  return (
    <Container sx={{textAlign: 'center'}} maxWidth='sm'>
      <Link passHref href='/'>
        <Image
          alt='Logo OKI'
          width={192}
          height={192}
          src='/logo-192x192.png'
          quality={20}
        />
      </Link>
      <Typography variant='h2' align='center' >404 - La page n’existe pas 😔</Typography>
      <Link passHref href='/' style={{textDecoration: 'none'}}>
        <Typography style={{marginTop: '1em', color: 'green'}} variant='h3' align='center'>Retourner à l’accueil 🏡</Typography>
      </Link>
    </Container>
  )
}