diff options
Diffstat (limited to 'src/lib/components/Header.svelte')
| -rw-r--r-- | src/lib/components/Header.svelte | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/src/lib/components/Header.svelte b/src/lib/components/Header.svelte new file mode 100644 index 0000000..ab47dbe --- /dev/null +++ b/src/lib/components/Header.svelte @@ -0,0 +1,32 @@ +<script lang="ts"> + import kitty from "$lib/assets/kitty.png"; + import Link from "./Link.svelte"; +</script> + +<div + class="flex flex-col my-4 p-4 card shadow-lg bg-base-200 + place-items-center place-content-center w-full text-center" +> + <div class="flex flex-row place-items-center place-content-center"> + <img + src={kitty} + class="w-15 md:w-25" + alt="the smiling noto cat emoji, with the colors modified such that the face and ears are a dark shade of pink, and the whiskers, eyes, mouth, inside of the ears, and nose, are a light shade of pink" + /> + <h1 class="text-4xl md:text-6xl text-primary">toufy</h1> + </div> + <p class="text-lg md:text-2xl"> + <Link href="https://en.wikipedia.org/wiki/Palestinians">palestinian</Link> software + engineer, tinkerer, linux enjoyer, privacy & security enthusiast, and free software + advocate <Link href="https://en.wikipedia.org/wiki/Palestinian_refugees" + >refuged</Link + > in <Link href="https://en.wikipedia.org/wiki/Lebanon">lebanon</Link> + <br /> + <span class="badge badge-sm md:badge-lg p-4 m-2 badge-dash" + ><Link href="https://en.wikipedia.org/wiki/Anarchist_communism" + >anarcho-communist</Link + ><span class="divider"></span> + <Link href="https://en.wikipedia.org/wiki/Straight_ally">ally</Link></span + > + </p> +</div> |