From f1c6bfdf87722ace34dc9553a619915ff3c4c975 Mon Sep 17 00:00:00 2001
From: Max Richter <jim-x@web.de>
Date: Mon, 8 Apr 2024 20:51:10 +0200
Subject: [PATCH] feat: optimize some stuff

---
 src/components/Nav.astro | 2 +-
 src/components/TOC.astro | 8 +++-----
 src/layouts/theme.css    | 6 +++++-
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/components/Nav.astro b/src/components/Nav.astro
index 0f820f4..7f63eee 100644
--- a/src/components/Nav.astro
+++ b/src/components/Nav.astro
@@ -4,7 +4,7 @@ import Logo from "./Logo.astro";
 import ToggleTheme from "@components/ThemeToggle.svelte";
 
 function isActive(path: string) {
-  return Astro.url.pathname === path;
+  return Astro.url.pathname.startsWith(path);
 }
 
 const t = useTranslations(Astro.url);
diff --git a/src/components/TOC.astro b/src/components/TOC.astro
index 5fa88fd..703a5b9 100644
--- a/src/components/TOC.astro
+++ b/src/components/TOC.astro
@@ -10,10 +10,9 @@ type Props = {
 const { headings } = Astro.props;
 ---
 
-<div class="toc-wrapper lg:fixed lg:left-6 lg:top-6">
+<div class="toc-wrapper lg:fixed lg:left-6 lg:top-6 z-2">
   <details
-    class="py-2 lg:px-4 rounded-xl lg:border lg:border-neutral flex flex-col lg:bg gap-2"
-  >
+    class="py-2 lg:px-4 rounded-xl lg:border lg:border-neutral flex flex-col lg:bg gap-2">
     <summary class="text-lg cursor-pointer select-none"
       >{t("toc.title")}</summary
     >
@@ -24,8 +23,7 @@ const { headings } = Astro.props;
             <a
               href={`#${heading.slug}`}
               style={{ marginLeft: `${(heading.depth - 1) * 1}rem` }}
-              class={`block text my-0`}
-            >
+              class={`block text my-0`}>
               {heading.text}
             </a>
           );
diff --git a/src/layouts/theme.css b/src/layouts/theme.css
index 993e294..845209b 100644
--- a/src/layouts/theme.css
+++ b/src/layouts/theme.css
@@ -29,6 +29,10 @@ body {
   background-color: var(--neutral-000);
 }
 
+.border-neutral {
+  border-color: var(--outline);
+}
+
 .dark body {
   background-color: var(--neutral-800);
   --background-dark: var(--neutral-800);
@@ -37,7 +41,7 @@ body {
   --background-gradient: linear-gradient(-30deg,
       var(--neutral-500) 0%,
       var(--neutral-400) 100%);
-  --outline: var(--neutral-300);
+  --outline: var(--neutral-400);
   --text: var(--neutral-100);
   --text-light: white;
 }