import React from 'react'

import { useColors } from '../../ConfigProvider'

export default function NotFound() {
  const colors = useColors()

  return (
    <svg width="56" height="56" viewBox="0 0 56 56">
      <g fill="none" fillRule="evenodd">
        <rect width="56" height="56" />
        <g transform="translate(4 9)">
          <rect width="50" height="36" x="-1" y="-1" fill={colors.grey3} stroke={colors.grey7} strokeWidth="2" />
          <text fill={colors.grey7} fontSize="16" fontWeight="400">
            <tspan x="10.1" y="23">404</tspan>
          </text>
          <rect width="2" height="4" x="23" y="36" fill={colors.grey7} />
          <rect width="26" height="2" x="11" y="40" fill={colors.grey7} />
        </g>
      </g>
    </svg>
  )
}