Files
cv-site/templates/partials/widgets/zoom-control.html
T
juanatsap 9636b3659f refactor: Extract all hardcoded content to JSON files
- Move all bilingual text from templates to UI JSON (labels, buttons, modals)
- Move skills summary paragraph to CV JSON with HTML support
- Add new UI sections: navigation, viewControls, sections, footer, portfolio,
  pdfModal, shortcutsModal, infoModal, widgets
- Update Go structs to match expanded JSON structure
- Add template.HTML type for CV.SkillsSummary field
- Add JSON content validation test (70-json-content-validation.test.mjs)

Templates now contain only structural logic (CSS classes, HTML attributes)
while all user-visible text loads from JSON files for proper i18n support.
2025-11-30 10:13:37 +00:00

48 lines
1.7 KiB
HTML

{{define "zoom-control"}}
<!-- Zoom Control (Fixed Bottom Center, Draggable) - Hyperscript Enhanced -->
<div id="zoom-control" class="zoom-control no-print zoom-hidden" role="group" aria-label="{{.UI.Widgets.ZoomControl.GroupLabel}}"
_="on load call initZoomControl(me)
on mousedown(clientX, clientY) if isZoomDragTarget(event.target) call startZoomDrag(me, clientX, clientY) then halt the event end
on mousemove(clientX, clientY) from document if moveZoomDrag(me, clientX, clientY) halt the event end
on mouseup from document call endZoomDrag(me)">
<button
id="zoom-close"
class="zoom-close-btn"
aria-label="{{.UI.Widgets.ZoomControl.CloseLabel}}"
title="{{.UI.Widgets.ZoomControl.CloseTitle}}"
_="on click call hideZoomControl()">
<iconify-icon icon="mdi:close" width="16" height="16" style="pointer-events: none;"></iconify-icon>
</button>
<span class="zoom-value zoom-value-min" aria-hidden="true">25</span>
<input
type="range"
id="zoom-slider"
class="zoom-slider"
min="25"
max="300"
step="1"
value="100"
aria-label="{{.UI.Widgets.ZoomControl.SliderLabel}}"
aria-valuemin="25"
aria-valuemax="300"
aria-valuenow="100"
aria-valuetext="100%"
_="on input call handleZoomInput(me)">
<span class="zoom-value zoom-value-max" aria-hidden="true">300</span>
<button
id="zoom-reset"
class="zoom-reset-btn"
aria-label="{{.UI.Widgets.ZoomControl.ResetLabel}}"
title="{{.UI.Widgets.ZoomControl.ResetTitle}}"
aria-live="polite"
_="on click call handleZoomReset()">
<span id="zoom-value-current">100</span>
</button>
</div>
{{end}}