From d2b2300ee1a4c7efa66960d78d3f38c35fdc6630 Mon Sep 17 00:00:00 2001 From: llmII Date: Wed, 4 Jan 2023 20:18:48 -0600 Subject: Feature: Pagination Widget with list of numbers. Adds to the navigation widget, preserving forward/backward nav, and inserting a list of clickable page numbers between them. Phone sized devices continue without this widget as deterministic display under small screen sizes has not been solved. The widget is agnostic to the actual amount of pages there are that one can navigate to and as such shows all plausible, albeit not necessarilly valid, possibilities. This widget does not interfere with infinite scroll in any fashion. --- searx/static/themes/simple/src/less/style.less | 30 ++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) (limited to 'searx/static/themes/simple/src') diff --git a/searx/static/themes/simple/src/less/style.less b/searx/static/themes/simple/src/less/style.less index e43508dd1..d5fb73017 100644 --- a/searx/static/themes/simple/src/less/style.less +++ b/searx/static/themes/simple/src/less/style.less @@ -734,6 +734,36 @@ article[data-vim-selected].category-social { } } +.numbered_pagination { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + overflow: hidden; +} + +@media screen and (max-width: calc(@phone - 0.5px)) { + .numbered_pagination { + display: none; + } +} + +.page_number { + background: none !important; + border: none !important; + color: var(--color-result-link-font) !important; + text-decoration: underline !important; + cursor: pointer !important; +} + +.page_number_current { + background: none !important; + border: none !important; + color: var(--color-result-link-visited-font) !important; + text-decoration: none !important; + cursor: pointer !important; +} + #apis { margin-top: 8px; clear: both; -- cgit v1.2.3 From 8ead23347f3884318b5d39f74209366c343a6013 Mon Sep 17 00:00:00 2001 From: mrpaulblack Date: Mon, 23 Jan 2023 22:56:55 +0100 Subject: [fix] use input elements for pagination requests * use html input elements instead of buttons for the pagination forms at the bottom of the result page * move the less section that hides the pagination number widget on mobile to the mobile section * clean up the less code for styling the numbers of the pagination widget * fix: add the margin for box results (like in news category) to the bottom of the result to have a margin between pagination widget and article result --- searx/static/themes/simple/src/less/style.less | 26 ++++++++++---------------- 1 file changed, 10 insertions(+), 16 deletions(-) (limited to 'searx/static/themes/simple/src') diff --git a/searx/static/themes/simple/src/less/style.less b/searx/static/themes/simple/src/less/style.less index d5fb73017..962dbeba0 100644 --- a/searx/static/themes/simple/src/less/style.less +++ b/searx/static/themes/simple/src/less/style.less @@ -362,7 +362,7 @@ article[data-vim-selected].category-social { .category-files, .category-social { border: 1px solid var(--color-result-border); - margin: 1rem @results-tablet-offset 0 @results-tablet-offset !important; + margin: 0 @results-tablet-offset 1rem @results-tablet-offset !important; .rounded-corners; } @@ -742,26 +742,16 @@ article[data-vim-selected].category-social { overflow: hidden; } -@media screen and (max-width: calc(@phone - 0.5px)) { - .numbered_pagination { - display: none; - } -} - .page_number { - background: none !important; - border: none !important; + background: transparent !important; color: var(--color-result-link-font) !important; - text-decoration: underline !important; - cursor: pointer !important; + text-decoration: underline; } .page_number_current { - background: none !important; - border: none !important; - color: var(--color-result-link-visited-font) !important; - text-decoration: none !important; - cursor: pointer !important; + background: transparent; + color: var(--color-result-link-visited-font); + border: none; } #apis { @@ -1039,6 +1029,10 @@ article[data-vim-selected].category-social { background-color: var(--color-sidebar-background); } + .numbered_pagination { + display: none; + } + .result-paper { .attributes { display: block; -- cgit v1.2.3