refactor: replace hardcoded hex values with Tailwind semantic tokens
3,200+ hardcoded color values replaced with CSS variable-backed Tailwind classes (bg-card, text-foreground, border-border, etc.). Enables light mode via CSS variable swap. Only syntax highlighting colors and intentional one-offs remain hardcoded (~15 values). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -49,7 +49,7 @@ export function ActivityItem({
|
||||
className={cn(
|
||||
'flex w-full items-center gap-2 rounded-lg px-2.5 py-1.5 text-left transition-colors',
|
||||
'hover:bg-[rgba(255,255,255,0.03)]',
|
||||
isRecent ? 'text-[#6b7280] text-[0.72rem]' : 'text-[#e2e8f0] text-[0.8rem]'
|
||||
isRecent ? 'text-text-rail-label text-[0.72rem]' : 'text-[#e2e8f0] text-[0.8rem]'
|
||||
)}
|
||||
title={`${treeName}${ticketNumber ? ` (${ticketNumber})` : ''} — click to resume`}
|
||||
aria-label={
|
||||
@@ -83,7 +83,7 @@ export function ActivityItem({
|
||||
/>
|
||||
)}
|
||||
{status === 'recent' && (
|
||||
<span className="h-1 w-1 shrink-0 rounded-full bg-[#3d4350]" />
|
||||
<span className="h-1 w-1 shrink-0 rounded-full bg-muted-foreground" />
|
||||
)}
|
||||
|
||||
{/* Flow name */}
|
||||
@@ -96,7 +96,7 @@ export function ActivityItem({
|
||||
</span>
|
||||
)}
|
||||
{isRecent && timestamp && (
|
||||
<span className="shrink-0 font-label text-[0.5625rem] text-[#5a6170]">
|
||||
<span className="shrink-0 font-label text-[0.5625rem] text-text-muted">
|
||||
{formatRelativeTime(timestamp)}
|
||||
</span>
|
||||
)}
|
||||
|
||||
@@ -22,7 +22,7 @@ export function SidebarActivityFeed({
|
||||
{/* Header */}
|
||||
<div className="flex items-center gap-1.5 px-2.5 py-1 mb-0.5">
|
||||
<Clock size={10} style={{ color: '#34d399' }} />
|
||||
<span className="font-label text-[0.5625rem] uppercase tracking-[0.12em] text-[#5a6170]">
|
||||
<span className="font-label text-[0.5625rem] uppercase tracking-[0.12em] text-text-muted">
|
||||
Activity
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -61,7 +61,7 @@ export function SidebarStatsBar({ resolved, active, completedMinutes, activeSess
|
||||
>
|
||||
{resolved}
|
||||
</div>
|
||||
<div className="mt-1 font-label text-[7px] uppercase tracking-[0.1em] text-[#3d4350]">
|
||||
<div className="mt-1 font-label text-[7px] uppercase tracking-[0.1em] text-text-muted">
|
||||
Resolved
|
||||
</div>
|
||||
</div>
|
||||
@@ -73,7 +73,7 @@ export function SidebarStatsBar({ resolved, active, completedMinutes, activeSess
|
||||
>
|
||||
{active}
|
||||
</div>
|
||||
<div className="mt-1 font-label text-[7px] uppercase tracking-[0.1em] text-[#3d4350]">
|
||||
<div className="mt-1 font-label text-[7px] uppercase tracking-[0.1em] text-text-muted">
|
||||
Active
|
||||
</div>
|
||||
</div>
|
||||
@@ -84,7 +84,7 @@ export function SidebarStatsBar({ resolved, active, completedMinutes, activeSess
|
||||
>
|
||||
{formatDuration(totalSeconds)}
|
||||
</div>
|
||||
<div className="mt-1 font-label text-[7px] uppercase tracking-[0.1em] text-[#3d4350]">
|
||||
<div className="mt-1 font-label text-[7px] uppercase tracking-[0.1em] text-text-muted">
|
||||
Total Time
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user