initial commit

13 files changed, 470 insertions, 0 deletions

diff --git a/src/lib/assets/favicon.ico b/src/lib/assets/favicon.ico
new file mode 100644
index 0000000..6c4fa09
--- /dev/null
+++ b/src/lib/assets/favicon.ico
diff --git a/src/lib/assets/kitty.png b/src/lib/assets/kitty.png
new file mode 100644
index 0000000..a68fa01
--- /dev/null
+++ b/src/lib/assets/kitty.png
diff --git a/src/lib/assets/kitty.svg b/src/lib/assets/kitty.svg
new file mode 100644
index 0000000..5e8a5be
--- /dev/null
+++ b/src/lib/assets/kitty.svg
@@ -0,0 +1,114 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 24.1.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+
+<svg
+   version="1.1"
+   id="Layer_2"
+   x="0px"
+   y="0px"
+   viewBox="0 0 128 128"
+   style="enable-background:new 0 0 128 128;"
+   xml:space="preserve"
+   sodipodi:docname="kitty.svg"
+   inkscape:version="1.4.3 (0d15f75042, 2025-12-25)"
+   inkscape:export-filename="kitty.png"
+   inkscape:export-xdpi="750"
+   inkscape:export-ydpi="750"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+   id="namedview1"
+   pagecolor="#505050"
+   bordercolor="#eeeeee"
+   borderopacity="1"
+   inkscape:showpageshadow="0"
+   inkscape:pageopacity="0"
+   inkscape:pagecheckerboard="0"
+   inkscape:deskcolor="#505050"
+   showgrid="false"
+   inkscape:zoom="4.0834165"
+   inkscape:cx="55.713151"
+   inkscape:cy="77.875965"
+   inkscape:window-width="1534"
+   inkscape:window-height="841"
+   inkscape:window-x="0"
+   inkscape:window-y="0"
+   inkscape:window-maximized="1"
+   inkscape:current-layer="Layer_2" /><defs
+   id="defs17" />
+<path
+   style="fill:#ffa1ad;fill-opacity:1"
+   d="M114.67,70.19C112.71,44.22,94.44,26.3,64,26.3S15.25,45.33,13.45,71.31  c-1.05,15.14,4.58,28.63,15.91,36.32c7.46,5.07,17.88,7.88,34.77,7.88c17.18,0,27.03-3.71,34.49-8.73  C111.05,98.43,115.8,85.11,114.67,70.19z"
+   id="path1" />
+
+<path
+   style="enable-background:new 0 0 128 128;fill:#ffa1ad;fill-opacity:1"
+   d="M53.72,42.6C46.3,23.4,30.1,10.34,23.87,8.39c-2.35-0.74-5.3-0.81-6.63,1.35     c-3.36,5.45-7.66,22.95,1.85,47.78L53.72,42.6z"
+   id="path2" /><path
+   style="enable-background:new 0 0 128 128;fill:#feccd2;fill-opacity:1"
+   d="M36.12,34.21c1.54-1.29,2.29-2.55,0.6-5.16c-2.62-4.05-7.33-8.78-9.16-10.23    c-3-2.38-5.32-3.18-6.21,0.65c-1.65,7.08-1.52,16.69,0.25,21.99c0.62,1.87,2.54,2.86,4.02,1.57L36.12,34.21z"
+   id="path3" /><path
+   style="fill:#feccd2;fill-opacity:1"
+   d="M54.12,45.02c1.13,0.96,3.42,0.82,4.75-0.72c1.61-1.87,3.29-8.17,2.24-17.91  c-4.67,0.17-9.09,0.84-13.21,1.97C51.23,33.82,52.03,43.24,54.12,45.02z"
+   id="path4" />
+<path
+   style="fill:#feccd2;fill-opacity:1"
+   d="M73.88,45.02c-1.13,0.96-3.42,0.82-4.75-0.72c-1.61-1.87-3.29-8.17-2.24-17.91  c4.67,0.17,9.09,0.84,13.21,1.97C76.77,33.82,75.97,43.24,73.88,45.02z"
+   id="path5" />
+
+
+<path
+   style="enable-background:new 0 0 128 128;fill:#ffa1ad;fill-opacity:1"
+   d="M79.9,29.22c8.08-12.41,19.38-20.75,24.07-22.24c2.32-0.74,5.02-0.62,6.34,1.55   c3.32,5.45,6.13,22.24-0.42,45.75L85.96,42.74L79.9,29.22z"
+   id="path6" /><path
+   style="enable-background:new 0 0 128 128;fill:#feccd2;fill-opacity:1"
+   d="M97.55,38.23c2.43,2.43,4.41,4.06,5.84,5.61c0.95,1.03,2.69,0.56,2.97-0.82   c2.45-11.8,1.67-21.86,0-24.5c-0.8-1.26-2.29-1.59-3.65-1.13c-2.44,0.81-8.66,5.45-13.05,12.22c-0.51,0.79-0.32,1.85,0.46,2.38   C91.7,33.06,94.46,35.13,97.55,38.23z"
+   id="path7" />
+
+<g
+   id="g11"
+   style="enable-background:new 0 0 128 128;fill:none;stroke:#feccd2;stroke-opacity:1">
+		<path
+   style="fill:none;stroke:#feccd2;stroke-width:3;stroke-linecap:round;stroke-miterlimit:10;stroke-opacity:1"
+   d="M6.7,71.03    c0.34,0.41,4.41,0.35,14.36,5.07"
+   id="path9" />
+		<path
+   style="fill:none;stroke:#feccd2;stroke-width:3;stroke-linecap:round;stroke-miterlimit:10;stroke-opacity:1"
+   d="M2.9,82.86    c0,0,6.42-2.24,17.46-0.28"
+   id="path10" />
+		<path
+   style="fill:none;stroke:#feccd2;stroke-width:3;stroke-linecap:round;stroke-miterlimit:10;stroke-opacity:1"
+   d="M8.81,92.29    c0,0,2.74-1.38,12.67-2.25"
+   id="path11" />
+	</g><g
+   id="g14"
+   style="enable-background:new 0 0 128 128;fill:none;stroke:#feccd2;stroke-opacity:1">
+		<path
+   style="fill:none;stroke:#feccd2;stroke-width:3;stroke-linecap:round;stroke-miterlimit:10;stroke-opacity:1"
+   d="M120.87,67.51    c0,0-3.41,0.33-13.94,6.34"
+   id="path12" />
+		<path
+   style="fill:none;stroke:#feccd2;stroke-width:3;stroke-linecap:round;stroke-miterlimit:10;stroke-opacity:1"
+   d="M122.42,78.49    c0,0-5.09-0.36-16.05,1.97"
+   id="path13" />
+		<path
+   style="fill:none;stroke:#feccd2;stroke-width:3;stroke-linecap:round;stroke-miterlimit:10;stroke-opacity:1"
+   d="M120.45,89.05    c0,0-4.83-1.71-14.78-2.25"
+   id="path14" />
+	</g><path
+   style="fill:#feccd2;fill-opacity:1"
+   d="M96.09,66.37c-0.34,5.51-3.76,8.54-7.65,8.54s-7.04-3.88-7.04-8.66c0-4.78,3.28-8.71,7.65-8.47  C94.12,58.07,96.37,61.87,96.09,66.37z"
+   id="path15" />
+<path
+   style="fill:#feccd2;fill-opacity:1"
+   d="M46,65.81c0.78,5.61-1.58,9.03-5.49,9.82c-3.91,0.79-7.26-1.84-8.23-6.64  c-0.98-4.81,0.9-9.32,5.34-9.97C42.77,58.27,45.36,61.22,46,65.81z"
+   id="path16" />
+<path
+   d="m 44.989996,85.160003 c -2.57,1.67 0.47,5.54 2.25,6.85 1.78,1.31 4.98,2.92 9.670005,2.44 5.54,-0.56 7.13,-4.69 7.13,-4.69 0,0 1.97,4.6 8.82,4.79 6.950002,0.19 9.100002,-3.57 10.040002,-4.69 0.94,-1.13 1.88,-4.04 0.28,-5.16 -1.6,-1.13 -2.72,0.28 -4.41,2.63 -1.69,2.35 -5.160002,3.66 -8.540002,2.06 -3.38,-1.6 -3.57,-7.04 -3.57,-7.04 l -4.79,0.28 c 0,0 -0.75,4.69 -2.91,6.19 -2.16,1.5 -7.320005,1.88 -9.480005,-1.41 -0.95,-1.46 -2.33,-3.66 -4.49,-2.25 z"
+   id="path17"
+   style="display:inline;fill:#feccd2;fill-opacity:1;stroke:none" /><path
+   d="M55.67,77.75c-0.05-3.08,4.37-4.55,8.54-4.62c4.18-0.07,8.68,1.29,8.73,4.37c0.05,3.08-5.22,7.13-8.54,7.13  C61.09,84.63,55.73,80.82,55.67,77.75z"
+   id="path8"
+   style="enable-background:new 0 0 128 128;stroke-width:1.0015748;stroke-dasharray:none;stroke:none;fill:#feccd2;fill-opacity:1;stroke-opacity:1" />
+</svg>
diff --git a/src/lib/components/Attributions.svelte b/src/lib/components/Attributions.svelte
new file mode 100644
index 0000000..7cdc5cc
--- /dev/null
+++ b/src/lib/components/Attributions.svelte
@@ -0,0 +1,56 @@
+<script lang="ts">
+  import Link from "./Link.svelte";
+  import SectionTitle from "./SectionTitle.svelte";
+</script>
+
+<SectionTitle title="attributions"
+  >credits and sources for the content in this page</SectionTitle
+>
+
+<div
+  class="grid grid-cols-1 md:grid-cols-3 w-full gap-4
+  place-items-stretch place-content-stretch"
+>
+  <fieldset
+    class="fieldset bg-base-200 border-neutral
+	rounded-box border-2 p-4"
+  >
+    <legend class="text-xl md:text-2xl">stack</legend>
+    <ul class="text-md md:text-lg">
+      <li><Link href="https://svelte.dev">Svelte</Link></li>
+      <li>
+        <Link href="https://daisyui.com">daisyUI</Link>
+      </li>
+      <li><Link href="https://tailwindcss.com">tailwindcss</Link></li>
+    </ul>
+  </fieldset>
+  <fieldset
+    class="fieldset bg-base-200 border-neutral
+	rounded-box border-2 p-4"
+  >
+    <legend class="text-xl md:text-2xl">fonts</legend>
+    <ul class="text-md md:text-lg">
+      <li><Link href="https://www.departuremono.com">DEPARTURE MONO</Link></li>
+      <li>
+        <Link href="https://www.jetbrains.com/lp/mono">JetBrains Mono</Link>
+      </li>
+      <li><Link href="https://github.com/IBM/plex">IBM Plex Mono</Link></li>
+    </ul>
+  </fieldset>
+  <fieldset
+    class="fieldset bg-base-200 border-neutral
+	rounded-box border-2 p-4"
+  >
+    <legend class="text-xl md:text-2xl">assets</legend>
+    <ul class="text-md md:text-lg">
+      <li>
+        <Link href="https://www.emoji.family/api/emojis/1f431/noto/svg"
+          >Noto cat emoji</Link
+        >
+      </li>
+      <li>
+        <Link href="https://iconify.design">iconify</Link>
+      </li>
+    </ul>
+  </fieldset>
+</div>
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>
diff --git a/src/lib/components/Keys.svelte b/src/lib/components/Keys.svelte
new file mode 100644
index 0000000..9663cc1
--- /dev/null
+++ b/src/lib/components/Keys.svelte
@@ -0,0 +1,57 @@
+<script lang="ts">
+  import SectionTitle from "./SectionTitle.svelte";
+  const ssh: string =
+    "ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIN8CKkq7m/FPTqjAO3yGWhH7y+9flDjyNC9hQFenvbKs toufy";
+  const pgp: string = `-----BEGIN PGP PUBLIC KEY BLOCK-----
+mDMEaXaizxYJKwYBBAHaRw8BAQdARrftn56656s3XyW15b3DBMTcrvCvcRjOs53P
+tVsrsGC0EXRvdWZpYyBhciAodG91ZnkpiJAEExYKADgWIQRKDkdYNWjksRtcJVm7
+ozAX4p50+wUCaXaizwIbAwULCQgHAgYVCgkICwIEFgIDAQIeAQIXgAAKCRC7ozAX
+4p50+2gTAP9pFdyrNoOsOkdkcaBzIs9CZfkf38ZQsdi8vZsdXtquSAEAyaqVsXCN
+tpMn3/ax/034uY0wAVa9WluqWcvGK+jb7we4OARpdqLPEgorBgEEAZdVAQUBAQdA
+YQqEaD8/QXfS9rU471nhxbB1bHANd/NAG8TG1mJeLFkDAQgHiHgEGBYKACAWIQRK
+DkdYNWjksRtcJVm7ozAX4p50+wUCaXaizwIbDAAKCRC7ozAX4p50+3PEAP0abVGS
+7KLZCqJRjsRfhNP0IrveTuKrW5hckVu4GNgkCQEAtXHhO8Kj6l41m6v36AWddSUz
+iv6s3F2Wfm3pjizriQc=
+=w8/B
+-----END PGP PUBLIC KEY BLOCK-----`;
+</script>
+
+<SectionTitle title="keys">my public keys</SectionTitle>
+<div
+  class="flex flex-col w-auto max-w-full bg-base-300 p-4 rounded-md
+  self-start"
+>
+  <h3 class="flex flex-row place-items-center text-xl">
+    <span class="font-extrabold text-accent">SSH</span>
+    <button
+      title="copy"
+      id="sshCopyBtn"
+      class="font-extrabold text-secondary cursor-pointer
+	  active:text-primary"><span class="iconify-[fa7-regular--copy]"></span></button
+    >
+    <input type="hidden" id="sshKeyValue" value={ssh} />
+  </h3>
+  <pre class="bg-neutral p-2 my-2 rounded-md overflow-scroll"><code>{ssh}</code
+    ></pre>
+  <h3 class="flex flex-row place-items-center text-xl">
+    <span class="font-extrabold text-accent">PGP</span>
+    <button
+      title="copy"
+      id="pgpCopyBtn"
+      class="font-extrabold text-secondary cursor-pointer
+	  active:text-primary"><span class="iconify-[fa7-regular--copy]"></span></button
+    >
+    <input type="hidden" id="pgpKeyValue" value={pgp} />
+  </h3>
+  <pre class="bg-neutral p-2 my-2 rounded-md overflow-scroll"><code>{pgp}</code
+    ></pre>
+  <script>
+    function copyKey(key) {
+      navigator.clipboard.writeText(key);
+    }
+    document.getElementById("sshCopyBtn").onclick = () =>
+      copyKey(document.getElementById("sshKeyValue").value);
+    document.getElementById("pgpCopyBtn").onclick = () =>
+      copyKey(document.getElementById("pgpKeyValue").value);
+  </script>
+</div>
diff --git a/src/lib/components/Link.svelte b/src/lib/components/Link.svelte
new file mode 100644
index 0000000..97f976f
--- /dev/null
+++ b/src/lib/components/Link.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  const { href, children }: { href: string; children: any } = $props();
+</script>
+
+<a
+  class="text-accent hover:bg-accent hover:text-accent-content
+  selection:bg-accent! selection:text-accent-content!"
+  {href}
+  target="_blank">{@render children()}</a
+>
diff --git a/src/lib/components/SectionTitle.svelte b/src/lib/components/SectionTitle.svelte
new file mode 100644
index 0000000..4550050
--- /dev/null
+++ b/src/lib/components/SectionTitle.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  const { title, children }: { title: string; children: any } = $props();
+</script>
+
+<div class="w-full self-start">
+  <h2 class="text-2xl md:text-4xl text-primary">{title}</h2>
+  <p class="text-sm md:text-lg text-base-content m-2">
+    {@render children()}
+  </p>
+</div>
diff --git a/src/lib/components/ServiceCard.svelte b/src/lib/components/ServiceCard.svelte
new file mode 100644
index 0000000..86cf2ed
--- /dev/null
+++ b/src/lib/components/ServiceCard.svelte
@@ -0,0 +1,45 @@
+<script lang="ts">
+  import Link from "./Link.svelte";
+
+  const { service }: { service: App.ServiceItem } = $props();
+</script>
+
+<div
+  class="card bg-base-200 card-md md:card-lg shadow-md
+	border border-neutral my-1 md:mx-1"
+>
+  <div class="card-body">
+    <div class="card-title text-secondary">
+      <span class={service.icon}></span>
+      <h3>{service.name}</h3>
+    </div>
+    <div class="divider m-0 p-0"></div>
+    <p>{service.description}</p>
+    <div class="flex flex-row w-full h-full">
+      {#each service.references as reference}
+        <span class="mx-1"
+          ><Link href={reference.url}
+            >{reference.name}
+            <span class="iconify-[fa7-solid--arrow-up-right-from-square]"
+            ></span></Link
+          ></span
+        >
+      {/each}
+    </div>
+    <div class="divider m-0 p-0 invisible"></div>
+    <div class="card-actions justify-start">
+      <a
+        href={service.url}
+        target="_blank"
+        class="btn btn-outline btn-secondary"
+        >check <span class="iconify-[fa7-solid--chevron-right]"></span></a
+      >
+      <a
+        href={service.source}
+        target="_blank"
+        class="btn btn-ghost btn-secondary"
+        ><span class="iconify-[fa7-regular--file-code]"></span> source code</a
+      >
+    </div>
+  </div>
+</div>
diff --git a/src/lib/components/Services.svelte b/src/lib/components/Services.svelte
new file mode 100644
index 0000000..d291599
--- /dev/null
+++ b/src/lib/components/Services.svelte
@@ -0,0 +1,77 @@
+<script lang="ts">
+  import ServiceCard from "./ServiceCard.svelte";
+  import SectionTitle from "./SectionTitle.svelte";
+
+  const services: App.ServiceItem[] = [
+    {
+      icon: "iconify-[fa7-brands--git-alt]",
+      name: "git",
+      description:
+        "cgit instance, all project repositories are accessible and available under free licenses",
+      source: "https://git.toufy.me/servers/tree/aphrodite/devops/git.nix",
+      url: "https://git.toufy.me",
+      references: [
+        { name: "git", url: "https://git-scm.com" },
+        { name: "cgit", url: "https://git.zx2c4.com/cgit/about" },
+        { name: "gitolite", url: "https://gitolite.com/gitolite" },
+      ],
+    },
+    {
+      icon: "iconify-[fa7-solid--search]",
+      name: "search",
+      description:
+        "my public searxng instance. no usage metrics. opinionated selection of engines; no LLMs, captchas, or censorship/far-right engines",
+      source: "https://git.toufy.me/servers/tree/aphrodite/search",
+      url: "https://search.toufy.me",
+      references: [{ name: "searxng", url: "https://searxng.org" }],
+    },
+    {
+      icon: "iconify-[fa7-brands--tor-browser]",
+      name: "tor",
+      description:
+        "a tor relay node and an embedded snowflake. open this page and keep the tab running in the background to spin up your own snowflake instance",
+      source: "https://git.toufy.me/servers/tree/adonis/tor",
+      url: "https://tor.toufy.me",
+      references: [
+        { name: "tor project", url: "https://torproject.org" },
+        { name: "snowflake", url: "https://snowflake.torproject.org" },
+      ],
+    },
+    {
+      icon: "iconify-[fa7-brands--arch-linux]",
+      name: "aur",
+      description:
+        "weekly builds of AUR packages (mostly for development) that i use, but if someone requests a package i might add it",
+      source: "https://git.toufy.me/taur",
+      url: "https://aur.toufy.me",
+      references: [{ name: "aur", url: "https://aur.archlinux.org" }],
+    },
+    {
+      icon: "iconify-[fa7-solid--wifi]",
+      name: "captive portal",
+      description:
+        "a telemetry-free captive portal check as an alternative to android's default 'connectivitycheck.gstatic.com' by google",
+      source:
+        "https://git.toufy.me/servers/tree/adonis/captiveportal/default.nix",
+      url: "https://cpc.toufy.me",
+      references: [
+        {
+          name: "captive portal detection",
+          url: "https://developer.android.com/about/versions/11/features/captive-portal#detection",
+        },
+      ],
+    },
+  ];
+</script>
+
+<SectionTitle title="public service">
+  a list of my public services;<br />
+  everything you can access/use is free (as in free speech and free beer)
+</SectionTitle>
+<div class="flex place-content-center place-items-center w-full">
+  <div class="grid grid-cols-1 md:grid-cols-3 w-fit">
+    {#each services as service}
+      <ServiceCard {service} />
+    {/each}
+  </div>
+</div>
diff --git a/src/lib/components/SocialCard.svelte b/src/lib/components/SocialCard.svelte
new file mode 100644
index 0000000..f34eb75
--- /dev/null
+++ b/src/lib/components/SocialCard.svelte
@@ -0,0 +1,38 @@
+<script lang="ts">
+  const {
+    name,
+    icon,
+    href,
+    rel,
+  }: {
+    name: string;
+    icon: string;
+    href: string;
+    rel?: string | null | undefined;
+  } = $props();
+</script>
+
+<a
+  class="card shadow-md border border-neutral my-1 mx-1 socialhover p-2"
+  {rel}
+  {href}
+  target="_blank"
+  title={name}
+>
+  <span class="text-3xl md:text-6xl {icon}"></span>
+</a>
+
+<style>
+  .socialhover {
+    span {
+      color: var(--color-fg);
+    }
+  }
+  .socialhover:hover,
+  .socialhover:active {
+    background-color: var(--color-fg);
+    span {
+      color: var(--color-bg);
+    }
+  }
+</style>
diff --git a/src/lib/components/Socials.svelte b/src/lib/components/Socials.svelte
new file mode 100644
index 0000000..c616405
--- /dev/null
+++ b/src/lib/components/Socials.svelte
@@ -0,0 +1,30 @@
+<script lang="ts">
+  import SectionTitle from "./SectionTitle.svelte";
+  import SocialCard from "./SocialCard.svelte";
+</script>
+
+<SectionTitle title="socials">places you can find me</SectionTitle>
+<div class="flex place-content-start place-items-start w-full">
+  <SocialCard
+    name="mastodon"
+    icon="iconify-[fa7-brands--mastodon]"
+    rel="me"
+    href="https://beige.party/@toufy"
+    --color-fg="#6364ff"
+    --color-bg="#ffffff"
+  />
+  <SocialCard
+    name="email"
+    icon="iconify-[fa7-solid--envelope]"
+    href="mailto:contact@toufy.me"
+    --color-fg="gray"
+    --color-bg="#ffffff"
+  />
+  <SocialCard
+    name="tmdb"
+    icon="iconify-[cib--the-movie-database]"
+    href="https://www.themoviedb.org/u/toufy"
+    --color-fg="#0177d2"
+    --color-bg="#ffffff"
+  />
+</div>
diff --git a/src/lib/index.ts b/src/lib/index.ts
new file mode 100644
index 0000000..856f2b6
--- /dev/null
+++ b/src/lib/index.ts
@@ -0,0 +1 @@
+// place files you want to import through the `$lib` alias in this folder.