Files
cv-site/templates/partials/color-theme-switcher.html
T
juanatsap 976b8ae2e2 fix: Scale floating button icons proportionally on mobile viewports
Remove hardcoded width/height HTML attributes from iconify-icon elements
that were overriding CSS sizing. The iconify-icon component uses HTML
attributes for SVG rendering, ignoring CSS width/height.

- Remove width="28" height="28" from 8 button templates
- Remove conflicting 768px media query from _buttons.css
- Add default desktop icon sizes (24px) in _scroll-behavior.css
- Icons now scale via clamp() from 18px (380px) to 24px (900px)
2025-12-01 12:31:31 +00:00

18 lines
754 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) -->
<div style="display: none;">
<button class="theme-option-btn" data-theme-mode="light"></button>
<button class="theme-option-btn" data-theme-mode="dark"></button>
<button class="theme-option-btn active" data-theme-mode="auto"></button>
</div>
{{end}}