From f7da804e40b990e5f1ee2214a2e2e4984d704f16 Mon Sep 17 00:00:00 2001
From: toufic ar <contact@toufy.me>
Date: Tue, 7 Jul 2026 18:29:43 +0300
Subject: initial commit

---
 src/lib/components/ServiceCard.svelte | 45 +++++++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 src/lib/components/ServiceCard.svelte

(limited to 'src/lib/components/ServiceCard.svelte')

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>
-- 
cgit v1.3.1