git.admin/roi-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(accessibility): Improve color contrast for WCAG AA compliance

Browse Source 
Phase 4.4 Accessibility:
- Change white text to navy-dark on orange table headers (ratio 4.8:1)
- Fix subtotal rows in APU tables: orange text to navy for better contrast
- Affects styles 2, 5, 7, 10 in generic tables
- Fixes PageSpeed accessibility warnings

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
FrankZamora
2025-11-27 16:16:55 -06:00
parent 23a3c4d074
commit 4ad48b4326
2 changed files with 12 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
Assets/css/css-global-generic-tables.css
View File

@@ -63,13 +63,14 @@
/* ========================================
STYLE 2: Orange Header with Light Background
Fase 4.4 Accesibilidad: Texto oscuro para contraste WCAG AA (4.5:1)
======================================== */
.post-content table:not(.analisis table):nth-of-type(3) thead tr:first-child th,
.post-content table:not(.analisis table):nth-of-type(3) tbody tr:first-child td,
.post-content table:not(.analisis table):nth-of-type(3) tr:first-child td {
background: var(--color-orange-primary);
color: #ffffff !important;
color: var(--color-navy-dark) !important;
border: none !important;
box-shadow: 0 2px 8px rgba(255, 133, 0, 0.3);
}
@@ -126,13 +127,14 @@
/* ========================================
STYLE 5: Orange Gradient Header
Fase 4.4 Accesibilidad: Texto oscuro para contraste WCAG AA (4.5:1)
======================================== */
.post-content table:not(.analisis table):nth-of-type(6) thead tr:first-child th,
.post-content table:not(.analisis table):nth-of-type(6) tbody tr:first-child td,
.post-content table:not(.analisis table):nth-of-type(6) tr:first-child td {
background: linear-gradient(135deg, var(--color-orange-primary) 0%, var(--color-orange-light) 100%);
color: #ffffff !important;
color: var(--color-navy-dark) !important;
border: none !important;
box-shadow: 0 2px 8px rgba(255, 133, 0, 0.35);
}
@@ -168,13 +170,14 @@
/* ========================================
STYLE 7: Light Orange Background
Fase 4.4 Accesibilidad: Texto oscuro para contraste WCAG AA (4.5:1)
======================================== */
.post-content table:not(.analisis table):nth-of-type(8) thead tr:first-child th,
.post-content table:not(.analisis table):nth-of-type(8) tbody tr:first-child td,
.post-content table:not(.analisis table):nth-of-type(8) tr:first-child td {
background: var(--color-orange-primary);
color: #ffffff !important;
color: var(--color-navy-dark) !important;
border: none !important;
border-bottom: 3px solid var(--color-navy-primary) !important;
}
@@ -235,6 +238,7 @@
/* ========================================
STYLE 10: Bold Orange Border
Fase 4.4 Accesibilidad: Texto oscuro para contraste WCAG AA (4.5:1)
======================================== */
.post-content table:not(.analisis table):nth-of-type(11) {
@@ -245,7 +249,7 @@
.post-content table:not(.analisis table):nth-of-type(11) tbody tr:first-child td,
.post-content table:not(.analisis table):nth-of-type(11) tr:first-child td {
background: linear-gradient(135deg, var(--color-orange-hover) 0%, var(--color-orange-primary) 100%);
color: #ffffff !important;
color: var(--color-navy-dark) !important;
border: none !important;
box-shadow: 0 2px 8px rgba(255, 107, 53, 0.4);
}

7
Assets/css/css-tablas-apu.css
View File

@@ -214,16 +214,17 @@
/* ========================================
FILAS DE SUBTOTALES
(Suma de Material, Suma de Mano de Obra, etc)
Fase 4.4 Accesibilidad: Color oscuro para contraste WCAG AA (4.5:1)
======================================== */
.analisis table tr.subtotal-row,
.desglose table tr.subtotal-row {
background-color: rgba(255, 133, 0, 0.1) !important;
background-color: rgba(255, 133, 0, 0.15) !important;
}
.analisis table tr.subtotal-row td,
.desglose table tr.subtotal-row td {
font-weight: 700;
color: var(--color-orange-primary);
color: #1e3a5f;
padding: 0.875rem 1rem;
border: none !important;
}
@@ -235,7 +236,7 @@
.analisis table tr.subtotal-row td.c6,
.analisis table tr.subtotal-row td:nth-child(6) {
font-size: 1.05rem;
color: var(--color-orange-primary);
color: #1e3a5f;
}
/* ========================================