feat: add synchronized hover effect for PDF and print-friendly buttons

- PDF buttons (fixed, action bar, menu) now sync hover states across all instances
- Print-friendly buttons (fixed, action bar, menu) sync green hover states
- White PDF icon with red hover background (#cd6060)
- Green print button hover (#27ae60)
- Implemented using hyperscript with .pdf-hover-sync and .print-hover-sync classes
- Creates cool visual feedback showing all related buttons simultaneously
This commit is contained in:
juanatsap
2025-11-16 13:19:56 +00:00
parent ac0cf15eb9
commit bfb7b35c50
6 changed files with 193 additions and 13 deletions
@@ -0,0 +1,17 @@
{{define "download-button"}}
<!-- Download PDF Button (Fixed Left) -->
<button
id="download-button"
class="fixed-btn download-btn no-print"
aria-label="{{if eq .Lang "es"}}Descargar PDF{{else}}Download PDF{{end}}"
title="{{if eq .Lang "es"}}Descargar PDF{{else}}Download PDF{{end}}"
onclick="document.getElementById('pdf-modal').showModal()"
_="on mouseenter
add .pdf-hover-sync to me
add .pdf-hover-sync to #action-bar-pdf-btn
on mouseleave
remove .pdf-hover-sync from me
remove .pdf-hover-sync from #action-bar-pdf-btn">
<iconify-icon icon="catppuccin:pdf" width="28" height="28"></iconify-icon>
</button>
{{end}}