mirror of
https://github.com/NousResearch/hermes-agent.git
synced 2026-07-30 19:09:28 +00:00
Merge pull request #72899 from NousResearch/bb/desktop-recede-chrome-seams
Let the desktop chrome recede, and mark the active tab instead
This commit is contained in:
commit
1d76a15188
6 changed files with 21 additions and 28 deletions
|
|
@ -10,7 +10,7 @@ import {
|
|||
ContextMenuSeparator,
|
||||
ContextMenuTrigger
|
||||
} from '@/components/ui/context-menu'
|
||||
import { PANE_TAB_STRIP_LINE, PaneTab, PaneTabLabel } from '@/components/ui/pane-tab'
|
||||
import { PaneTab, PaneTabLabel } from '@/components/ui/pane-tab'
|
||||
import { Tip } from '@/components/ui/tooltip'
|
||||
import { translateNow, useI18n } from '@/i18n'
|
||||
import { formatCombo } from '@/lib/keybinds/combo'
|
||||
|
|
@ -131,12 +131,7 @@ export function ChatPreviewRail({ onRestartServer, setTitlebarToolGroup }: ChatP
|
|||
// titlebar-height so it opens below the band. 0px elsewhere → unchanged.
|
||||
style={{ paddingTop: 'var(--right-rail-top-inset, 0px)' }}
|
||||
>
|
||||
<div
|
||||
className={cn(
|
||||
'group/rail-tabs flex h-(--titlebar-height) shrink-0 bg-(--ui-sidebar-surface-background)',
|
||||
PANE_TAB_STRIP_LINE
|
||||
)}
|
||||
>
|
||||
<div className="group/rail-tabs flex h-(--titlebar-height) shrink-0 bg-(--ui-sidebar-surface-background)">
|
||||
<div
|
||||
className="flex min-w-0 flex-1 overflow-x-auto overflow-y-hidden overscroll-x-contain [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden"
|
||||
role="tablist"
|
||||
|
|
|
|||
|
|
@ -665,7 +665,7 @@ export function ContribController() {
|
|||
tree-published --workspace-left/right vars (pure CSS, no rect
|
||||
threading), clamped to clear the REAL TitlebarControls
|
||||
clusters (fixed, z-70); center is truly window-centered. */}
|
||||
<div className="relative flex h-[34px] shrink-0 items-center border-b border-(--ui-stroke-tertiary) bg-(--ui-sidebar-surface-background) text-xs">
|
||||
<div className="relative flex h-[34px] shrink-0 items-center bg-(--ui-sidebar-surface-background) text-xs">
|
||||
{/* Drag strips, AppShell-style: cut to AVOID the fixed control
|
||||
clusters instead of overlapping them — Electron's no-drag
|
||||
carve-out of fixed/transformed elements is unreliable, so a
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ export function StatusbarControls({ className, leftItems = [], items = [], ...pr
|
|||
<ContextMenuTrigger asChild>
|
||||
<footer
|
||||
className={cn(
|
||||
'flex h-5 shrink-0 items-stretch justify-between gap-2 border-t border-(--ui-stroke-tertiary) bg-(--ui-sidebar-surface-background) px-1 py-0 text-(--ui-text-tertiary) [-webkit-app-region:no-drag]',
|
||||
'flex h-5 shrink-0 items-stretch justify-between gap-2 bg-(--ui-sidebar-surface-background) px-1 py-0 text-(--ui-text-tertiary) [-webkit-app-region:no-drag]',
|
||||
className
|
||||
)}
|
||||
data-slot="statusbar"
|
||||
|
|
|
|||
|
|
@ -17,7 +17,6 @@ import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger }
|
|||
import { DecodeText } from '@/components/ui/decode-text'
|
||||
import { DROP_SHEET_BLUR_CLASS, DROP_SHEET_CLASS } from '@/components/ui/drop-affordance'
|
||||
import {
|
||||
PANE_TAB_STRIP_LINE,
|
||||
PANE_TAB_STRIP_LINE_LEFT,
|
||||
PANE_TAB_STRIP_LINE_RIGHT,
|
||||
PaneTab,
|
||||
|
|
@ -404,13 +403,10 @@ export function TreeGroup({
|
|||
<ZoneMenu {...zoneMenu}>
|
||||
<div
|
||||
// Active = sidebar surface (merges into body). Strip =
|
||||
// `--theme-card-seed` (VS Code `tab.inactiveBackground`). Line =
|
||||
// PANE_TAB_STRIP_LINE; active tab cuts through it.
|
||||
// `--theme-card-seed` (VS Code `tab.inactiveBackground`). No bottom
|
||||
// rule — the active tab's primary underline is the only seam.
|
||||
// data-zone-tabstrip: a drop over here STACKS (drag-session reads it).
|
||||
className={cn(
|
||||
'group/pane-header relative flex h-7 shrink-0 select-none bg-(--pane-tab-strip-bg) [-webkit-app-region:no-drag] [--pane-tab-active-bg:var(--ui-sidebar-surface-background)] [--pane-tab-strip-bg:var(--theme-card-seed)]',
|
||||
PANE_TAB_STRIP_LINE
|
||||
)}
|
||||
className="group/pane-header relative flex h-7 shrink-0 select-none bg-(--pane-tab-strip-bg) [-webkit-app-region:no-drag] [--pane-tab-active-bg:var(--ui-sidebar-surface-background)] [--pane-tab-strip-bg:var(--theme-card-seed)]"
|
||||
data-zone-tabstrip={node.id}
|
||||
onContextMenu={e => {
|
||||
setMenuPane(
|
||||
|
|
|
|||
|
|
@ -591,10 +591,11 @@ function Sash({
|
|||
>
|
||||
{/* Persistent hairline: same token as PaneShell's divider sash
|
||||
(--ui-stroke-secondary) so every seam — vertical or horizontal —
|
||||
reads identically. */}
|
||||
reads identically. Sits at 0.1 so seams recede into the surface,
|
||||
and comes up to full on hover alongside the thicker grab band. */}
|
||||
<span
|
||||
className={cn(
|
||||
'absolute bg-(--ui-stroke-secondary)',
|
||||
'absolute bg-(--ui-stroke-secondary) opacity-10 transition-opacity duration-100 group-hover:opacity-100',
|
||||
horizontal ? 'inset-y-0 left-1/2 w-px -translate-x-1/2' : 'inset-x-0 top-1/2 h-px -translate-y-1/2'
|
||||
)}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -2,9 +2,6 @@ import * as React from 'react'
|
|||
|
||||
import { cn } from '@/lib/utils'
|
||||
|
||||
/** Inset bottom stroke for a horizontal tab strip — titlebar color, cut by the active tab. */
|
||||
export const PANE_TAB_STRIP_LINE = 'shadow-[inset_0_-1px_0_var(--ui-stroke-tertiary)]'
|
||||
|
||||
/** Inset stroke for a vertical tab rail — content-facing edge. */
|
||||
export const PANE_TAB_STRIP_LINE_LEFT = 'shadow-[inset_1px_0_0_var(--ui-stroke-tertiary)]'
|
||||
export const PANE_TAB_STRIP_LINE_RIGHT = 'shadow-[inset_-1px_0_0_var(--ui-stroke-tertiary)]'
|
||||
|
|
@ -12,18 +9,20 @@ export const PANE_TAB_STRIP_LINE_RIGHT = 'shadow-[inset_-1px_0_0_var(--ui-stroke
|
|||
const TAB =
|
||||
'group/tab relative flex shrink-0 items-center border-transparent bg-(--tab-bg) text-[0.6875rem] font-medium [-webkit-app-region:no-drag]'
|
||||
|
||||
// Stop 1px short: the strip's rule is an INSET shadow painted in the
|
||||
// container's own last pixel row, so a full-height tab covers it and reads as
|
||||
// overhanging the bar. The container owns the line; nothing redraws it.
|
||||
const TAB_HORIZONTAL =
|
||||
'h-[calc(100%-1px)] min-w-0 max-w-48 not-first:border-l not-first:border-l-(--ui-stroke-quaternary)'
|
||||
// Full height: with the strip's rule removed there is no last-pixel row to
|
||||
// leave uncovered, so tabs fill the bar and no sliver of gutter shows through.
|
||||
const TAB_HORIZONTAL = 'h-full min-w-0 max-w-48 not-first:border-l not-first:border-l-(--ui-stroke-quaternary)'
|
||||
|
||||
const TAB_VERTICAL =
|
||||
'w-full max-h-48 justify-center not-first:border-t not-first:border-t-(--ui-stroke-quaternary) [writing-mode:vertical-rl]'
|
||||
|
||||
// Full height, so the active tab alone covers that row and cuts the rule.
|
||||
const TAB_ACTIVE = 'h-full text-foreground [--tab-bg:var(--pane-tab-active-bg,var(--ui-editor-surface-background))]'
|
||||
|
||||
// Horizontal only: the active tab is the sole seam on the strip — a
|
||||
// theme-primary underline drawn as an inset shadow in its own last pixel row,
|
||||
// so it costs no layout and can't shift the tab.
|
||||
const TAB_ACTIVE_UNDERLINE = 'shadow-[inset_0_-2px_0_var(--pane-tab-active-accent,var(--theme-primary))]'
|
||||
|
||||
// Inactive = gutter. Hover DARKENS: active is the lighter content surface, so a
|
||||
// lightening wash made the two nearly indistinguishable.
|
||||
const TAB_IDLE =
|
||||
|
|
@ -81,7 +80,9 @@ export const PaneTab = React.forwardRef<HTMLDivElement, PaneTabProps>(function P
|
|||
TAB,
|
||||
vertical ? TAB_VERTICAL : TAB_HORIZONTAL,
|
||||
edge,
|
||||
active ? TAB_ACTIVE : cn(TAB_IDLE, edge && `${edge}-(--ui-stroke-tertiary)`),
|
||||
active
|
||||
? cn(TAB_ACTIVE, !vertical && TAB_ACTIVE_UNDERLINE)
|
||||
: cn(TAB_IDLE, edge && `${edge}-(--ui-stroke-tertiary)`),
|
||||
className
|
||||
)}
|
||||
data-active={active}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue