feat: website release v2 (#616)

* feat: upgrade to svelte 5 & tailwind v4 + add navigation menu to ui package * feat: website navigation with nav menu from shadcn * chore: refactor navigation menu storybook * fix: responsiveness bug * chore: remove tailwind config file * chore: - remove carbon icons from repo - add Geist font family * refactor website --------- Co-authored-by: Rotimi Best <[email protected]>
2025-12-20 12:44:59 +01:00
parent 690cf147ff
commit e6a3cf9332
108 changed files with 2425 additions and 2169 deletions
@@ -0,0 +1,48 @@
+<script>
+  import { Badge } from '@cio/ui/base/badge';
+  import { formatDate } from '$lib/utils/format-date';
+
+  export let post;
+  export let isRecommended = false;
+</script>
+
+{#if !isRecommended}
+  <div class="mb-5 flex md:flex-row flex-col md:items-center gap-2">
+    <!-- Date -->
+    <p class="text-sm text-slate-500">{formatDate(post.date)}</p>
+
+    <!-- Tags  -->
+    <div class="flex flex-col">
+      <div class="flex flex-wrap gap-2">
+        {#each post.tags as tag}
+          <Badge variant="outline">{tag}</Badge>
+        {/each}
+      </div>
+    </div>
+  </div>
+{/if}
+
+<a href="/blog/{post.slug}" class="group">
+  <img
+    loading="lazy"
+    src={post.imageUrl}
+    alt={post.title}
+    class="w-70 h-48 object-cover rounded-md"
+  />
+  <p
+    class="font-bold text-lg py-2 {isRecommended &&
+      'h-[60px]'} line-clamp-2 group-hover:text-slate-500"
+  >
+    {@html post.title}
+  </p>
+
+  <p class="text-slate-500 pt-2 mb-4 line-clamp-3">{post.description}</p>
+</a>
+
+<div class="flex items-center justify-start gap-4 my-2">
+  <img loading="lazy" src={post.avatar} alt="avatar" class="w-10 h-10 rounded-full" />
+  <span>
+    <p class="font-semibold">{post.author}</p>
+    <p class="text-slate-500">{post.role}</p>
+  </span>
+</div>