From 938c6ef383a19ec65557399d80b311b8ee02ce9a Mon Sep 17 00:00:00 2001 From: DL6ER Date: Mon, 12 Feb 2024 12:34:40 +0100 Subject: [PATCH 1/3] Redesign search input field to solve #2701 Signed-off-by: DL6ER --- scripts/pi-hole/js/search.js | 16 ++++++---------- search.lp | 21 +++++++++++++++------ 2 files changed, 21 insertions(+), 16 deletions(-) diff --git a/scripts/pi-hole/js/search.js b/scripts/pi-hole/js/search.js index dae432ec8..9cef84d39 100644 --- a/scripts/pi-hole/js/search.js +++ b/scripts/pi-hole/js/search.js @@ -19,11 +19,13 @@ $(function () { } }); -function eventsource(partial) { +function doSearch() { const ta = $("#output"); // process with the current visible domain input field const q = $("input[id^='domain']:visible").val().trim().toLowerCase(); const N = $("#number").val(); + // Partial matching? + const partial = $("#partialMatch").is(":checked"); if (q.length === 0) { return; @@ -197,17 +199,11 @@ function eventsource(partial) { $("#domain").on("keypress", function (e) { if (e.which === 13) { // Enter was pressed, and the input has focus - eventsource(false); + doSearch(); } }); // Handle search buttons -$("button[id^='btnSearch']").on("click", function () { - var partial = false; - - if (!this.id.match("^btnSearchExact")) { - partial = true; - } - - eventsource(partial); +$("button[id='btnSearch']").on("click", function () { + doSearch(); }); diff --git a/search.lp b/search.lp index cf89465bc..c5511301c 100644 --- a/search.lp +++ b/search.lp @@ -22,16 +22,25 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r') - - +
- -
- - +
+
+
+ + +
+
+
+ +
+ + +
+
From 4fba41bca1921795c283ee458e4cdb0c76501723 Mon Sep 17 00:00:00 2001 From: RD WebDesign Date: Tue, 13 Feb 2024 13:34:23 -0300 Subject: [PATCH 2/3] Remove unused CSS rules Signed-off-by: RD WebDesign --- style/pi-hole.css | 13 ------------- 1 file changed, 13 deletions(-) diff --git a/style/pi-hole.css b/style/pi-hole.css index 4be5c580d..d15e9e48e 100644 --- a/style/pi-hole.css +++ b/style/pi-hole.css @@ -562,19 +562,6 @@ td.details-control { } @media screen and (max-width: 991px) { - #domain-search-block { - display: block; - } - #domain { - margin: 5px 0; - } - #domain-search-block .input-group-btn { - display: inline-block; - } - #domain-search-block .input-group-btn button { - margin: 0 5px 0 0; - border-radius: 3px; - } .settings-container { --number-of-columns: 1; } From 0854c2afef68575b3b6313b7b7e3d95c99744609 Mon Sep 17 00:00:00 2001 From: RD WebDesign Date: Tue, 13 Feb 2024 15:22:32 -0300 Subject: [PATCH 3/3] Better text and controls layout - use 4-8 columns instead of 6-6; - use label before the number control (this will show the label on the previous line, when there is a line break); - right-align second column in larger screens and add small margin; - remove old HTML comments. Signed-off-by: RD WebDesign --- search.lp | 11 +++++------ style/pi-hole.css | 11 +++++++++++ 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/search.lp b/search.lp index c5511301c..7b5a0892e 100644 --- a/search.lp +++ b/search.lp @@ -17,7 +17,6 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r')
-
@@ -28,17 +27,17 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r')
-
+
-
- -
+ +
+
+ -
diff --git a/style/pi-hole.css b/style/pi-hole.css index d15e9e48e..2cf782add 100644 --- a/style/pi-hole.css +++ b/style/pi-hole.css @@ -1465,3 +1465,14 @@ table.dataTable tbody > tr > .selected { overflow-wrap: break-word; inline-size: auto; } + +/* Search page options */ +#domain-limitbox-block { + /* Add margin to match the other component (icheck) height */ + margin: 3px 0; +} +@media (min-width: 992px) { + #domain-limitbox-block { + text-align: right; + } +}