danielroe.dev
[READ-ONLY] Mirror of https://github.com/danielroe/firstcommit.is. Find your first open-source commit on GitHub
firstcommit.is
api
commit
github
nuxt
oauth
1.6 kB
58 lines
1<script setup lang="ts">
2import type { NuxtError } from '#app'
3
4useServerSeoMeta({
5 ogSiteName: 'firstcommit.is',
6 twitterSite: '@danielcroe',
7})
8useServerHead({
9 htmlAttrs: {
10 lang: 'en',
11 }
12})
13defineProps({
14 error: Object as () => NuxtError
15})
16</script>
17
18<template>
19 <div class="min-h-[100svh] flex flex-col justify-stretch">
20 <div class="flex-grow flex flex-col mx-auto justify-center p-2 ">
21 <main class="p-8 m-2 max-w-[500px] w-full mx-auto flex-col flex items-center gap-4">
22 <div>
23 {{ error?.statusCode === 404 ? "Sorry, we couldn't find that commit." : error?.message ?? 'Unknown error' }}
24 </div>
25 <hr class="border-t-2 border-gray-400 w-2 h-0 mb-1 inline-block">
26 <NuxtLink
27 class="rounded bg-black text-white shadow px-3 py-2 flex flex-row gap-2 items-center"
28 href="/"
29 >
30 <svg
31 xmlns="http://www.w3.org/2000/svg"
32 class="h-4 w-4"
33 viewBox="0 0 24 24"
34 ><path
35 fill="currentColor"
36 d="M8 7v4L2 6l6-5v4h5a8 8 0 1 1 0 16H4v-2h9a6 6 0 0 0 0-12H8Z"
37 /></svg>
38 Go back
39 </NuxtLink>
40 </main>
41 </div>
42 <footer class="mt-auto p-2 text-center text-sm opacity-75 hover:opacity-100">
43 made with ❤️ by <a
44 class="font-semibold hover:underline"
45 href="https://x.com/danielcroe"
46 >
47 @danielcroe
48 </a>
49 ·
50 <a
51 class="hover:underline"
52 href="https://github.com/danielroe/firstcommit.is"
53 >
54 edit on GitHub
55 </a>
56 </footer>
57 </div>
58</template>