From 87127f8f7071d3dd9f64d7bf3b56f016ddded300 Mon Sep 17 00:00:00 2001
From: Clembs <clembs@clembs.com>
Date: Thu, 29 Jan 2026 11:46:43 +0100
Subject: [PATCH] feat: sticky navbar

---
 src/components/Navbar.astro | 17 +++++++----------
 src/styles/global.scss      | 17 ++++++++++-------
 2 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/src/components/Navbar.astro b/src/components/Navbar.astro
index d1416af..bb7f0f1 100644
--- a/src/components/Navbar.astro
+++ b/src/components/Navbar.astro
@@ -12,21 +12,17 @@ const targets = [
     name: t("blog"),
     href: translatePaths("/blog"),
   },
+  {
+    name: t("contact"),
+    href: translatePaths("/contact"),
+  },
 ];
-// {
-//   name: t("about"),
-//   href: translatePaths("/about"),
-// },
-// {
-//   name: t("now"),
-//   href: translatePaths("/now"),
-// },
 ---
 
 <script>
   // progressive enhancements via JS: click outside && escape
   const checkbox = document.getElementById(
-    "language-input"
+    "language-input",
   ) as HTMLInputElement;
   const menu = document.getElementById("language-menu");
 
@@ -105,7 +101,8 @@ const targets = [
     align-items: center;
 
     // fix for chromium to have the language menu on top of content
-    position: relative;
+    position: sticky;
+    top: 1.25rem;
     z-index: 99;
 
     background-color: var(--color-white);
diff --git a/src/styles/global.scss b/src/styles/global.scss
index 3abf8c1..2695c59 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -12,6 +12,7 @@
 
 html {
   scroll-behavior: smooth;
+  scroll-padding-top: 4rem;
 }
 
 body {
@@ -59,7 +60,9 @@ p {
 *:focus-visible {
   outline: none;
   transition: none;
-  box-shadow: 0 0 0 2px var(--color-white), 0 0 0 4px var(--color-500);
+  box-shadow:
+    0 0 0 2px var(--color-white),
+    0 0 0 4px var(--color-500);
 }
 
 a {
@@ -75,12 +78,12 @@ a {
   // for all links not pointing to clembs.com, show an icon besides the link
   &:not(
       :is(
-          [href*="clembs.com"],
-          [href^="/"],
-          [href^="./"],
-          [href^="../"],
-          [href^="#"]
-        )
+        [href*="clembs.com"],
+        [href^="/"],
+        [href^="./"],
+        [href^="../"],
+        [href^="#"]
+      )
     )::after,
   &[target="_blank"]::after {
     display: inline-block;
-- 
2.51.2