From 5155afc969518528161bbcee0c553097c9a3f5c8 Mon Sep 17 00:00:00 2001
From: Arnav <100010741+arnavravinder@users.noreply.github.com>
Date: Wed, 11 Sep 2024 15:19:23 +0530
Subject: [PATCH] add a scrollbar

add a scrollbar
---
 src/routes/+layout.svelte | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index b59bd75..3fc3966 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -82,7 +82,33 @@
       url('/fonts/InstrumentSans-asciionly-subset-instanced.woff2') format('woff2');
     font-display: swap;
   }
+  html {
+    scrollbar-width: thin;
+    scrollbar-color: rgba(255, 255, 255, 0.5) rgba(0, 0, 0, 0.5);
+  }
+
+  html::-webkit-scrollbar {
+    width: 0.5rem;
+  }
 
+  html::-webkit-scrollbar-track {
+    background: rgba(0, 0, 0, 0.5);
+  }
+
+  html::-webkit-scrollbar-thumb {
+    background-color: rgba(255, 255, 255, 0.5);
+    border-radius: 0.25rem;
+  }
+
+  html::-webkit-scrollbar-thumb:hover {
+    background-color: rgba(255, 255, 255, 0.7);
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    html::-webkit-scrollbar-thumb {
+      transition: none;
+    }
+  }
   :global(:root) {
     font-family: 'Zenith Sans ASCII', 'Zenith Sans', system-ui, sans-serif;
     line-height: 1.5;