Files
cv-site/templates/partials/color-theme-switcher.html
juanatsap 40733034ca feat: comprehensive WCAG 2.1 AA accessibility audit
- Add aria-labels to menu action buttons (PDF, Print, Contact)
- Add aria-labelledby to toggle checkboxes (desktop + mobile)
- Add -webkit-user-select prefix for Safari compatibility
- Add DynamicCacheControl middleware for HTML pages
- Add accessibility test suite (60-accessibility.test.mjs)
- Add comprehensive accessibility documentation (21-ACCESSIBILITY.md)
- Update Modern Web Techniques doc to mark audit complete
2025-12-02 10:46:53 +00:00

18 lines
903 B
HTML

{{define "color-theme-switcher"}}
<!-- Color Theme Switcher (Light/Dark/Auto) - Cycles on click -->
<!-- IMPORTANT: This controls COLOR theme, NOT layout theme (.theme-clean) -->
<button id="color-theme-switcher"
class="color-theme-switcher no-print has-tooltip"
aria-label="Toggle color theme"
data-tooltip="Toggle color theme">
<iconify-icon id="themeIcon" icon="mdi:theme-light-dark"></iconify-icon>
</button>
<!-- Hidden buttons for compatibility (not displayed, not focusable) -->
<div style="display: none;" aria-hidden="true">
<button class="theme-option-btn" data-theme-mode="light" tabindex="-1" aria-label="Light theme"></button>
<button class="theme-option-btn" data-theme-mode="dark" tabindex="-1" aria-label="Dark theme"></button>
<button class="theme-option-btn active" data-theme-mode="auto" tabindex="-1" aria-label="Auto theme"></button>
</div>
{{end}}