From f3d72c9841d4862f643eb3719203988c90995cfb Mon Sep 17 00:00:00 2001
From: Usman Baig <mubaig@pm.me>
Date: Tue, 24 Mar 2026 22:28:18 +0100
Subject: [PATCH] fix: move glassmorphism to shell level, sidebar becomes
 transparent

Shell now has the glass treatment so sidebar and surrounding area
are one seamless surface. No more visible line between sidebar
and content panel. Desktop sidebar is transparent over the shell.
Mobile sidebar keeps its own glass since it overlays independently.
---
 components/dashboard/DashboardShell.tsx | 4 ++--
 components/dashboard/Sidebar.tsx        | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/dashboard/DashboardShell.tsx b/components/dashboard/DashboardShell.tsx
index b22200b..58e620f 100644
--- a/components/dashboard/DashboardShell.tsx
+++ b/components/dashboard/DashboardShell.tsx
@@ -11,7 +11,7 @@ const Sidebar = dynamic(() => import('./Sidebar'), {
   // so page content never occupies the sidebar zone
   loading: () => (
     <div
-      className="hidden md:block shrink-0 bg-neutral-950 overflow-hidden relative"
+      className="hidden md:block shrink-0 bg-transparent overflow-hidden relative"
       style={{ width: 64 }}
     >
       <div className="absolute inset-0 bg-gradient-to-r from-transparent via-neutral-800/10 to-transparent animate-shimmer" />
@@ -31,7 +31,7 @@ export default function DashboardShell({
   const openMobile = useCallback(() => setMobileOpen(true), [])
 
   return (
-    <div className="flex h-screen overflow-hidden bg-neutral-950">
+    <div className="flex h-screen overflow-hidden bg-neutral-900/65 backdrop-blur-3xl backdrop-saturate-150 supports-[backdrop-filter]:bg-neutral-900/60">
       <Sidebar
         siteId={siteId}
         mobileOpen={mobileOpen}
diff --git a/components/dashboard/Sidebar.tsx b/components/dashboard/Sidebar.tsx
index 33b8b70..5149d97 100644
--- a/components/dashboard/Sidebar.tsx
+++ b/components/dashboard/Sidebar.tsx
@@ -558,7 +558,7 @@ export default function Sidebar({
     <>
       {/* Desktop — ssr:false means this only renders on client, no hydration flash */}
       <aside
-        className="hidden md:flex flex-col shrink-0 bg-neutral-900/65 backdrop-blur-3xl backdrop-saturate-150 supports-[backdrop-filter]:bg-neutral-900/60 overflow-hidden relative z-10"
+        className="hidden md:flex flex-col shrink-0 bg-transparent overflow-hidden relative z-10"
         style={{ width: collapsed ? COLLAPSED : EXPANDED, transition: 'width 200ms cubic-bezier(0.4, 0, 0.2, 1)' }}
         onTransitionEnd={(e) => {
           if (e.propertyName === 'width' && pickerOpenCallbackRef.current) {