sdarbinyan/marketplaces
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: WCAG AA contrast remediation on border/status colors (Z8, user-authorized)

Browse Source 
Darkened --border-color and --success/--warning/--error/--info-color in
all three theme files, hue-preserving, computed against WCAG 2.1 formulas:
- border-color: 1.24-1.42:1 -> >=3.0:1 (non-text/UI-component minimum)
- status colors: 2.15-3.76:1 -> >=4.5:1 (plain-text minimum)
--primary-color/--secondary-color/--accent-color/gradients untouched -
only semantic feedback tokens changed. lavero's success-color now diverges
from primary-color (they only happened to share a hex before; semantic
status vs. brand identity are different concerns).

Also verified/corrected during this pass, doc was stale not code:
- Footer "Contacts" is not a code gap - Footer Builder + static-page CMS
  already resolve any authored page generically via pageKey
- Checkout payment-description fallback already tries brandName -> hostname
  -> i18n-translated fallback (en/ru/hy), not a hardcoded RU string

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
sdarbinyan
2026-08-17 22:04:14 +04:00
parent 634e3faf3d
commit 54cd089e80
4 changed files with 36 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/styles/themes/dexar.theme.scss
View File

@@ -20,12 +20,16 @@
--bg-tertiary: #f0f0f0;
--bg-header: rgba(117, 121, 124, 0.1);
--success-color: #10b981;
--warning-color: #f59e0b;
--error-color: #ef4444;
--info-color: #3b82f6;
--border-color: #d3dad9;
// WCAG AA remediation (2026-08-17): darkened, hue-preserving, to clear 4.5:1
// as plain text against --bg-primary. Originals measured 2.15-3.76:1.
--success-color: #0c855d;
--warning-color: #a36907;
--error-color: #eb1515;
--info-color: #1e6ff5;
// WCAG AA remediation (2026-08-17): darkened to clear 3:1 non-text/UI-component
// contrast against --bg-primary. Original measured 1.42:1.
--border-color: #859996;
--border-dark: #677b78;
--shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.15);

18
src/styles/themes/lavero.theme.scss
View File

@@ -19,12 +19,18 @@
--bg-secondary: #f0fdf4;
--bg-tertiary: #d1fae5;
--success-color: #FD7300;
--warning-color: #f59e0b;
--error-color: #ef4444;
--info-color: #3b82f6;
--border-color: #e5e7eb;
// WCAG AA remediation (2026-08-17): darkened, hue-preserving, to clear 4.5:1
// as plain text against --bg-primary. Originals measured 2.15-2.75:1.
// success-color intentionally diverges from --primary-color here (semantic
// status token vs. brand token; they only happened to share a hex before).
--success-color: #c05700;
--warning-color: #a36907;
--error-color: #eb1515;
--info-color: #1e6ff5;
// WCAG AA remediation (2026-08-17): darkened to clear 3:1 non-text/UI-component
// contrast against --bg-primary. Original measured 1.24:1.
--border-color: #8c95a6;
--border-dark: #4b5563;
--bg-header: rgba(253, 115, 0, 0.05);
--shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);

16
src/styles/themes/novo.theme.scss
View File

@@ -19,12 +19,16 @@
--bg-secondary: #f0fdf4;
--bg-tertiary: #d1fae5;
--success-color: #10b981;
--warning-color: #f59e0b;
--error-color: #ef4444;
--info-color: #3b82f6;
--border-color: #e5e7eb;
// WCAG AA remediation (2026-08-17): darkened, hue-preserving, to clear 4.5:1
// as plain text against --bg-primary. Originals measured 2.15-3.76:1.
--success-color: #0c855d;
--warning-color: #a36907;
--error-color: #eb1515;
--info-color: #1e6ff5;
// WCAG AA remediation (2026-08-17): darkened to clear 3:1 non-text/UI-component
// contrast against --bg-primary. Original measured 1.24:1.
--border-color: #8c95a6;
--border-dark: #4b5563;
--bg-header: rgba(16, 185, 129, 0.05);
--shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);