fix(desktop): apply Buzz sidebar overrides to the portaled mobile sheet

The token/active-pill/hover/search overrides in theme.css are scoped to
[data-testid="app-sidebar"], but on narrow viewports (<768px) the mobile
Sidebar branch spread that marker onto the Radix Sheet root, which renders
no DOM ancestor of the portaled SheetContent. So the offcanvas sidebar got
the Buzz gradient (fixed separately) but its selected rows and search box
still fell back to the normal accent/grey surfaces over the gradient.

Move the app-sidebar marker (and the rest of the forwarded props) onto
SheetContent so every existing [data-testid="app-sidebar"] rule reaches the
portaled sheet without duplicating selectors. Bump the sidebar.tsx file-size
override by 1 (vendored file already on the split-queue). Verified at a 480px
viewport: the sheet carries data-testid=app-sidebar, --sidebar-active resolves
to white, and the Buzz Dark gradient still applies.

Signed-off-by: npub13fn4ahfnvaa2qwylvegdgeajqs0mph6v4qsw4jcqnw4mjh3hzh2quuucm5 <8a675edd33677aa0389f6650d467b2041fb0df4ca820eacb009babb95e3715d4@sprout-oss.stage.blox.sqprod.co>
This commit is contained in:
npub13fn4ahfnvaa2qwylvegdgeajqs0mph6v4qsw4jcqnw4mjh3hzh2quuucm5
2026-07-08 15:22:22 +01:00
parent de1604ddb9
commit 341aae05f8
3 changed files with 13 additions and 2 deletions
+5 -1
View File
@@ -217,7 +217,11 @@ const overrides = new Map([
// +33 for config-nudge detect-and-render + author-auth gate (normalizePubkey guard).
["src/shared/ui/markdown.tsx", 2152],
["src/shared/ui/VideoPlayer.tsx", 2199],
["src/shared/ui/sidebar.tsx", 1042],
// +1: mobile Sidebar branch forwards the app-sidebar marker (and the rest of
// the container props) onto SheetContent instead of the DOM-less Sheet root,
// so the Buzz sidebar CSS overrides reach the portaled offcanvas sheet.
// Load-bearing correctness fix, not generic debt. Queued to split.
["src/shared/ui/sidebar.tsx", 1043],
// permission-outcome (fix #1381 regression): pendingPermissions state map,
// describePermissionOutcome helper, jsonRpcId key helper (handles both
// string and finite-number JSON-RPC ids per spec), and the acp_write
@@ -297,6 +297,12 @@
* the selected persona row in PersonaCatalogDialog). A root-level override
* turned those white (white-on-white under Buzz Dark); scoping keeps them on
* the normal accent-driven active colors.
*
* Covers the mobile/offcanvas sidebar too: `Sidebar` (shared/ui/sidebar.tsx)
* renders the `data-testid="app-sidebar"` marker on `SheetContent` in its
* mobile branch, so this container scope — and every other
* `[data-testid="app-sidebar"]` rule below (hover, search box) — reaches the
* portaled sheet, not just the desktop `<div>` sidebar.
*/
:root[data-buzz-sidebar] [data-testid="app-sidebar"] {
--sidebar-active: 0 0% 100% !important;
+2 -1
View File
@@ -319,11 +319,12 @@ const Sidebar = React.forwardRef<
if (isMobile) {
return (
<Sheet open={openMobile} onOpenChange={setOpenMobile} {...props}>
<Sheet open={openMobile} onOpenChange={setOpenMobile}>
<SheetContent
data-sidebar="sidebar"
data-mobile="true"
className="w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden"
{...props}
style={
{
"--sidebar-width": SIDEBAR_WIDTH_MOBILE,