fix: improve repo badge and branch label visibility in dark mode (#157)

Use bg-accent with dark mode variants instead of bg-background/50 so badges remain readable on dark backgrounds.
This commit is contained in:
Jinjing 2026-03-28 00:11:39 -07:00 committed by GitHub
parent 51b3b76633
commit 665ffd89e3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 2 additions and 2 deletions

View File

@ -300,7 +300,7 @@ const WorktreeCard = React.memo(function WorktreeCard({
{/* Subtitle row: Repo badge + Branch */}
<div className="flex items-center gap-1.5 min-w-0">
{repo && !hideRepoBadge && (
<div className="flex items-center gap-1.5 shrink-0 px-1.5 py-0.5 rounded-[4px] bg-background/50 border border-border/40">
<div className="flex items-center gap-1.5 shrink-0 px-1.5 py-0.5 rounded-[4px] bg-accent border border-border dark:bg-accent/50 dark:border-border/60">
<div
className="size-1.5 rounded-full"
style={{ backgroundColor: repo.badgeColor }}
@ -314,7 +314,7 @@ const WorktreeCard = React.memo(function WorktreeCard({
{isPrimaryBranch(worktree.branch) ? (
<Badge
variant="secondary"
className="h-[16px] px-1.5 text-[10px] font-medium rounded shrink-0 text-muted-foreground bg-accent/60 border-none leading-none"
className="h-[16px] px-1.5 text-[10px] font-medium rounded shrink-0 text-muted-foreground bg-accent border border-border dark:bg-accent/80 dark:border-border/50 leading-none"
>
main
</Badge>