aboutsummaryrefslogtreecommitdiff
path: root/internal/ui
diff options
context:
space:
mode:
Diffstat (limited to 'internal/ui')
-rw-r--r--internal/ui/search.go (renamed from internal/ui/search_entries.go)42
-rw-r--r--internal/ui/static/css/common.css143
-rw-r--r--internal/ui/static/js/app.js13
-rw-r--r--internal/ui/static/js/bootstrap.js2
-rw-r--r--internal/ui/static/js/keyboard_handler.js3
-rw-r--r--internal/ui/ui.go2
6 files changed, 70 insertions, 135 deletions
diff --git a/internal/ui/search_entries.go b/internal/ui/search.go
index 68df5c9b..d426411f 100644
--- a/internal/ui/search_entries.go
+++ b/internal/ui/search.go
@@ -14,7 +14,7 @@ import (
"miniflux.app/v2/internal/ui/view"
)
-func (h *handler) showSearchEntriesPage(w http.ResponseWriter, r *http.Request) {
+func (h *handler) showSearchPage(w http.ResponseWriter, r *http.Request) {
user, err := h.store.UserByID(request.UserID(r))
if err != nil {
html.ServerError(w, r, err)
@@ -23,32 +23,38 @@ func (h *handler) showSearchEntriesPage(w http.ResponseWriter, r *http.Request)
searchQuery := request.QueryStringParam(r, "q", "")
offset := request.QueryIntParam(r, "offset", 0)
- builder := h.store.NewEntryQueryBuilder(user.ID)
- builder.WithSearchQuery(searchQuery)
- builder.WithoutStatus(model.EntryStatusRemoved)
- builder.WithOffset(offset)
- builder.WithLimit(user.EntriesPerPage)
- entries, err := builder.GetEntries()
- if err != nil {
- html.ServerError(w, r, err)
- return
- }
+ var entries model.Entries
+ var entriesCount int
- count, err := builder.CountEntries()
- if err != nil {
- html.ServerError(w, r, err)
- return
+ if searchQuery != "" {
+ builder := h.store.NewEntryQueryBuilder(user.ID)
+ builder.WithSearchQuery(searchQuery)
+ builder.WithoutStatus(model.EntryStatusRemoved)
+ builder.WithOffset(offset)
+ builder.WithLimit(user.EntriesPerPage)
+
+ entries, err = builder.GetEntries()
+ if err != nil {
+ html.ServerError(w, r, err)
+ return
+ }
+
+ entriesCount, err = builder.CountEntries()
+ if err != nil {
+ html.ServerError(w, r, err)
+ return
+ }
}
sess := session.New(h.store, request.SessionID(r))
view := view.New(h.tpl, r, sess)
- pagination := getPagination(route.Path(h.router, "searchEntries"), count, offset, user.EntriesPerPage)
+ pagination := getPagination(route.Path(h.router, "search"), entriesCount, offset, user.EntriesPerPage)
pagination.SearchQuery = searchQuery
view.Set("searchQuery", searchQuery)
view.Set("entries", entries)
- view.Set("total", count)
+ view.Set("total", entriesCount)
view.Set("pagination", pagination)
view.Set("menu", "search")
view.Set("user", user)
@@ -56,5 +62,5 @@ func (h *handler) showSearchEntriesPage(w http.ResponseWriter, r *http.Request)
view.Set("countErrorFeeds", h.store.CountUserFeedsWithErrors(user.ID))
view.Set("hasSaveEntry", h.store.HasSaveEntry(user.ID))
- html.OK(w, r, view.Render("search_entries"))
+ html.OK(w, r, view.Render("search"))
}
diff --git a/internal/ui/static/css/common.css b/internal/ui/static/css/common.css
index 731c19c9..c3d79f59 100644
--- a/internal/ui/static/css/common.css
+++ b/internal/ui/static/css/common.css
@@ -29,8 +29,8 @@ h1, h2, h3 {
}
main {
- padding-left: 5px;
- padding-right: 5px;
+ padding-left: 3px;
+ padding-right: 3px;
margin-bottom: 30px;
}
@@ -51,36 +51,36 @@ a:hover {
}
.sr-only {
- border: 0 !important;
- clip: rect(1px, 1px, 1px, 1px) !important;
- -webkit-clip-path: inset(50%) !important;
- clip-path: inset(50%) !important;
- height: 1px !important;
- overflow: hidden !important;
- margin: -1px !important;
- padding: 0 !important;
- position: absolute !important;
- width: 1px !important;
- white-space: nowrap !important;
+ border: 0 !important;
+ clip: rect(1px, 1px, 1px, 1px) !important;
+ -webkit-clip-path: inset(50%) !important;
+ clip-path: inset(50%) !important;
+ height: 1px !important;
+ overflow: hidden !important;
+ margin: -1px !important;
+ padding: 0 !important;
+ position: absolute !important;
+ width: 1px !important;
+ white-space: nowrap !important;
}
.skip-to-content-link {
- --padding-size: 8px;
- --border-size: 1px;
+ --padding-size: 8px;
+ --border-size: 1px;
- background-color: var(--category-background-color);
- color: var(--category-color);
- border: var(--border-size) solid var(--category-border-color);
- border-radius: 5px;
- inset-inline-start: 50%;
- padding: var(--padding-size);
- position: absolute;
- transition: translate 0.3s;
- translate: -50% calc(-100% - calc(var(--padding-size) * 2) - calc(var(--border-size) * 2));
+ background-color: var(--category-background-color);
+ color: var(--category-color);
+ border: var(--border-size) solid var(--category-border-color);
+ border-radius: 5px;
+ inset-inline-start: 50%;
+ padding: var(--padding-size);
+ position: absolute;
+ transition: translate 0.3s;
+ translate: -50% calc(-100% - calc(var(--padding-size) * 2) - calc(var(--border-size) * 2));
}
.skip-to-content-link:focus {
- translate: -50% 0;
+ translate: -50% 0;
}
/* Header and main menu */
@@ -145,7 +145,7 @@ a:hover {
/* Page header and footer*/
.page-header {
- padding-inline: 5px;
+ padding-inline: 3px;
margin-bottom: 25px;
}
@@ -226,44 +226,6 @@ a:hover {
color: var(--logo-hover-color-span);
}
-/* Search form */
-.search {
- text-align: center;
- margin-top: 10px;
- margin-right: 5px;
-}
-
-.search-summary-icon {
- padding: 5px;
- inline-size: 24px;
- block-size: 24px;
- translate: 0 -3px;
-}
-
-.search-details {
-
- &[open] .search-summary-icon {
- rotate: 180deg;
- }
-}
-
-.search-summary {
- list-style: none;
- display: flex;
- justify-content: center;
- inline-size: fit-content;
- margin-inline: auto;
-}
-
-.search-summary::marker, /* Latest Chrome, Edge, Firefox */
-.search-summary::-webkit-details-marker /* Safari */ {
- display: none;
-}
-
-.search-toggle-switch {
- display: none;
-}
-
/* PWA prompt */
#prompt-home-screen {
display: none;
@@ -318,26 +280,33 @@ a:hover {
100% {visibility: hidden; opacity: 0; z-index: 0}
}
+/* Hide the logo when there is not enough space to display menus when using languages more verbose than English */
+@media (min-width: 625px) and (max-width: 830px) {
+ .logo {
+ display: none;
+ }
+}
+
+@media (min-width: 830px) {
+ .logo {
+ padding-right: 8px;
+ }
+}
+
@media (min-width: 620px) {
body {
margin: auto;
- max-width: 750px;
+ max-width: 820px;
}
.header {
- margin-bottom: 0;
- }
-
- .logo {
- text-align: left;
- float: left;
- margin-right: 15px;
+ padding-left: 3px;
}
.header li {
- display: inline;
+ display: inline-block;
padding: 0;
- padding-right: 15px;
+ padding-right: 12px;
line-height: normal;
border: none;
font-size: 1.0em;
@@ -365,32 +334,6 @@ a:hover {
display: inline;
padding-right: 15px;
}
-
- /* Search form */
- .search {
- text-align: right;
- display: block;
- }
-
- .search details > summary {
- margin-inline: auto 0;
- }
-
- .search-toggle-switch {
- display: block;
- }
-
- .search-form {
- display: none;
- }
-
- .search-toggle-switch.has-search-query {
- display: none;
- }
-
- .search-form.has-search-query {
- display: block;
- }
}
/* Tables */
diff --git a/internal/ui/static/js/app.js b/internal/ui/static/js/app.js
index 99145d49..599119a2 100644
--- a/internal/ui/static/js/app.js
+++ b/internal/ui/static/js/app.js
@@ -121,19 +121,6 @@ function handleSubmitButtons() {
});
}
-// Set cursor focus to the search input.
-function setFocusToSearchInput(event) {
- event.preventDefault();
- event.stopPropagation();
- const toggleSearchButton = document.querySelector(".search details")
- if (!toggleSearchButton.getAttribute("open")) {
- toggleSearchButton.setAttribute("open", "")
- const searchInputElement = document.getElementById("search-input");
- searchInputElement.focus();
- searchInputElement.value = "";
- }
-}
-
// Show modal dialog with the list of keyboard shortcuts.
function showKeyboardShortcuts() {
let template = document.getElementById("keyboard-shortcuts");
diff --git a/internal/ui/static/js/bootstrap.js b/internal/ui/static/js/bootstrap.js
index cd11008e..fcc4d648 100644
--- a/internal/ui/static/js/bootstrap.js
+++ b/internal/ui/static/js/bootstrap.js
@@ -35,7 +35,7 @@ document.addEventListener("DOMContentLoaded", () => {
keyboardHandler.on("?", () => showKeyboardShortcuts());
keyboardHandler.on("+", () => goToAddSubscription());
keyboardHandler.on("#", () => unsubscribeFromFeed());
- keyboardHandler.on("/", (e) => setFocusToSearchInput(e));
+ keyboardHandler.on("/", () => goToPage("search"));
keyboardHandler.on("a", () => {
let enclosureElement = document.querySelector('.entry-enclosures');
if (enclosureElement) {
diff --git a/internal/ui/static/js/keyboard_handler.js b/internal/ui/static/js/keyboard_handler.js
index 3459db5d..55b72964 100644
--- a/internal/ui/static/js/keyboard_handler.js
+++ b/internal/ui/static/js/keyboard_handler.js
@@ -17,8 +17,7 @@ class KeyboardHandler {
return;
}
- if (key != "Enter")
- {
+ if (key != "Enter") {
event.preventDefault();
}
diff --git a/internal/ui/ui.go b/internal/ui/ui.go
index 0393d33b..6d8e729c 100644
--- a/internal/ui/ui.go
+++ b/internal/ui/ui.go
@@ -57,7 +57,7 @@ func Serve(router *mux.Router, store *storage.Storage, pool *worker.Pool) {
uiRouter.HandleFunc("/starred/entry/{entryID}", handler.showStarredEntryPage).Name("starredEntry").Methods(http.MethodGet)
// Search pages.
- uiRouter.HandleFunc("/search", handler.showSearchEntriesPage).Name("searchEntries").Methods(http.MethodGet)
+ uiRouter.HandleFunc("/search", handler.showSearchPage).Name("search").Methods(http.MethodGet)
uiRouter.HandleFunc("/search/entry/{entryID}", handler.showSearchEntryPage).Name("searchEntry").Methods(http.MethodGet)
// Feed listing pages.