Louisiana Association of the Deaf website
TheMaddax
f4e95487d7
🎉 Major Accessibility Enhancement - WCAG AAA Compliant High Contrast Themes ✨ New Features: • High Contrast Light theme (pure black on white, 7:1+ contrast ratio) • High Contrast Dark theme (pure white on black, 7:1+ contrast ratio) • Custom high contrast icons for theme selector • Enhanced 4px yellow focus indicators for keyboard navigation • Multiple access points (navigation dropdown + footer buttons) �� Technical Implementation: • CSS-only theme switching using semantic variables • Next-themes integration for persistent theme selection • Comprehensive button and navigation text visibility fixes • CTA section contrast improvements • Enhanced typography with 600-700 font weights • Strong 2-3px borders for element definition 🎯 Accessibility Compliance: • WCAG AAA compliance achieved with maximum contrast ratios • Complete text visibility across all UI elements • Eliminated blue elements in high contrast modes for true contrast • Performance optimized with no JavaScript re-rendering 📁 Files Modified: • frontend/src/app/globals.css - Added high contrast CSS variables and overrides • frontend/src/app/layout.tsx - Updated ThemeProvider configuration • frontend/src/components/atoms/Icons.tsx - Added high contrast icons • frontend/src/components/molecules/ThemeSelector.tsx - Enhanced theme options • frontend/src/components/organisms/Footer.tsx - Added accessibility section 🏆 Impact: Provides essential accessibility support for low vision users in the deaf community, ensuring the OCD website is inclusive and accessible to all users. |
||
|---|---|---|
| backend | ||
| cline_docs | ||
| frontend | ||
| mongo-init | ||
| nginx/conf | ||
| .gitignore | ||
| best_practices.txt | ||
| docker-compose.dev.yml | ||
| docker-compose.yml | ||
| how_to_use_perplexity_mcp.md | ||
| planned_implementation.txt | ||
| TECH_STACK | ||
| TO_DO.txt | ||