From 584ef13c7bc769addba6972067f5bbfb310d13bc Mon Sep 17 00:00:00 2001
From: Thomas Petersen <thomasp@squareup.com>
Date: Wed, 17 Jun 2026 08:38:08 -0400
Subject: [PATCH] fix(desktop): remove header divider lines

Keep the shared header blur treatment while removing the horizontal rules drawn by the global chrome, channel header, and top chrome backdrop.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 desktop/src/app/AppTopChrome.tsx            | 17 -----------------
 desktop/src/features/chat/ui/ChatHeader.tsx |  2 +-
 desktop/src/shared/layout/chromeLayout.ts   |  7 +++----
 desktop/src/shared/ui/TopChromeBackdrop.tsx |  3 +--
 4 files changed, 5 insertions(+), 24 deletions(-)

diff --git a/desktop/src/app/AppTopChrome.tsx b/desktop/src/app/AppTopChrome.tsx
index 17c68ab60..28370b4a4 100644
--- a/desktop/src/app/AppTopChrome.tsx
+++ b/desktop/src/app/AppTopChrome.tsx
@@ -26,22 +26,6 @@ type AppTopChromeProps = {
   searchLoading?: boolean;
 };
 
-function GlobalTopDivider() {
-  const sidebar = useOptionalSidebar();
-  const state = sidebar?.state ?? "collapsed";
-
-  return (
-    <div
-      aria-hidden="true"
-      className="pointer-events-none fixed top-10 z-40 h-px bg-border/35"
-      style={{
-        left: state === "expanded" ? "var(--sidebar-width)" : 0,
-        right: 0,
-      }}
-    />
-  );
-}
-
 function CenterColumnTopbarSearch({
   channels,
   currentPubkey,
@@ -141,7 +125,6 @@ export function AppTopChrome({
         className="fixed inset-x-0 top-0 z-20 h-10 cursor-default select-none"
         data-tauri-drag-region
       />
-      <GlobalTopDivider />
       <div className="fixed left-[80px] top-[6px] z-45 flex items-center gap-0.5">
         <TopChromeSidebarTrigger />
         <Button
diff --git a/desktop/src/features/chat/ui/ChatHeader.tsx b/desktop/src/features/chat/ui/ChatHeader.tsx
index 5f61717b0..a19256ffc 100644
--- a/desktop/src/features/chat/ui/ChatHeader.tsx
+++ b/desktop/src/features/chat/ui/ChatHeader.tsx
@@ -150,7 +150,7 @@ export function ChatHeader({
     <div
       ref={chromeWrapperRef}
       className={cn(
-        "pointer-events-none relative z-30 bg-background/80 backdrop-blur-md after:absolute after:inset-x-0 after:bottom-0 after:h-px after:bg-border/35 after:content-[''] supports-backdrop-filter:bg-background/70 dark:bg-background/70 dark:backdrop-blur-xl dark:supports-backdrop-filter:bg-background/55",
+        "pointer-events-none relative z-30 bg-background/80 backdrop-blur-md supports-backdrop-filter:bg-background/70 dark:bg-background/70 dark:backdrop-blur-xl dark:supports-backdrop-filter:bg-background/55",
         topChromeInset.padding,
         channelChrome.negativeMargin,
       )}
diff --git a/desktop/src/shared/layout/chromeLayout.ts b/desktop/src/shared/layout/chromeLayout.ts
index f7a961ac5..31ab2883e 100644
--- a/desktop/src/shared/layout/chromeLayout.ts
+++ b/desktop/src/shared/layout/chromeLayout.ts
@@ -38,10 +38,11 @@ export const insetHeaderOverlay = {
    * Single full-width backdrop strip drawn behind transparent inset headers.
    * Rendered once per view so the blur samples continuously across column
    * boundaries instead of clipping at each pane's backdrop-filter box.
-   * Carries the search-strip hairline (`before:`) and the bottom border.
+   * Keeps the inset header visually continuous without drawing horizontal
+   * dividers across the header area.
    */
   backdrop:
-    "pointer-events-none absolute inset-x-0 top-0 z-30 h-(--buzz-inset-header-height,5rem) border-b border-border/35 bg-background/80 backdrop-blur-md supports-backdrop-filter:bg-background/70 dark:bg-background/70 dark:backdrop-blur-xl dark:supports-backdrop-filter:bg-background/55 before:pointer-events-none before:absolute before:inset-x-0 before:top-(--buzz-top-chrome-height,2.5rem) before:h-px before:bg-border/35 before:content-['']",
+    "pointer-events-none absolute inset-x-0 top-0 z-30 h-(--buzz-inset-header-height,5rem) bg-background/80 backdrop-blur-md supports-backdrop-filter:bg-background/70 dark:bg-background/70 dark:backdrop-blur-xl dark:supports-backdrop-filter:bg-background/55",
 } as const;
 
 /** Tailwind class fragments for layout under the global top chrome. */
@@ -67,8 +68,6 @@ export const topChromeInset = {
 export const topChromeBackdrop = {
   /** Height matching the global top chrome search/drag strip. */
   height: "h-(--buzz-top-chrome-height,2.5rem)",
-  /** `after:` pseudo-element offset aligned to the bottom of top chrome. */
-  dividerTop: "after:top-(--buzz-top-chrome-height,2.5rem)",
 } as const;
 
 /** Tailwind class fragments for measured channel header chrome. */
diff --git a/desktop/src/shared/ui/TopChromeBackdrop.tsx b/desktop/src/shared/ui/TopChromeBackdrop.tsx
index c437f6073..9ed4949f7 100644
--- a/desktop/src/shared/ui/TopChromeBackdrop.tsx
+++ b/desktop/src/shared/ui/TopChromeBackdrop.tsx
@@ -18,9 +18,8 @@ export function TopChromeBackdrop({ className }: { className?: string }) {
     <div
       aria-hidden="true"
       className={cn(
-        "pointer-events-none absolute inset-x-0 top-0 z-40 bg-background/75 backdrop-blur-md supports-[backdrop-filter]:bg-background/65 after:absolute after:inset-x-0 after:h-px after:bg-border/35 after:content-[''] dark:bg-background/45 dark:backdrop-blur-xl dark:supports-[backdrop-filter]:bg-background/35",
+        "pointer-events-none absolute inset-x-0 top-0 z-40 bg-background/75 backdrop-blur-md supports-[backdrop-filter]:bg-background/65 dark:bg-background/45 dark:backdrop-blur-xl dark:supports-[backdrop-filter]:bg-background/35",
         topChromeBackdrop.height,
-        topChromeBackdrop.dividerTop,
         className,
       )}
     />