Finalized

src/pages/projects.astro

@@ -0,0 +1,58 @@
+---
+import Layout from "../layouts/Layout.astro";
+import ProjectCard from "../components/ProjectCard.astro";
+
+const projects = [
+  {
+    id: "bluesky-pds-manager",
+    name: "BlueSky PDS Manager",
+    description:
+      "A web-based BlueSky PDS Manager. Manage your invite codes and users with a simple web UI.",
+    link: "https://pdsman.atri.dad",
+  },
+  {
+    id: "pollo",
+    name: "Pollo",
+    description: "A dead-simple real-time voting tool.",
+    link: "https://git.atri.dad/atridad/pollo",
+  },
+  {
+    id: "goth-stack",
+    name: "GOTH Stack",
+    description:
+      "🚀 A Web Application Template Powered by HTMX + Go + Tailwind 🚀",
+    link: "https://git.atri.dad/atridad/goth.stack",
+  },
+  {
+    id: "himbot",
+    name: "Himbot",
+    description:
+      "A discord bot written in Go. Loosly named after my username online (HimbothySwaggins).",
+    link: "https://git.atri.dad/atridad/himbot",
+  },
+  {
+    id: "loadr",
+    name: "loadr",
+    description:
+      "A lightweight REST load testing tool with robust support for different verbs, token auth, and performance reports.",
+    link: "https://git.atri.dad/atridad/loadr",
+  },
+];
+---
+
+<Layout>
+  <div class="min-h-screen p-4 sm:p-8">
+    <h1 class="text-3xl sm:text-4xl font-bold text-secondary mb-6 sm:mb-8 text-center">
+      Projects
+    </h1>
+    <div class="flex flex-row flex-wrap justify-center gap-4 sm:gap-6 max-w-6xl mx-auto">
+      {projects.map((project) => (
+        <ProjectCard project={project} />
+      ))}
+    </div>
+    
+    {projects.length === 0 && (
+      <p class="text-center text-gray-500 mt-12">No projects available yet. Check back soon!</p>
+    )}
+  </div>
+</Layout>