♻️ refactor(ErrorPage): use common SectionHeader

src/components/pages/ErrorPage/ErrorPage.tsx

@@ -1,15 +1,16 @@
 import { isRouteErrorResponse, useRouteError } from 'react-router-dom'
 import { Typography } from '@mui/material'
 
+import { SectionHeader } from 'components/atoms/index.js'
 import { Page } from 'components/templates/index.js'
 
 const ErrorPage: React.FC = () => {
   const error: unknown = useRouteError()
   return (
     <Page sx={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'center', minHeight: '90vh' }}>
-      <Typography variant="h1" color="primary.main">
+      <SectionHeader variant="h1" component="h1" textTransform="none">
         Oops!
-      </Typography>
+      </SectionHeader>
       <Typography variant="h6">Sorry, an unexpected error has occurred.</Typography>
       {isRouteErrorResponse(error) && (
         <Typography color="text.secondary">