feat: format

src/layouts/PostLayout.astro

@@ -1,6 +1,6 @@
 ---
-import BaseLayout from './BaseLayout.astro';
-import path from 'path';
+import BaseLayout from "./BaseLayout.astro";
+import { getTopicColor } from "../utils/colors.js";
 
 interface Props {
   frontmatter: {
@@ -12,51 +12,41 @@ interface Props {
 }
 
 const { frontmatter, post } = Astro.props;
-const { 
-  title, 
-  description, 
-  useKatex = false,
- 
-} = frontmatter;
+const { title, description, useKatex = false } = frontmatter;
 
-const filePath = post?.id || '';
-const category = filePath.split('/')[0];
-
-function getTopicColor(category: string) {
-  switch (category) {
-    case 'algorithms':
-      return '#d50032';
-    case 'software':
-      return '#0073e6';
-    case 'operating-systems':
-      return '#009975';
-    case 'meditations':
-      return '#6a0dad';
-    default:
-      return '#000000';
-  }
-}
+const filePath = post?.id || "";
+const category = filePath.split("/")[0];
 
 const topicColor = getTopicColor(category);
 ---
 
 <BaseLayout title={title} description={description} useKatex={useKatex}>
   <slot name="head" slot="head">
-    <link rel="stylesheet" href="/styles/post.css" />
-    <link rel="stylesheet" href="/styles/mdx.css" />
-    {useKatex && (
-      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/katex.min.css" integrity="sha384-5TcZemv2l/9On385z///+d7MSYlvIEw9FuZTIdZ14vJLqWphw7e7ZPuOiCHJcFCP" crossorigin="anonymous" />
-    )}
+    <link rel="stylesheet" href="/styles/posts.css" />
+    {
+      useKatex && (
+        <link
+          rel="stylesheet"
+          href="https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/katex.min.css"
+          integrity="sha384-5TcZemv2l/9On385z///+d7MSYlvIEw9FuZTIdZ14vJLqWphw7e7ZPuOiCHJcFCP"
+          crossorigin="anonymous"
+        />
+      )
+    }
   </slot>
 
   <div class="post-container" style={`--topic-color: ${topicColor};`}>
     <header class="post-header">
       <h1 class="post-title">{title}</h1>
-      <!-- Date removed from title as requested -->
+      {frontmatter.date && <p class="post-meta">{frontmatter.date}</p>}
     </header>
 
     <article class="post-article">
       <slot />
     </article>
   </div>
+
+  <slot name="scripts" slot="scripts">
+    <script src="/scripts/dateHeadings.js" is:inline></script>
+  </slot>
 </BaseLayout>