tas/Codewalkers
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Increase dark mode border contrast for graph lines and separators

Browse Source 
Bump --border from L=16 to L=22 in dark mode, giving 11pt contrast
against card surfaces (was 5pt). Also bump --terminal-border to match.

Pipeline graph arrow tips: muted-foreground/40 → /60.
TaskGraph: remove opacity reduction on parallel container borders and
layer connectors so they use full border color.
This commit is contained in:
Lukas May
2026-03-04 13:15:14 +01:00
parent baca008447
commit 087f6945ae
3 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/web/src/components/execution/TaskGraph.tsx
View File

@@ -95,8 +95,8 @@ export function TaskGraph({
)}
{isParallel ? (
<div className="relative rounded-lg border border-dashed border-border/60 px-0.5 pb-0.5 pt-3">
<span className="absolute -top-2 left-2 rounded-sm bg-background px-1.5 py-px text-[8px] font-semibold uppercase tracking-[0.12em] text-muted-foreground/50">
<div className="relative rounded-lg border border-dashed border-border px-0.5 pb-0.5 pt-3">
<span className="absolute -top-2 left-2 rounded-sm bg-background px-1.5 py-px text-[8px] font-semibold uppercase tracking-[0.12em] text-muted-foreground/70">
Parallel &middot; {col.phases.length}
</span>
<div className="space-y-px">
@@ -242,7 +242,7 @@ function TaskLayerConnector({ completed }: { completed: boolean }) {
<div
className={cn(
"h-2.5 w-[2px] rounded-full",
completed ? "bg-status-success-dot/50" : "bg-border/70",
completed ? "bg-status-success-dot/50" : "bg-border",
)}
/>
</div>

2
apps/web/src/components/pipeline/PipelineGraph.tsx
View File

@@ -45,7 +45,7 @@ export function PipelineGraph({ columns, tasksByPhase, taskDepsByPhase, dependen
{idx > 0 && (
<div className="flex items-center self-center px-1 py-4">
<div className="h-px w-8 border-t border-dashed border-border" />
<div className="h-0 w-0 border-y-[3px] border-l-[5px] border-y-transparent border-l-muted-foreground/40" />
<div className="h-0 w-0 border-y-[3px] border-l-[5px] border-y-transparent border-l-muted-foreground/60" />
</div>
)}
<PipelineStageColumn

8
apps/web/src/index.css
View File

@@ -119,7 +119,7 @@
--terminal-bg: 240 6% 7%;
--terminal-fg: 120 100% 80%;
--terminal-muted: 240 5% 55%;
--terminal-border: 240 4% 16%;
--terminal-border: 240 4% 22%;
--terminal-selection: 239 84% 67%;
--terminal-system: 240 5% 55%;
--terminal-tool: 217 91% 60%;
@@ -211,8 +211,8 @@
--destructive: 0 63% 31%;
--destructive-foreground: 0 0% 100%;
--border: 240 4% 16%;
--input: 240 4% 16%;
--border: 240 4% 22%;
--input: 240 4% 22%;
--ring: 239 84% 67%;
/* Surface level 3 for command palette */
@@ -253,7 +253,7 @@
--terminal-bg: 240 5% 11%;
--terminal-fg: 120 100% 80%;
--terminal-muted: 240 5% 55%;
--terminal-border: 240 4% 16%;
--terminal-border: 240 4% 22%;
--terminal-selection: 239 84% 67%;
--terminal-system: 240 5% 55%;
--terminal-tool: 217 91% 60%;