fix: Override .has-tooltip position for theme switcher button

Browse Source

The theme switcher button was hidden above the viewport on desktop because
.has-tooltip's position: relative was overriding the button's position: fixed
due to CSS cascade order (_tooltips.css loaded after _themes.css).

Fixed by adding !important to .color-theme-switcher position: fixed rule.

Changes:
- static/css/01-foundation/_themes.css: Add !important to position: fixed
  to override .has-tooltip position: relative cascade

Testing:
- Added comprehensive tooltip tests for all buttons (desktop & mobile)
- Verified theme switcher visible on desktop at correct position
- Verified all tooltips working on hover (desktop only, hidden on mobile touch)
- Verified button positioning in mobile bottom dock

All buttons now display correctly:
✅ Desktop: All 6 buttons with working tooltips
✅ Mobile: All 5 buttons in bottom dock

...

This commit is contained in:

juanatsap

2025-11-20 18:51:38 +00:00

parent 00254144b3

commit e5c824970c

9 changed files with 339 additions and 1 deletions

Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL

Download Patch File Download Diff File Expand all files Collapse all files

tests/mjs/screenshots/theme-button-debug.png

BIN

Binary file not shown.

Side by Side After Width:  |  Height:  |  Size: 204 KiB