ilia/portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

design: two-color palette — rename all tokens to --cream / --blue

Browse Source 
Replace ochre-clay, carbon-black, burnt-oxide, slate-indigo with clean
two-color system: --cream (#f4f0e8) and --blue (#041cf3). Update every
component, utility class, and test assertion.
This commit is contained in:
Ilia Mashkov
2026-05-11 12:59:32 +03:00
parent fed9c97ddb
commit 30f8e4be95
21 changed files with 111 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/shared/ui/Input/ui/Input.tsx
+5 -5
View File
@@ -13,7 +13,7 @@ interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
}
const INPUT_BASE =
'brutal-border bg-white px-4 py-3 text-carbon-black focus:outline-none focus:ring-2 focus:ring-burnt-oxide focus:ring-offset-2 focus:ring-offset-ochre-clay transition-all';
'brutal-border bg-cream px-4 py-3 text-blue focus:outline-none focus:ring-2 focus:ring-blue focus:ring-offset-2 focus:ring-offset-cream transition-all';
/**
* Text input with optional label and error state.
@@ -26,7 +26,7 @@ export function Input({ label, error, className, id, ...props }: InputProps) {
return (
<div className="flex flex-col gap-2">
{label && (
<label htmlFor={inputId} className="text-carbon-black">
<label htmlFor={inputId} className="text-blue">
{label}
</label>
)}
@@ -37,7 +37,7 @@ export function Input({ label, error, className, id, ...props }: InputProps) {
{...props}
/>
{error && (
<span id={errorId} className="text-sm text-burnt-oxide">
<span id={errorId} className="text-sm text-blue">
{error}
</span>
)}
@@ -72,7 +72,7 @@ export function Textarea({ label, error, rows = 4, className, id, ...props }: Te
return (
<div className="flex flex-col gap-2">
{label && (
<label htmlFor={textareaId} className="text-carbon-black">
<label htmlFor={textareaId} className="text-blue">
{label}
</label>
)}
@@ -84,7 +84,7 @@ export function Textarea({ label, error, rows = 4, className, id, ...props }: Te
{...props}
/>
{error && (
<span id={errorId} className="text-sm text-burnt-oxide">
<span id={errorId} className="text-sm text-blue">
{error}
</span>
)}