9636b3659f
- 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.
159 lines
8.6 KiB
HTML
159 lines
8.6 KiB
HTML
{{define "shortcuts-modal"}}
|
||
<!-- Keyboard Shortcuts Modal - Native Dialog -->
|
||
<dialog id="shortcuts-modal" class="info-modal no-print"
|
||
_="on click call closeOnBackdrop(me, event)">
|
||
<div class="info-modal-content">
|
||
<button class="info-modal-close" onclick="document.getElementById('shortcuts-modal').close()" aria-label="{{.UI.ShortcutsModal.Close}}">
|
||
<iconify-icon icon="mdi:close" width="24" height="24"></iconify-icon>
|
||
</button>
|
||
|
||
<div class="info-modal-header">
|
||
<h2>{{.UI.ShortcutsModal.Title}}</h2>
|
||
<div class="info-modal-cv-title">
|
||
<span class="keyboard-icon-wrapper">
|
||
<iconify-icon icon="mdi:keyboard-outline" width="32" height="32"></iconify-icon>
|
||
</span>
|
||
{{.UI.ShortcutsModal.Subtitle}}
|
||
</div>
|
||
</div>
|
||
|
||
<div class="info-modal-body">
|
||
|
||
<!-- Zoom Shortcuts -->
|
||
<div class="shortcuts-section">
|
||
<h3 class="shortcuts-section-title">
|
||
<iconify-icon icon="mdi:magnify" width="20" height="20"></iconify-icon>
|
||
{{.UI.ShortcutsModal.Sections.Zoom.Title}}
|
||
</h3>
|
||
<div class="shortcuts-list">
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:apple-keyboard-control" width="14" height="14"></iconify-icon></kbd> / <kbd><iconify-icon icon="mdi:apple-keyboard-command" width="14" height="14"></iconify-icon></kbd> <kbd>+</kbd>
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Zoom.ZoomIn.Description}}</span>
|
||
</div>
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:apple-keyboard-control" width="14" height="14"></iconify-icon></kbd> / <kbd><iconify-icon icon="mdi:apple-keyboard-command" width="14" height="14"></iconify-icon></kbd> <kbd>−</kbd>
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Zoom.ZoomOut.Description}}</span>
|
||
</div>
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:apple-keyboard-control" width="14" height="14"></iconify-icon></kbd> / <kbd><iconify-icon icon="mdi:apple-keyboard-command" width="14" height="14"></iconify-icon></kbd> <kbd>0</kbd>
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Zoom.ZoomReset.Description}}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- View Controls -->
|
||
<div class="shortcuts-section">
|
||
<h3 class="shortcuts-section-title">
|
||
<iconify-icon icon="mdi:tune-variant" width="20" height="20"></iconify-icon>
|
||
{{.UI.ShortcutsModal.Sections.ViewControls.Title}}
|
||
</h3>
|
||
<div class="shortcuts-list">
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:keyboard-tab" width="14" height="14"></iconify-icon></kbd> to Length
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.ViewControls.ToggleLength.Description}}</span>
|
||
</div>
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:keyboard-tab" width="14" height="14"></iconify-icon></kbd> to Icons
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.ViewControls.ToggleIcons.Description}}</span>
|
||
</div>
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:keyboard-tab" width="14" height="14"></iconify-icon></kbd> to View
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.ViewControls.ToggleTheme.Description}}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Navigation -->
|
||
<div class="shortcuts-section">
|
||
<h3 class="shortcuts-section-title">
|
||
<iconify-icon icon="mdi:compass-outline" width="20" height="20"></iconify-icon>
|
||
{{.UI.ShortcutsModal.Sections.Navigation.Title}}
|
||
</h3>
|
||
<div class="shortcuts-list">
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
Menu → Expand All
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Navigation.ExpandAll.Description}}</span>
|
||
</div>
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
Menu → Collapse All
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Navigation.CollapseAll.Description}}</span>
|
||
</div>
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
Click <kbd>↑</kbd> Button
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Navigation.ScrollToTop.Description}}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Actions -->
|
||
<div class="shortcuts-section">
|
||
<h3 class="shortcuts-section-title">
|
||
<iconify-icon icon="mdi:lightning-bolt" width="20" height="20"></iconify-icon>
|
||
{{.UI.ShortcutsModal.Sections.Actions.Title}}
|
||
</h3>
|
||
<div class="shortcuts-list">
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:apple-keyboard-control" width="14" height="14"></iconify-icon></kbd> / <kbd><iconify-icon icon="mdi:apple-keyboard-command" width="14" height="14"></iconify-icon></kbd> <kbd>P</kbd>
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Actions.Print.Description}}</span>
|
||
</div>
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:keyboard-esc" width="14" height="14"></iconify-icon></kbd>
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Actions.CloseModal.Description}}</span>
|
||
</div>
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd>?</kbd>
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Actions.ShowHelp.Description}}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Browser Defaults -->
|
||
<div class="shortcuts-section">
|
||
<h3 class="shortcuts-section-title">
|
||
<iconify-icon icon="mdi:web" width="20" height="20"></iconify-icon>
|
||
{{.UI.ShortcutsModal.Sections.Browser.Title}}
|
||
</h3>
|
||
<div class="shortcuts-list">
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:keyboard-tab" width="14" height="14"></iconify-icon></kbd>
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Browser.Tab.Description}}</span>
|
||
</div>
|
||
<div class="shortcut-item">
|
||
<div class="shortcut-keys">
|
||
<kbd><iconify-icon icon="mdi:keyboard-return" width="14" height="14"></iconify-icon></kbd> / <kbd><iconify-icon icon="mdi:keyboard-space" width="14" height="14"></iconify-icon></kbd>
|
||
</div>
|
||
<span class="shortcut-desc">{{.UI.ShortcutsModal.Sections.Browser.Enter.Description}}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</dialog>
|
||
{{end}}
|