Files
cv-site/templates/partials/navigation/action-buttons.html
T
juanatsap bfb7b35c50 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
2025-11-16 13:19:56 +00:00

35 lines
1.5 KiB
HTML

{{define "action-buttons"}}
<!-- Right: Action buttons -->
<div class="action-buttons-right">
<button
id="action-bar-pdf-btn"
class="action-btn pdf-btn"
onclick="document.getElementById('pdf-modal').showModal()"
aria-label="{{if eq .Lang "es"}}Descargar como PDF{{else}}Download as PDF{{end}}"
_="on mouseenter
add .pdf-hover-sync to me
add .pdf-hover-sync to #download-button
on mouseleave
remove .pdf-hover-sync from me
remove .pdf-hover-sync from #download-button">
<iconify-icon icon="catppuccin:pdf" width="18" height="18"></iconify-icon>
{{if eq .Lang "es"}}Descargar como PDF{{else}}Download as PDF{{end}}
</button>
<button
class="action-btn print-btn action-bar-print-btn"
aria-label="{{if eq .Lang "es"}}Imprimir amigable{{else}}Print Friendly{{end}}"
_="on click call printFriendly()
on mouseenter
add .print-hover-sync to me
add .print-hover-sync to #print-friendly-button
add .print-hover-sync to .menu-print-btn
on mouseleave
remove .print-hover-sync from me
remove .print-hover-sync from #print-friendly-button
remove .print-hover-sync from .menu-print-btn">
<iconify-icon icon="mdi:leaf" width="18" height="18"></iconify-icon>
{{if eq .Lang "es"}}Imprimir amigable{{else}}Print Friendly{{end}}
</button>
</div>
{{end}}