Made a baseline working carousel, timeline, and started flushing out content for primary spacex experience

src/pages/experience/spacex/avionics-test-engineering-internship.astro

@@ -1,11 +1,60 @@
 ---
 import ExperienceLayout from '@layouts/ExperienceLayout.astro';
-import {Image} from 'astro:assets';
+import Timeline from '@components/Timeline.astro';
+import Carousel from "@components/CustomCarousel.astro";
 
 import spring_2019_interns from "@assets/experience/spacex/avionics-test-engineering-internship/spring-2019-interns.jpg";
----
-<ExperienceLayout>
-    <Image class="mx-auto block" src={spring_2019_interns} alt="spring-2019-interns.jpg" loading="eager"/>
 
-    <span>Final text here</span>
+import type {carouselGroup} from "@interfaces/image-carousel.ts";
+import type {timelineEntry} from "@interfaces/timeline.ts";
+
+const headerCarouselGroup: carouselGroup = {
+    animation: "slide",
+    images: [
+        spring_2019_interns
+    ]
+}
+
+const timeline: timelineEntry[] = [
+    {
+        event: "Started",
+        date: "January 2019",
+    },
+    {
+        event: "Finished",
+        date: "March 2019",
+    }
+];
+---
+<ExperienceLayout title="SpaceX - Avionics Test Engineering Internship">
+    <!-- FIXME: Image bounds are all messed up -->
+    <Carousel carouselGroup={headerCarouselGroup}/>
+
+    <h2 class="font-bold md:text-2xl my-4">Summary</h2>
+    <h3 class="font-bold md:text-lg my-4">Timeline</h3>
+    <Timeline timeline={timeline}/>
+    <h3 class="font-bold md:text-lg my-4">Key Takeaways</h3>
+    <ul class="list-disc list-inside">
+        <li></li>
+    </ul>
+    <h3 class="font-bold md:text-lg my-4">Skills Used</h3>
+    <div class="relative grid gap-6 grid-flow-row sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4  border-caperren-green">
+        <div>
+            <div class="font-extrabold text-sm">Software</div>
+            <hr class="text-caperren-green"/>
+            <ul class="list-disc list-inside text-sm">
+                <li>Python</li>
+                <li>Test Driven Development</li>
+            </ul>
+        </div>
+        <div>
+            <div class="font-extrabold text-sm">Electrical</div>
+            <hr class="text-caperren-green"/>
+        </div>
+        <div>
+            <div class="font-extrabold text-sm">Other</div>
+            <hr class="text-caperren-green"/>
+        </div>
+    </div>
+    <h2 class="font-bold md:text-2xl my-4">Details</h2>
 </ExperienceLayout>