changes to index & 404

gabrielf11 · Sep 11, 2024 · 6374a89 · 6374a89
1 parent 0444861
commit 6374a89
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 21 deletions.
diff --git a/404.html b/404.html
@@ -10,7 +10,8 @@
     <link href="/dist/output.css" rel="stylesheet">
 </head>
 <body class="text-center bg-white text-black dark:bg-slate-800 dark:text-white">
-    <h1 class="text-9xl mt-72 font-black">404</h1>
+    <h1 class="text-8xl font-black">404</h1>
+    <caption>Page not found... sorry...?</caption>
     <button onclick="location.href='/index.html'" type="button" class="text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-200 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700">go home</button>
 
 </body>

diff --git a/dist/output.css b/dist/output.css
@@ -578,18 +578,10 @@ video {
   margin-top: 1.25rem;
 }
 
-.mt-72 {
-  margin-top: 18rem;
-}
-
 .flex {
   display: flex;
 }
 
-.flex-row {
-  flex-direction: row;
-}
-
 .flex-col {
   flex-direction: column;
 }
@@ -657,8 +649,8 @@ video {
   line-height: 1;
 }
 
-.text-9xl {
-  font-size: 8rem;
+.text-8xl {
+  font-size: 6rem;
   line-height: 1;
 }
 
@@ -733,6 +725,11 @@ video {
   font-weight: 700;
 }
 
+.hover\:text-blue-400:hover {
+  --tw-text-opacity: 1;
+  color: rgb(96 165 250 / var(--tw-text-opacity));
+}
+
 .hover\:text-blue-600:hover {
   --tw-text-opacity: 1;
   color: rgb(37 99 235 / var(--tw-text-opacity));
@@ -748,6 +745,11 @@ video {
   color: rgb(249 115 22 / var(--tw-text-opacity));
 }
 
+.hover\:text-red-400:hover {
+  --tw-text-opacity: 1;
+  color: rgb(248 113 113 / var(--tw-text-opacity));
+}
+
 .hover\:text-teal-400:hover {
   --tw-text-opacity: 1;
   color: rgb(45 212 191 / var(--tw-text-opacity));

diff --git a/index.html b/index.html
@@ -10,16 +10,16 @@
     <link href="/dist/output.css" rel="stylesheet">
 </head>
 <body class="bg-white text-black dark:bg-slate-800 dark:text-white text-center">
-    <h1 class="text-5xl md:text-7xl font-black p-5 transition-all">gabrielf11.github.io</h1>
-    <caption class="transition-all">This website is not finished, and will likely never be.</caption>
-    <div class="flex flex-row justify-center mt-2">
-        <button onclick="location.href='https://github.com/gabrielf11'" type="button" class="text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-200 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700">github</button>
-        <button onclick="location.href='https://youtube.com/@gabrielf111'" type="button" class="text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-200 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700">youtube</button>
-    </div>
-    <div class="flex flex-col mt-5 text-3xl md:text-4xl no-underline">
-        <a href="/imbored" class="hover:text-teal-400 hover:text-5xl hover:font-bold transition-all">imbored</a>
-        <a href="/music" class="hover:text-orange-500 hover:text-5xl hover:font-bold transition-all">"music"</a>
-        <a href="/educational-duck" class="hover:text-green-500 hover:text-5xl hover:font-bold transition-all">test game</a>
+    <h1 class="text-5xl md:text-7xl font-black p-5 transition-all">gabrielf11</h1>
+    <caption class="transition-all">welcome. there's not much here at the moment...</caption>
+    <div class="flex flex-col mt-5">
+        <p>external</p>
+        <a href="https://youtube.com/@gabrielf111" class="text-3xl md:text-4xl hover:text-red-400 hover:text-5xl hover:font-bold transition-all">youtube</a>
+        <a href="https://github.com/gabrielf11" class="text-3xl md:text-4xl hover:text-blue-400 hover:text-5xl hover:font-bold transition-all">github</a>
+        <p>et cetera</p>
+        <a href="/imbored" class="text-3xl md:text-4xl hover:text-teal-400 hover:text-5xl hover:font-bold transition-all">imbored</a>
+        <a href="/music" class="text-3xl md:text-4xl hover:text-orange-500 hover:text-5xl hover:font-bold transition-all">"music"</a>
+        <a href="/educational-duck" class="text-3xl md:text-4xl hover:text-green-500 hover:text-5xl hover:font-bold transition-all">test game</a>
     </div>
 <!-- npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch -->
 </body>