devmin.ca/404.html at main · devmin8/devmin.ca · GitHub

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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
<!doctype html>
<html lang="en" class="scroll-smooth antialiased">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <script>
      ;(function () {
        var root = document.documentElement
        try {
          var stored = localStorage.getItem('theme')
          var prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches
          var useDark = stored === 'dark' || (!stored && prefersDark)
          root.classList.toggle('dark', useDark)
          root.style.colorScheme = useDark ? 'dark' : 'light'
        } catch {}
      })()
    </script>

    <style>
      html {
        color-scheme: light;
        background-color: #fcfcfa;
        color: #181815;
        font-family: 'Geist', system-ui, sans-serif;
      }

      html.dark {
        color-scheme: dark;
        background-color: #0b0b0c;
        color: #f5f5f2;
      }
    </style>

    <link rel="preload" href="/fonts/geist-latin.woff2" as="font" type="font/woff2" crossorigin />
    <link
      rel="preload"
      href="/fonts/geist-mono-latin.woff2"
      as="font"
      type="font/woff2"
      crossorigin
    />
    <link rel="stylesheet" href="/src/style.css" />
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="icon" href="/favicon.svg" type="image/svg+xml" />

    <title>Page not found | devmin.ca</title>
    <meta name="description" content="The requested page could not be found on devmin.ca." />
    <meta name="robots" content="noindex, follow" />
    <meta name="theme-color" content="#FCFCFA" media="(prefers-color-scheme: light)" />
    <meta name="theme-color" content="#0B0B0C" media="(prefers-color-scheme: dark)" />
  </head>

  <body class="grid-bg bg-bg font-sans text-ink selection:text-ink">
    <header class="grid-pattern sticky top-0 z-50 border-b border-line bg-bg/85 backdrop-blur-md">
      <div class="page-shell flex h-[54px] items-center justify-between">
        <a href="/" class="group flex items-center gap-2.5" aria-label="devmin.ca home">
          <svg
            width="18"
            height="18"
            class="h-[18px] w-[18px] shrink-0 text-ink"
            viewBox="0 0 18 18"
            fill="none"
            aria-hidden="true"
          >
            <path
              d="M3 13.5V4.5h3.15c2.82 0 4.65 1.77 4.65 4.5s-1.83 4.5-4.65 4.5H3Z"
              fill="currentColor"
            />
            <path d="M5.6 11.1h.7c1.22 0 1.95-.78 1.95-2.1S7.52 6.9 6.3 6.9h-.7v4.2Z" fill="var(--bg)" />
            <path
              d="M11.15 13.5V4.5h1.72l1.5 2.73 1.5-2.73H17.5v9h-1.9V8.4l-.88 1.6h-.75l-.92-1.6v5.1h-1.9Z"
              fill="var(--accent)"
            />
          </svg>
          <span class="font-mono text-[13px] tracking-tight text-muted transition-colors group-hover:text-ink"
            >devmin.ca</span
          >
        </a>

        <button
          id="theme-toggle"
          type="button"
          aria-label="Toggle color theme"
          class="flex h-8 w-8 items-center justify-center rounded-md text-muted transition-colors hover:bg-surface hover:text-ink"
        >
          <svg
            width="16"
            height="16"
            class="hidden h-4 w-4 dark:block"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="1.75"
            stroke-linecap="round"
            stroke-linejoin="round"
            aria-hidden="true"
          >
            <circle cx="12" cy="12" r="4.5" />
            <path d="M12 2v2.5M12 19.5V22M4.22 4.22l1.71 1.71M18.07 18.07l1.71 1.71M2 12h2.5M19.5 12H22M4.22 19.78l1.71-1.71M18.07 5.93l1.71-1.71" />
          </svg>
          <svg
            width="16"
            height="16"
            class="block h-4 w-4 dark:hidden"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="1.75"
            stroke-linecap="round"
            stroke-linejoin="round"
            aria-hidden="true"
          >
            <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" />
          </svg>
        </button>
      </div>
    </header>

    <main class="page-shell flex min-h-[calc(100vh-55px)] items-center py-16">
      <section class="w-full border-t border-line py-12 sm:py-[58px]">
        <p class="section-kicker"><span>404</span> Not found</p>
        <h1 class="mb-4 max-w-[560px] text-[42px] font-bold leading-[0.98] tracking-[-0.04em] text-ink sm:text-[58px]">
          This page is not here.
        </h1>
        <p class="body-copy mb-8 max-w-[530px]">
          The URL may be wrong, stale, or from a page that moved. The homepage has the current
          profile, work, and contact links.
        </p>
        <a
          href="/"
          class="inline-flex items-center gap-2 rounded-md bg-ink px-4 py-2 text-[13px] font-medium text-bg transition-opacity hover:opacity-90"
        >
          <svg
            class="h-[14px] w-[14px]"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            stroke-width="1.75"
            stroke-linecap="round"
            stroke-linejoin="round"
            aria-hidden="true"
          >
            <path d="m3 10.5 9-7 9 7" />
            <path d="M5 9.5V20h14V9.5" />
            <path d="M9.5 20v-6h5v6" />
          </svg>
          Back home
        </a>
      </section>
    </main>

    <script type="module" src="/src/main.ts"></script>
  </body>
</html>