From ca2f1ce19d50cd49748870719cab90972dacf9c5 Mon Sep 17 00:00:00 2001
From: Usman Baig <mubaig@pm.me>
Date: Mon, 23 Mar 2026 19:59:56 +0100
Subject: [PATCH] fix(dashboard): content panel as rounded card, sidebar border
 removed
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Content panel: bg-neutral-950, rounded-2xl, border, margin on top/right/bottom
- Sidebar: removed border-r — content panel's left border acts as separator
- Outer shell: bg-neutral-900 matches sidebar, creating "floating panel" effect
---
 components/dashboard/DashboardShell.tsx | 8 ++++----
 components/dashboard/Sidebar.tsx        | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/components/dashboard/DashboardShell.tsx b/components/dashboard/DashboardShell.tsx
index d5772bb..190b1d6 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 border-r border-neutral-800/60 bg-neutral-900/90 backdrop-blur-xl overflow-hidden relative"
+      className="hidden md:block shrink-0 bg-neutral-900 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,15 +31,15 @@ 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">
       <Sidebar
         siteId={siteId}
         mobileOpen={mobileOpen}
         onMobileClose={closeMobile}
         onMobileOpen={openMobile}
       />
-      {/* Content panel — rounded on all corners with slight inset to separate from sidebar */}
-      <div className="flex-1 flex flex-col min-w-0 overflow-hidden my-2 mr-2 rounded-2xl bg-neutral-900 border border-neutral-800/60">
+      {/* Content panel — rounded corners, inset from edges. The left border doubles as the sidebar's right edge. */}
+      <div className="flex-1 flex flex-col min-w-0 overflow-hidden mt-2 mr-2 mb-2 rounded-2xl bg-neutral-950 border border-neutral-800/60">
         <ContentHeader onMobileMenuOpen={openMobile} />
         <main className="flex-1 overflow-y-auto pt-4">
           {children}
diff --git a/components/dashboard/Sidebar.tsx b/components/dashboard/Sidebar.tsx
index 4fcbe2e..4f3b488 100644
--- a/components/dashboard/Sidebar.tsx
+++ b/components/dashboard/Sidebar.tsx
@@ -514,7 +514,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 border-r border-neutral-800/60 bg-neutral-900/90 backdrop-blur-xl overflow-hidden relative z-10"
+        className="hidden md:flex flex-col shrink-0 bg-neutral-900 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) {