chihlasm/resolutionflow
1
0
Fork 0
Code Issues 23 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

refactor: replace hardcoded hex values with Tailwind semantic tokens

Browse Source 
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:
Michael Chihlas
2026-03-22 04:34:35 -04:00
parent 123fc50af9
commit 303a558432
251 changed files with 3310 additions and 3310 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/components/script-builder/ScriptBuilderChat.tsx
View File

@@ -30,13 +30,13 @@ export function ScriptBuilderChat({
return (
<div className="flex-1 flex items-center justify-center p-8">
<div className="text-center max-w-md">
<div className="w-14 h-14 rounded-2xl bg-[#22d3ee] flex items-center justify-center mx-auto mb-4">
<div className="w-14 h-14 rounded-2xl bg-primary flex items-center justify-center mx-auto mb-4">
<Bot size={28} className="text-white" />
</div>
<h2 className="text-lg font-heading font-bold text-[#e2e5eb] mb-2">
<h2 className="text-lg font-heading font-bold text-foreground mb-2">
Script Builder
</h2>
<p className="text-sm text-[#848b9b] leading-relaxed">
<p className="text-sm text-muted-foreground leading-relaxed">
Describe the script you need and AI will generate it for you. You can iterate on the script,
preview it, and save it to your library.
</p>
@@ -65,7 +65,7 @@ export function ScriptBuilderChat({
className={cn(
"max-w-[85%] rounded-xl px-4 py-3 text-sm",
msg.role === 'user'
? "bg-[rgba(6,182,212,0.08)] border border-[rgba(6,182,212,0.15)] text-[#e2e5eb]"
? "bg-[rgba(6,182,212,0.08)] border border-[rgba(6,182,212,0.15)] text-foreground"
: "card-flat"
)}
>
@@ -90,7 +90,7 @@ export function ScriptBuilderChat({
{msg.role === 'user' && (
<div className="shrink-0 w-8 h-8 rounded-lg bg-[rgba(255,255,255,0.06)] flex items-center justify-center mt-0.5">
<User size={16} className="text-[#848b9b]" />
<User size={16} className="text-muted-foreground" />
</div>
)}
</div>
@@ -103,7 +103,7 @@ export function ScriptBuilderChat({
</div>
<div className="card-flat rounded-xl px-4 py-3 text-sm flex items-center gap-2">
<Loader2 size={14} className="animate-spin text-cyan-400" />
<span className="text-[#848b9b]">Generating script...</span>
<span className="text-muted-foreground">Generating script...</span>
</div>
</div>
)}