Finished ross content, added skill matrix, li, and ul, and improved many existing components, created and refactored to unified layouts and grid, visual improvements with proper column to row collapsing

src/components/SkillMatrix/SkillMatrix.astro

@@ -0,0 +1,30 @@
+---
+import H3 from "@components/H3.astro";
+import PageGroup from "@components/PageGroup.astro";
+import Ul from "@components/Ul.astro";
+
+import type { categorySkills } from "@interfaces/skill-matrix.ts";
+
+interface Props {
+  categorizedSkills: categorySkills[];
+}
+
+const { categorizedSkills } = Astro.props;
+---
+
+<PageGroup>
+  <Fragment slot="header"><H3>Relevant Skills</H3></Fragment>
+  <div
+    class="border-caperren-green grid grid-flow-row gap-6 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4"
+  >
+    {
+      categorizedSkills.map((categorySkills) => (
+        <div>
+          <div class="text-sm font-extrabold">{categorySkills.category}</div>
+          <hr class="text-caperren-green" />
+          <Ul class="text-sm" lineItems={categorySkills.skills} />
+        </div>
+      ))
+    }
+  </div>
+</PageGroup>