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

22
frontend/src/pages/account/ChatRetentionSettingsPage.tsx
View File

@@ -45,7 +45,7 @@ export default function ChatRetentionSettingsPage() {
if (loading) {
return (
<div className="flex items-center justify-center py-20">
<Loader2 className="animate-spin text-[#22d3ee]" size={24} />
<Loader2 className="animate-spin text-primary" size={24} />
</div>
)
}
@@ -53,18 +53,18 @@ export default function ChatRetentionSettingsPage() {
return (
<div className="max-w-2xl mx-auto py-8 px-6">
<div className="flex items-center gap-3 mb-6">
<Clock size={20} className="text-[#22d3ee]" />
<h1 className="text-xl font-heading font-bold text-[#e2e5eb]">Chat Retention</h1>
<Clock size={20} className="text-primary" />
<h1 className="text-xl font-heading font-bold text-foreground">Chat Retention</h1>
</div>
<div className="card-flat rounded-2xl p-6 space-y-6">
<p className="text-sm text-[#848b9b]">
<p className="text-sm text-muted-foreground">
Configure how long AI assistant conversations are retained. Pinned chats are never automatically deleted.
</p>
<div className="space-y-4">
<div>
<label className="font-sans text-xs text-[0.625rem] uppercase tracking-widest text-[#848b9b] block mb-1.5">
<label className="font-sans text-xs text-[0.625rem] uppercase tracking-widest text-muted-foreground block mb-1.5">
Retention Period (days)
</label>
<input
@@ -73,16 +73,16 @@ export default function ChatRetentionSettingsPage() {
onChange={e => setRetentionDays(e.target.value)}
min={1}
max={365}
className="w-full rounded-xl border bg-[#14161d] text-[#e2e5eb] text-sm px-4 py-2.5 focus:outline-hidden focus:border-primary/30"
className="w-full rounded-xl border bg-card text-foreground text-sm px-4 py-2.5 focus:outline-hidden focus:border-primary/30"
style={{ borderColor: 'var(--glass-border)' }}
/>
<p className="text-xs text-[#848b9b] mt-1">
<p className="text-xs text-muted-foreground mt-1">
Chats older than this will be automatically deleted (1-365 days)
</p>
</div>
<div>
<label className="font-sans text-xs text-[0.625rem] uppercase tracking-widest text-[#848b9b] block mb-1.5">
<label className="font-sans text-xs text-[0.625rem] uppercase tracking-widest text-muted-foreground block mb-1.5">
Max Conversations
</label>
<input
@@ -91,10 +91,10 @@ export default function ChatRetentionSettingsPage() {
onChange={e => setMaxCount(e.target.value)}
min={10}
max={10000}
className="w-full rounded-xl border bg-[#14161d] text-[#e2e5eb] text-sm px-4 py-2.5 focus:outline-hidden focus:border-primary/30"
className="w-full rounded-xl border bg-card text-foreground text-sm px-4 py-2.5 focus:outline-hidden focus:border-primary/30"
style={{ borderColor: 'var(--glass-border)' }}
/>
<p className="text-xs text-[#848b9b] mt-1">
<p className="text-xs text-muted-foreground mt-1">
When this limit is exceeded, oldest unpinned chats are deleted
</p>
</div>
@@ -104,7 +104,7 @@ export default function ChatRetentionSettingsPage() {
<button
onClick={handleSave}
disabled={saving}
className="bg-[#22d3ee] text-white font-semibold text-sm rounded-lg px-5 py-2.5 hover:brightness-110 active:scale-[0.98] transition-all disabled:opacity-40 flex items-center gap-2"
className="bg-primary text-white font-semibold text-sm rounded-lg px-5 py-2.5 hover:brightness-110 active:scale-[0.98] transition-all disabled:opacity-40 flex items-center gap-2"
>
{saving ? <Loader2 size={14} className="animate-spin" /> : <Save size={14} />}
Save Settings