???

islands/Chat.tsx

@@ -20,7 +20,10 @@ export default function Chat() {
       setUsername(`User${randomNum}`);
     }
 
-    const ws = new WebSocket(`ws://${globalThis.location.host}/api/chat`);
+    const wsProtocol = window.location.protocol === "https:" ? "wss:" : "ws:";
+    const ws = new WebSocket(
+      `${wsProtocol}//${globalThis.location.host}/api/chat`,
+    );
 
     ws.onopen = () => {
       console.log("Connected to chat");

islands/NavigationBar.tsx

@@ -53,48 +53,50 @@ export default function NavigationBar({ currentPath }: NavigationBarProps) {
         isScrolling.value ? "opacity-30" : "opacity-100"
       } ${isVisible.value ? "translate-y-0" : "translate-y-20"}`}
     >
-      <ul class="menu menu-horizontal bg-base-200 rounded-box p-2 shadow-lg flex flex-nowrap whitespace-nowrap overflow-x-auto">
-        <li class="mx-1">
-          <a href="/" class={currentPath === "/" ? "menu-active" : ""}>
-            <div class="tooltip" data-tip="Home">
-              <LuHouse class="text-xl" />
-            </div>
-          </a>
-        </li>
+      <div class="overflow-visible">
+        <ul class="menu menu-horizontal bg-base-200 rounded-box p-2 shadow-lg flex flex-nowrap whitespace-nowrap">
+          <li class="mx-1">
+            <a href="/" class={currentPath === "/" ? "menu-active" : ""}>
+              <div class="tooltip" data-tip="Home">
+                <LuHouse class="text-xl" />
+              </div>
+            </a>
+          </li>
 
-        <li class="mx-1">
-          <a
-            href="/posts"
-            class={isPostsPath(currentPath) ? "menu-active" : ""}
-          >
-            <div class="tooltip" data-tip="Posts">
-              <LuNotebookPen class="text-xl" />
-            </div>
-          </a>
-        </li>
+          <li class="mx-1">
+            <a
+              href="/posts"
+              class={isPostsPath(currentPath) ? "menu-active" : ""}
+            >
+              <div class="tooltip" data-tip="Posts">
+                <LuNotebookPen class="text-xl" />
+              </div>
+            </a>
+          </li>
 
-        <li class="mx-1">
-          <a
-            href="/projects"
-            class={currentPath.startsWith("/projects") ? "menu-active" : ""}
-          >
-            <div class="tooltip" data-tip="Projects">
-              <LuCodeXml class="text-xl" />
-            </div>
-          </a>
-        </li>
+          <li class="mx-1">
+            <a
+              href="/projects"
+              class={currentPath.startsWith("/projects") ? "menu-active" : ""}
+            >
+              <div class="tooltip" data-tip="Projects">
+                <LuCodeXml class="text-xl" />
+              </div>
+            </a>
+          </li>
 
-        <li class="mx-1">
-          <a
-            href="/chat"
-            class={currentPath.startsWith("/chat") ? "menu-active" : ""}
-          >
-            <div class="tooltip" data-tip="Chat">
-              <LuMessageCircle class="text-xl" />
-            </div>
-          </a>
-        </li>
-      </ul>
+          <li class="mx-1">
+            <a
+              href="/chat"
+              class={currentPath.startsWith("/chat") ? "menu-active" : ""}
+            >
+              <div class="tooltip" data-tip="Chat">
+                <LuMessageCircle class="text-xl" />
+              </div>
+            </a>
+          </li>
+        </ul>
+      </div>
     </div>
   );
 }

lib/posts.ts

@@ -3,14 +3,12 @@ import { join } from "@std/path";
 
 const POSTS_DIR = "./posts";
 
-// This is what gets parsed from the post front matter
 interface FrontMatter {
   title: string;
   published_at: string;
   blurb: string;
 }
 
-// This is what gets used for rendering
 export interface Post {
   slug: string;
   title: string;