src: update pages, css, etc

This commit is contained in:
notohh 2025-01-27 23:47:53 -05:00
parent 24f76ace4a
commit 5dca840a8f
Signed by: notohh
GPG key ID: BD47506D475EE86D
11 changed files with 37 additions and 16 deletions

View file

@ -5,7 +5,10 @@
--font-display: "Inter", "sans-serif";
--color-floral-white: #fffcf2;
--color-timber-wolf: #ccc5b9;
--color-black-olive: #403d39;
--color-eerie-black: #252422;
--color-flame: #eb5e28;
--color-accent-dark: #1e1d1b;
}
.color-transition {
transition: color 0.1s ease-in-out;
}

View file

Before

(image error) Size: 20 KiB

After

(image error) Size: 20 KiB

BIN
src/lib/images/error1.avif Normal file

Binary file not shown.

BIN
src/lib/images/error2.avif Normal file

Binary file not shown.

BIN
src/lib/images/error3.avif Normal file

Binary file not shown.

BIN
src/lib/images/error4.avif Normal file

Binary file not shown.

After

(image error) Size: 3.7 KiB

View file

@ -0,0 +1,10 @@
import error from "$lib/images/error.png";
import error1 from "$lib/images/error1.avif";
import error2 from "$lib/images/error2.avif";
import error3 from "$lib/images/error3.avif";
import error4 from "$lib/images/error4.avif";
const images = [error, error1, error2, error3, error4];
const randomImage = images[Math.floor(Math.random() * 5)];
export { randomImage };

View file

@ -1,11 +1,11 @@
<script lang="ts">
import { page } from "$app/state";
import fdm from "$lib/images/fdm.png";
import { randomImage } from "$lib/scripts/randomimage";
</script>
<div
class="font-display flex flex-col items-center justify-center h-screen bg-eerie-black text-floral-white"
>
<img class="mb-4" src={fdm} alt="feelsdankman" />
<h1>{page.status}: {page.error?.message}</h1>
<img class="mb-4" src={randomImage} alt="" />
<h1 class="text-4xl font-bold">{page.status}: {page.error?.message}</h1>
</div>

View file

@ -3,13 +3,14 @@
</script>
<div
class="font-display flex items-center h-10 justify-center bg-eerie-black text-floral-white"
class="font-display flex items-center h-10 justify-center bg-accent-dark text-floral-white"
>
<nav class="space-x-4">
<a href="/" class="hover:text-timber-wolf">home</a>
<a href="/about" class="hover:text-timber-wolf">about</a>
<a href="https://status.flake.sh/status/kumo" class="hover:text-timber-wolf"
>status</a
<nav class="space-x-4 text-xl">
<a href="/" class="hover:text-timber-wolf color-transition">home</a>
<a href="/about" class="hover:text-timber-wolf color-transition">about</a>
<a
href="https://status.flake.sh/status/kumo"
class="hover:text-timber-wolf color-transition">status</a
>
</nav>
</div>

View file

@ -18,22 +18,22 @@
<div class="flex space-x-4 mt-4">
<a href="https://www.last.fm/user/notoh" aria-label="Lastfm">
<Lastfm
className="w-8 h-8 fill-current text-floral-white hover:text-red-500"
className="w-8 h-8 fill-current text-floral-white hover:text-red-500 color-transition"
/>
</a>
<a href="https://git.flake.sh/notohh" aria-label="Forgejo">
<Forgejo
className="w-8 h-8 fill-current text-floral-white hover:text-orange-400"
className="w-8 h-8 fill-current text-floral-white hover:text-orange-500 color-transition"
/>
</a>
<a href="https://bsky.app/profile/flake.sh" aria-label="Bluesky">
<Bluesky
className="w-8 h-8 fill-current text-floral-white hover:text-blue-400"
className="w-8 h-8 fill-current text-floral-white hover:text-blue-500 color-transition"
/>
</a>
<a href="https://www.twitch.tv/notohh" aria-label="Twitch">
<Twitch
className="w-8 h-8 fill-current text-floral-white hover:text-purple-500"
className="w-8 h-8 fill-current text-floral-white hover:text-purple-500 color-transition"
/>
</a>
</div>

View file

@ -1,5 +1,12 @@
<div
class="font-display flex flex-col items-center justify-center h-screen bg-eerie-black text-floral-white"
>
<h1>nothing here yet lol</h1>
<h1 class="text-5xl mb-5">about me</h1>
<ul class="text-xl">
<li>23 y/o</li>
<li>interested in linux, devops, etc</li>
<li>metalhead</li>
<li>i use nixos btw</li>
<li>professional retard</li>
</ul>
</div>