From 80925e3b28f46f7995b94dc332be017426730995 Mon Sep 17 00:00:00 2001
From: muzzlol <muzxmmilkhxn@gmail.com>
Date: Mon, 10 Nov 2025 19:16:42 +0530
Subject: [PATCH] fix: restore pull-to-refresh while maintaining overscroll
 bounce prevention of page

Previous changes to prevent overscroll bounce behavior accidentally removed pull-to-refresh functionality on mobile browsers. This fixes both issues by making the navbar properly fixed and ensuring the background color is correctly applied to the page.
---
 src/components/Navbar.tsx | 7 ++++---
 src/styles/app.css        | 3 +--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index 8ea894e9..e0189ecc 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -145,7 +145,7 @@ export function Navbar({ children }: { children: React.ReactNode }) {
   const navbar = (
     <div
       className={twMerge(
-        'w-full p-2 sticky top-0 z-[100] bg-white/70 dark:bg-black/70 backdrop-blur-lg shadow-xl shadow-black/3',
+        'w-full p-2 fixed top-0 z-[100] bg-white/70 dark:bg-black/70 backdrop-blur-lg shadow-xl shadow-black/3',
         'flex items-center justify-between gap-4',
         'dark:border-b border-gray-500/20'
       )}
@@ -464,7 +464,7 @@ export function Navbar({ children }: { children: React.ReactNode }) {
   const smallMenu = showMenu ? (
     <div
       className="lg:hidden bg-white/50 dark:bg-black/60 backdrop-blur-[20px] z-50
-    sticky top-[var(--navbar-height)] max-h-[calc(100dvh-var(--navbar-height))] overflow-y-auto
+    fixed top-[var(--navbar-height)] left-0 right-0 max-h-[calc(100dvh-var(--navbar-height))] overflow-y-auto
     "
     >
       <div
@@ -535,7 +535,8 @@ export function Navbar({ children }: { children: React.ReactNode }) {
       <div
         className={twMerge(
           `min-h-[calc(100dvh-var(--navbar-height))] flex flex-col
-          min-w-0 lg:flex-row w-full transition-all duration-300`
+          min-w-0 lg:flex-row w-full transition-all duration-300
+          pt-[var(--navbar-height)]`
         )}
       >
         {smallMenu}
diff --git a/src/styles/app.css b/src/styles/app.css
index b4f579c8..3cd5dd0b 100644
--- a/src/styles/app.css
+++ b/src/styles/app.css
@@ -2,7 +2,7 @@
 
 @plugin "@tailwindcss/typography";
 
-@custom-variant dark (&:is(.dark *));
+@custom-variant dark (&:is(.dark, .dark *));
 @custom-variant light (&:is(.light, .light *));
 @custom-variant auto (&:is(.auto, .auto *));
 @custom-variant aria-current (&[aria-current="location"]);
@@ -68,7 +68,6 @@ button {
   html,
   body {
     @apply text-gray-900 bg-gray-50 dark:bg-gray-900 dark:text-gray-200;
-    overscroll-behavior: none;
   }
 
   .using-mouse * {