fix: Use each button's hover color for at-bottom state + add zoom button

**Bug 1: Wrong at-bottom colors**
- All buttons were showing orange (#f39c12) when at bottom
- User wanted each button to use its own hover color

**Bug 2: Zoom button missing at-bottom state**
- Zoom/search button wasn't changing color at bottom

**Fix - Updated .at-bottom styles to match hover colors:**

Download PDF button:
- Was: Orange (#f39c12)
- Now: PDF Red (#cd6060) - matches hover

Print Friendly button:
- Was: Orange (#f39c12)
- Now: White background + Green icon (#27ae60) - matches hover

Shortcuts button:
- Kept: Orange (#f39c12) - already correct

Color Theme Switcher:
- Was: Uniform orange
- Now: Dynamic colors based on theme mode
  - Light mode: Yellow (#f39c12)
  - Dark mode: Blue (#3498db)
  - Auto mode: Purple (#9b59b6)

Info button:
- Already correct: Green (#27ae60)

Back-to-top button:
- Already correct: Green (#27ae60)

Zoom button:
- Added: Blue (#3498db) - matches hover
- Added to scroll handler in utils._hs

**Result**: Each button now shows its characteristic color when page
is scrolled to bottom, providing consistent visual feedback that matches
the hover state.

Files changed:
- static/hyperscript/utils._hs: Added zoom button
- static/css/main.css: Updated 3 button colors
- static/css/color-theme.css: Dynamic theme colors
This commit is contained in:
juanatsap
2025-11-19 09:35:17 +00:00
parent f9ce37b6d0
commit 2ebb9f5293
3 changed files with 27 additions and 5 deletions
+2
View File
@@ -117,6 +117,7 @@ def handleScroll()
add .at-bottom to #download-button
add .at-bottom to #print-friendly-button
add .at-bottom to .color-theme-switcher
add .at-bottom to #zoom-toggle-button
end
if not isAtBottom
@@ -126,6 +127,7 @@ def handleScroll()
remove .at-bottom from #download-button
remove .at-bottom from #print-friendly-button
remove .at-bottom from .color-theme-switcher
remove .at-bottom from #zoom-toggle-button
end
-- Update last scroll position