import Link from "next/link"

export default function NotFound() {
  return (
    <main className="section-small top overflow-hidden">
      <div className="w-layout-blockcontainer container-default w-container">
        <div className="text-center" style={{ padding: "120px 0" }}>
          <div className="subtitle">404</div>
          <div className="mg-top-4x-extra-small">
            <h1>这个页面现在不在 DAL Code 官网上</h1>
          </div>
          <div className="mg-top-4x-extra-small">
            <p>它可能在模板改造过程中被移除、改名，或者链接已经更新。你可以先回到首页，或继续查看产品定位与产品文章。</p>
          </div>
          <div className="mg-top-24px">
            <Link href="/" className="primary-button w-inline-block">
              <div className="button-content">
                <div>返回首页</div>
                <div className="button-icon-wrapper primary">
                  <svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 17 17" fill="none" className="squared-icon">
                    <path d="M6.25391 3.45312L10.7458 8.01563L6.25391 12.5781" stroke="currentColor" strokeWidth="1.5" strokeLinecap="square" />
                  </svg>
                  <div className="button-icon-bg" />
                  <div className="button-icon-bg-inside" />
                </div>
              </div>
            </Link>
          </div>
          <div className="mg-top-4x-extra-small">
            <Link href="/about" className="tertiary-button w-inline-block">
              <div className="button-content">
                <div>查看产品定位</div>
              </div>
            </Link>
          </div>
        </div>
      </div>
    </main>
  )
}
