highperfocused/multica
1
0
Fork 0
mirror of https://github.com/multica-ai/multica.git synced 2026-07-26 12:35:35 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(views): keep in-card side panels on the content surface color (#5329)

Browse Source 
The settings nav and agent overview aside tinted themselves with
bg-app-shell/70, pulling the window-chrome tone inside the content
card. Since the desktop's active tab merges into the card top
(MUL-4439), a tinted panel under the first tabs visibly broke the
tab/content seam. Zone separation stays with the hairline divider,
row hover/selected states, and the narrow column — matching the
inbox panel's existing pattern.

Co-authored-by: Lambda <lambda@multica.ai>
Co-authored-by: multica-agent <github@multica.ai>
This commit is contained in:
Jiayuan Zhang
2026-07-13 15:58:40 +08:00
committed by GitHub
parent 1de4b2d688
commit 3e03d8f97b
2 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/views/agents/components/agent-overview-pane.tsx
View File

@@ -357,7 +357,9 @@ export function AgentOverviewPane({
{secondaryTabs.length > 0 && activeSecondaryTab && (
<div className="flex min-h-full flex-col md:h-full md:flex-row">
<aside className="shrink-0 overflow-x-auto border-b border-surface-border bg-app-shell/70 p-2 md:w-52 md:overflow-y-auto md:border-b-0 md:border-r md:p-4">
{/* Content-surface color, no shell tint — same rule as the settings
nav: in-card panels must not break the desktop tab merge (MUL-4439). */}
<aside className="shrink-0 overflow-x-auto border-b border-surface-border p-2 md:w-52 md:overflow-y-auto md:border-b-0 md:border-r md:p-4">
<div
className="flex w-max min-w-full items-center gap-1 md:w-full md:flex-col md:items-stretch"
role="tablist"

7
packages/views/settings/components/settings-page.tsx
View File

@@ -140,8 +140,11 @@ export function SettingsPage({ extraAccountTabs }: SettingsPageProps = {}) {
orientation={isMobile ? "horizontal" : "vertical"}
className="flex flex-1 min-h-0 flex-col gap-0 overflow-y-auto md:flex-row md:overflow-hidden"
>
{/* Structural navigation; bounded setting groups remain in the content surface. */}
<div className="shrink-0 overflow-x-auto border-b border-surface-border bg-app-shell/70 p-2 md:w-56 md:overflow-y-auto md:border-b-0 md:border-r md:p-4">
{/* Structural navigation; bounded setting groups remain in the content surface.
Stays on the content surface color (no shell tint): the desktop's active
tab merges into the card top, and a tinted panel under the first tabs
breaks that seam (MUL-4439). Zoning comes from the divider instead. */}
<div className="shrink-0 overflow-x-auto border-b border-surface-border p-2 md:w-56 md:overflow-y-auto md:border-b-0 md:border-r md:p-4">
<h1 className="sr-only text-sm font-semibold md:not-sr-only md:mb-4 md:px-2">{t(($) => $.page.title)}</h1>
<TabsList
variant="line"