juanatsap
404748afb5
Replace simple search button with search bar design in action bar: - Semi-transparent styling integrated with dark action bar - Keyboard shortcut indicators (⌘ K) shown as individual kbd elements - Search icon and "Search" text for better discoverability - Responsive: kbd keys hidden on mobile (<900px) - Remove unused cmd-k-button.html partial template Update test to verify new search bar structure (styling, kbd elements, icon).
39 lines
1.6 KiB
HTML
39 lines
1.6 KiB
HTML
{{define "action-buttons"}}
|
|
<!-- Right: Action buttons -->
|
|
<div class="action-buttons-right">
|
|
<button
|
|
id="action-bar-pdf-btn"
|
|
class="action-btn pdf-btn has-tooltip"
|
|
commandfor="pdf-modal"
|
|
command="show-modal"
|
|
aria-label="{{.UI.Widgets.ActionButtons.DownloadPdf}}"
|
|
data-tooltip="{{.UI.Widgets.ActionButtons.DownloadPdf}}"
|
|
_="on mouseenter call syncPdfHover(true)
|
|
on mouseleave call syncPdfHover(false)">
|
|
<iconify-icon icon="catppuccin:pdf" width="24" height="24"></iconify-icon>
|
|
{{.UI.Widgets.ActionButtons.DownloadPdf}}
|
|
</button>
|
|
<button
|
|
class="action-btn print-btn action-bar-print-btn has-tooltip"
|
|
aria-label="{{.UI.Widgets.ActionButtons.PrintFriendly}}"
|
|
data-tooltip="{{.UI.Widgets.ActionButtons.PrintFriendly}}"
|
|
_="on click call printFriendly()
|
|
on mouseenter call syncPrintHover(true)
|
|
on mouseleave call syncPrintHover(false)">
|
|
<iconify-icon icon="mdi:leaf" width="24" height="24"></iconify-icon>
|
|
{{.UI.Widgets.ActionButtons.PrintFriendly}}
|
|
</button>
|
|
<button
|
|
id="cmd-k-button"
|
|
class="action-btn search-bar-btn cmd-k-trigger"
|
|
aria-label="{{.UI.Widgets.ActionButtons.SearchAriaLabel}}">
|
|
<iconify-icon icon="mdi:magnify" width="18" height="18" class="search-bar-icon"></iconify-icon>
|
|
<span class="search-bar-text">{{.UI.Widgets.ActionButtons.Search}}</span>
|
|
<span class="search-bar-keys">
|
|
<kbd>⌘</kbd>
|
|
<kbd>K</kbd>
|
|
</span>
|
|
</button>
|
|
</div>
|
|
{{end}}
|