Ethica/Termix
1
0 Fork 0
mirror of https://github.com/Termix-SSH/Termix.git synced 2026-10-31 07:35:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: header separators render as borders and center the status divider

Browse Source
This commit is contained in:
LukeGus committed 2026-10-08 00:49:11 -05:00
1 parent cfab6f764c
commit f09865ed04
2 files changed
+15 -17
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/ui/components/panel-layout.tsx
+6 -4
View File
@@ -105,10 +105,9 @@ export function PanelShell({
className={`flex ${PANEL.header} shrink-0 flex-row items-center border-b border-border`} className={`flex ${PANEL.header} shrink-0 flex-row items-center border-b border-border`}
> >
{leading && ( {leading && (
<> <div className="flex h-full shrink-0 border-r border-border">
{leading} {leading}
<Separator orientation="vertical" /> </div>
</>
)} )}
<div className="flex min-w-0 flex-1 items-center gap-2 px-3"> <div className="flex min-w-0 flex-1 items-center gap-2 px-3">
{icon && <span className="shrink-0 text-accent-brand">{icon}</span>} {icon && <span className="shrink-0 text-accent-brand">{icon}</span>}
@@ -117,7 +116,10 @@ export function PanelShell({
</span> </span>
{status && ( {status && (
<> <>
<Separator orientation="vertical" className="h-4 self-center" /> <Separator
orientation="vertical"
className="h-4 data-[orientation=vertical]:self-center"
/>
<span className="truncate text-[10px] font-semibold uppercase tracking-widest text-muted-foreground"> <span className="truncate text-[10px] font-semibold uppercase tracking-widest text-muted-foreground">
{status} {status}
</span> </span>
src/ui/shell/DockPanel.tsx
+9 -13
View File
@@ -8,7 +8,6 @@ import {
RotateCcw, RotateCcw,
SquareArrowOutUpRight, SquareArrowOutUpRight,
} from "lucide-react"; } from "lucide-react";
import { Separator } from "@/components/separator";
import { PANEL } from "@/components/panel-layout"; import { PANEL } from "@/components/panel-layout";
import type { EditingWidth } from "@/components/surface/surface-scope"; import type { EditingWidth } from "@/components/surface/surface-scope";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
@@ -37,18 +36,15 @@ function HeaderButton({
children: React.ReactNode; children: React.ReactNode;
}) { }) {
return ( return (
<> <button
<Separator orientation="vertical" /> type="button"
<button title={title}
type="button" aria-label={title}
title={title} onClick={onClick}
aria-label={title} className="flex h-full w-12.5 shrink-0 items-center justify-center border-l border-border text-muted-foreground transition-colors hover:bg-muted/40 hover:text-foreground focus-visible:ring-1 focus-visible:ring-ring"
onClick={onClick} >
className="flex h-full w-12.5 shrink-0 items-center justify-center text-muted-foreground transition-colors hover:bg-muted/40 hover:text-foreground focus-visible:ring-1 focus-visible:ring-ring" {children}
> </button>
{children}
</button>
</>
); );
} }