feat: fix stuff

src/content/posts/software/designing-this-website.mdx

@@ -3,6 +3,10 @@ title: "designing this website"
 date: "18/06/2024"
 ---
 
+## Update: Port to Astro (<span class="date">22/05/2025</span>)
+
+hi
+
 ## HTML, JavaScript, and CSS
 
 That's all there is to it.

src/layouts/BaseLayout.astro

@@ -27,6 +27,20 @@ const {
       <slot />
     </main>
     <Footer />
+    <script is:inline>
+      window.getTopicColor = function(topicName) {
+        switch (topicName) {
+          case "software":
+            return "#0073e6";
+          case "algorithms":
+            return "#d50032";
+          case "meditations":
+            return "#6a0dad";
+          default:
+            return "#000000";
+        }
+      };
+    </script>
     <slot name="scripts" />
   </body>
 </html>

src/pages/[category].astro

@@ -91,14 +91,10 @@ const capitalizedCategory =
 </style>
 
 <script define:vars={{ category }}>
-  import { getTopicColor } from "../utils/colors.js";
-
   document.addEventListener("DOMContentLoaded", function () {
     document.documentElement.style.setProperty(
       "--topic-color",
-      getTopicColor(category),
+      window.getTopicColor(category),
     );
-
-    window.getTopicColor = getTopicColor;
   });
 </script>

src/pages/index.astro

@@ -1,7 +1,6 @@
 ---
 import BaseLayout from "../layouts/BaseLayout.astro";
 import { getCollection } from "astro:content";
-import { getTopicColor } from "../utils/colors.js";
 
 const title = "Barrett Ruth";
 

src/utils/colors.js

@@ -9,4 +9,4 @@ export function getTopicColor(topicName) {
     default:
       return "#000000";
   }
-}
+}