diff options
| -rw-r--r-- | internal/template/templates/common/layout.html | 2 | ||||
| -rw-r--r-- | internal/template/templates/views/entry.html | 6 | ||||
| -rw-r--r-- | internal/ui/static/js/app.js | 13 | ||||
| -rw-r--r-- | internal/ui/static/js/bootstrap.js | 1 |
4 files changed, 14 insertions, 8 deletions
diff --git a/internal/template/templates/common/layout.html b/internal/template/templates/common/layout.html index a8e4e89a..32ba9506 100644 --- a/internal/template/templates/common/layout.html +++ b/internal/template/templates/common/layout.html @@ -122,7 +122,7 @@ </svg> </summary> <form action="{{ route "searchEntries" }}" aria-labelledby="search-input-label"> - <input type="search" name="q" aria-label="{{ t "search.label" }}" {{ if $.searchQuery }}value="{{ .searchQuery }}"{{ end }} required> + <input type="search" name="q" id="search-input" aria-label="{{ t "search.label" }}" {{ if $.searchQuery }}value="{{ .searchQuery }}"{{ end }} required> <button type="submit">{{ t "search.submit" }}</button> </form> </details> diff --git a/internal/template/templates/views/entry.html b/internal/template/templates/views/entry.html index bc357617..75374436 100644 --- a/internal/template/templates/views/entry.html +++ b/internal/template/templates/views/entry.html @@ -1,8 +1,8 @@ {{ define "title"}}{{ .entry.Title }}{{ end }} {{ define "page_header"}} -<section class="page-header" aria-labelledby="page-header-title"> - <div class="entry-header"> +<section class="entry page-header" data-id="{{ .entry.ID }}" aria-labelledby="page-header-title"> + <header class="entry-header"> <h1 id="page-header-title" dir="auto"> <a href="{{ .entry.URL | safeURL }}" target="_blank" rel="noopener noreferrer" referrerpolicy="no-referrer">{{ .entry.Title }}</a> </h1> @@ -143,7 +143,7 @@ </span> {{ end }} </div> - </div> + </header> </section> {{ end }} diff --git a/internal/ui/static/js/app.js b/internal/ui/static/js/app.js index 39a77c8e..319c3cf2 100644 --- a/internal/ui/static/js/app.js +++ b/internal/ui/static/js/app.js @@ -27,7 +27,6 @@ function onAuxClick(selector, callback, noPreventDefault) { // Show and hide the main menu on mobile devices. function toggleMainMenu() { - console.log("clc") let menu = document.querySelector(".header nav ul"); let menuToggleButton = document.querySelector(".header button[aria-controls='header-menu']"); if (menu.classList.contains("js-menu-show")) { @@ -69,8 +68,16 @@ function handleSubmitButtons() { function setFocusToSearchInput(event) { event.preventDefault(); event.stopPropagation(); + const toggleSearchButton = document.querySelector(".search details") + console.log(toggleSearchButton.getAttribute("open")) + if (!toggleSearchButton.getAttribute("open")) { + toggleSearchButton.setAttribute("open", "") + const searchInputElement = document.getElementById("search-input"); + searchInputElement.focus(); + searchInputElement.value = ""; + } - let toggleSwitchElement = document.querySelector(".search-toggle-switch"); + /* let toggleSwitchElement = document.querySelector(".search-toggle-switch"); if (toggleSwitchElement) { toggleSwitchElement.style.display = "none"; } @@ -84,7 +91,7 @@ function setFocusToSearchInput(event) { if (searchInputElement) { searchInputElement.focus(); searchInputElement.value = ""; - } + } */ } // Show modal dialog with the list of keyboard shortcuts. diff --git a/internal/ui/static/js/bootstrap.js b/internal/ui/static/js/bootstrap.js index dc23ada7..d31c7bc8 100644 --- a/internal/ui/static/js/bootstrap.js +++ b/internal/ui/static/js/bootstrap.js @@ -82,7 +82,6 @@ document.addEventListener("DOMContentLoaded", () => { onClick("a[data-save-entry]", (event) => handleSaveEntry(event.target)); onClick("a[data-toggle-bookmark]", (event) => handleBookmark(event.target)); onClick("a[data-fetch-content-entry]", () => handleFetchOriginalContent()); - onClick("a[data-action=search]", (event) => setFocusToSearchInput(event)); onClick("a[data-share-status]", () => handleShare()); onClick("a[data-action=markPageAsRead]", (event) => handleConfirmationMessage(event.target, () => markPageAsRead())); onClick("a[data-toggle-status]", (event) => handleEntryStatus("next", event.target)); |