Add new card location, colours

Author: MostlyTurquoise

src/components/HomepageCarousel.svelte

@@ -9,6 +9,15 @@
         <Carousel.Item>B</Carousel.Item>
         <Carousel.Item>C</Carousel.Item>
     </Carousel.Content>
-    <Carousel.Previous class="top-auto bottom-1 left-10"/>
-    <Carousel.Next class="top-auto bottom-1 right-auto left-20"/>
+    <div
+        class="w-4/5 sm:w-72 bg-background absolute bottom-12 left-8 px-4 py-2"
+    >
+        <h1 class="font-display text-lg">Title</h1>
+        <div class="text-xs">body text</div>
+        <Button class="h-6">Action</Button>
+    </div>
+    <Carousel.Previous class="top-auto -bottom-2 scale-75 left-10" />
+    <Carousel.Next
+        class="top-auto -bottom-2 scale-75 right-auto left-[4.5rem]"
+    />
 </Carousel.Root>

src/components/RoboConLogo.astro

@@ -21,4 +21,4 @@ let { clickable = true, href="/" } = Astro.props
         text-shadow: -0.05em 0.05em black;
         cursor: {clickable ? "auto" : "default"};
     }
-</style>
+</style>