All files / src/components ErrorLayout.tsx

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
 
 
 
 
 
 
3x
4x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { PropsWithChildren } from 'react'
 
import Image from 'next/image'
 
export interface ErrorLayoutProps extends PropsWithChildren {}
 
const ErrorLayout = ({ children }: ErrorLayoutProps) => {
  return (
    <div className="flex min-h-screen flex-col">
      <header className="container mx-auto my-6 px-4">
        <Image
          className="h-6 w-auto sm:h-8 md:h-8 lg:h-7 xl:h-8"
          alt="Government of Canada - Gouvernement du Canada"
          src="/sig-blk-en.svg"
          width={300}
          height={28}
          priority
        />
      </header>
      <hr />
      <main
        role="main"
        id="mainContent"
        className="container mx-auto my-8 flex-1 px-4"
      >
        {children}
      </main>
      <footer className="bg-gray-light py-4">
        <div className="container mx-auto flex justify-between px-4 lg:flex-row-reverse">
          <a className="w-32 font-body text-sm sm:w-36 lg:hidden" href="#">
            Top of page / Haut de la page&nbsp;
            <span className="font-extrabold">&#8963;</span>
          </a>
          <Image
            className="h-6 w-auto lg:h-auto lg:w-40"
            alt="Symbol of the Government of Canada - Symbole du gouvernement du Canada"
            src="/wmms-blk.svg"
            width={300}
            height={71}
            priority
          />
        </div>
      </footer>
    </div>
  )
}
 
export default ErrorLayout