phase ii and phase iii

templates/partials/navigation/view-controls.html

@@ -5,7 +5,13 @@
     <div class="selector-group">
         <label class="selector-label">{{if eq .Lang "es"}}Longitud{{else}}Length{{end}}:</label>
         <label class="icon-toggle">
-            <input type="checkbox" id="lengthToggle" onchange="toggleCVLength()">
+            <input type="checkbox"
+                   id="lengthToggle"
+                   {{if eq .CVLengthClass "cv-long"}}checked{{end}}
+                   hx-post="/toggle/length"
+                   hx-target=".cv-paper"
+                   hx-swap="outerHTML"
+                   hx-indicator="#loading">
             <span class="icon-toggle-slider">
                 <iconify-icon icon="mdi:file-document-outline" width="16" height="16" class="icon-left"></iconify-icon>
                 <iconify-icon icon="mdi:file-document-multiple-outline" width="16" height="16" class="icon-right"></iconify-icon>
@@ -17,7 +23,13 @@
     <div class="selector-group">
         <label class="selector-label">{{if eq .Lang "es"}}Logos{{else}}Logos{{end}}:</label>
         <label class="icon-toggle">
-            <input type="checkbox" id="logoToggle" checked onchange="toggleLogos()">
+            <input type="checkbox"
+                   id="logoToggle"
+                   {{if .ShowLogos}}checked{{end}}
+                   hx-post="/toggle/logos"
+                   hx-target=".cv-paper"
+                   hx-swap="outerHTML"
+                   hx-indicator="#loading">
             <span class="icon-toggle-slider">
                 <iconify-icon icon="mdi:image-off-outline" width="16" height="16" class="icon-left"></iconify-icon>
                 <iconify-icon icon="mdi:image-multiple-outline" width="16" height="16" class="icon-right"></iconify-icon>
@@ -29,7 +41,13 @@
     <div class="selector-group">
         <label class="selector-label">{{if eq .Lang "es"}}Vista{{else}}View{{end}}:</label>
         <label class="icon-toggle">
-            <input type="checkbox" id="themeToggle" onchange="toggleTheme()">
+            <input type="checkbox"
+                   id="themeToggle"
+                   {{if .ThemeClean}}checked{{end}}
+                   hx-post="/toggle/theme"
+                   hx-target="body"
+                   hx-swap="outerHTML"
+                   hx-indicator="#loading">
             <span class="icon-toggle-slider">
                 <iconify-icon icon="mdi:page-layout-sidebar-left" width="16" height="16" class="icon-left"></iconify-icon>
                 <iconify-icon icon="mdi:page-layout-body" width="16" height="16" class="icon-right"></iconify-icon>