card stuff

src/components/Card.astro → src/components/cards/Card.astro

@@ -5,15 +5,15 @@ interface Props {
     url?: string;
 }
 
-const { title, description, url } = Astro.props
+const { title, description, url } = Astro.props;
 ---
 <div class="card">
+    <slot name="before" />
     <h2>{
         url == null
         ? title
         : <a href={url}>{title}</a>
     }</h2>
-
     <p>{description}</p>
     <slot name="after" />
 </div>

src/components/Post.astro → src/components/cards/Post.astro

@@ -1,5 +1,5 @@
 ---
-import Card from "@components/Card.astro";
+import Card from "@components/cards/Card.astro";
 import Date from "@components/Date.astro";
 
 import { remark } from 'remark'

src/pages/blog.astro

@@ -1,7 +1,7 @@
 ---
 import Page from "@layouts/Page.astro";
-import Post from "@components/Post.astro";
-import Cards from "@components/Cards.astro";
+import Post from "@components/cards/Post.astro";
+import Cards from "@components/cards/Cards.astro";
 
 import { getCollection } from "astro:content";
 const posts = await getCollection("blog");

src/pages/projects.astro

@@ -1,20 +1,20 @@
 ---
 import Page from "@layouts/Page.astro";
-import Card from "@components/Card.astro";
-import Cards from "@components/Cards.astro";
+import Card from "@components/cards/Card.astro";
+import Cards from "@components/cards/Cards.astro";
 ---
 <Page title="projects">
     <Cards>
         <Card
             title="website"
             description="My personal website written with Astro and TypeScript."
-            url = "https://github.com/mudkipdev/website"
+            url="https://github.com/mudkipdev/website"
         />
 
         <Card
             title="scnewsbot"
             description="A bot for the r/starcitizen Discord server."
-            url = "https://github.com/mudkipdev/scnewsbot"
+            url="https://github.com/mudkipdev/scnewsbot"
         />
     </Cards>
 </Page>