First prototype of projects

src/components/BlogItem.astro

@@ -41,15 +41,3 @@ const { title, description, date, href, header } = Astro.props;
         </a>
     </span>
 </TerminalBorder>
-
-<style>
-    .section:hover() {
-        position: relative;
-        padding: 10.8rem;
-        padding-top: 0.85rem;
-        display: flex;
-        border-style: solid;
-        border-width: 1px;
-        border-color: var(--alt);
-    }
-</style>

src/components/Project.astro

@@ -0,0 +1,25 @@
+---
+import TerminalBorder from "../components/TerminalBorder.astro";
+import Link from "../components/Link.astro";
+
+interface Props {
+    title: string;
+    description: string;
+    href: string;
+}
+
+const { title, description, href } = Astro.props;
+---
+
+<div class="flex-column">
+    <TerminalBorder>
+        <span>
+            <h1 class="inline-block text-[130%] text-[var(--accent)]">{title}</h1>
+            <p class="inline-block text-[var(--secondary)]">{description}</p>
+            <span class="block my-2"><slot /></span>
+        </span>
+    </TerminalBorder>
+    <TerminalBorder header="Shell">
+        <Link href={href}>cd ~/projects/{title}</Link>
+    </TerminalBorder>
+</div>

src/pages/projects.astro

@@ -0,0 +1,52 @@
+---
+import Terminal from "../layouts/Terminal.astro";
+import Project from "../components/Project.astro";
+---
+
+<Terminal path="skills">
+    <div class="grid grid-rows-2 mt-2 space-y-4">
+        <div class="grid grid-cols-2 items-center gap-x-8">
+            <Project
+                title="Kapi"
+                description="Minecraft Framework"
+                href="https://github.com/KapiMC/Kapi"
+            >
+                A bunch of text
+                A bunch of text
+                A bunch of text
+                A bunch of text
+                A bunch of text
+            </Project>
+            <Project
+                title="Kapi"
+                description="Hello"
+                href="https://github.com/KapiMC/Kapi"
+            >
+                A bunch of text
+            </Project>
+        </div>
+        <div class="grid grid-cols-3 items-center gap-x-8">
+            <Project
+                title="Trident"
+                description="IntelliJ Plugin"
+                href="https://github.com/Kyren223/Trident"
+            >
+                The fastest way to navigate to your most used files, with the least amount of keystrokes!
+            </Project>
+            <Project
+                title="Kapi"
+                description="Hello"
+                href="https://github.com/KapiMC/Kapi"
+            >
+                A bunch of text
+            </Project>
+            <Project
+                title="Kapi"
+                description="Hello"
+                href="https://github.com/KapiMC/Kapi"
+            >
+                A bunch of text
+            </Project>
+        </div>
+    </div>
+</Terminal>

src/styles/terminal.css

@@ -1,15 +1,5 @@
 @import url("../styles/fonts/JetBrainsMono.css");
 
-/* :root { */
-/*     --primary: #ffbf00; */
-/*     --secondary: #9b7eca; */
-/*     --accent: #7ed4fb; */
-/*     --extra: #8fcc75; */
-/*     --text: #ffffff; */
-/*     --alt: #999999; */
-/*     --background: #000000; */
-/* } */
-
 :root {
   --primary: #54d7a9;
   --secondary: #9b7eca;