From 0b28146e15a734b626b518ab0a6eafd1814aeedd Mon Sep 17 00:00:00 2001
From: RD WebDesign <github@rdwebdesign.com.br>
Date: Tue, 14 Nov 2023 15:42:38 -0300
Subject: [PATCH 1/3] Keep the text on the same line, even in smaller screens

- Add a row with `display:flex` to avoid the line break

Signed-off-by: RD WebDesign <github@rdwebdesign.com.br>
---
 settings-privacy.lp | 6 +++---
 style/pi-hole.css   | 9 +++++++++
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/settings-privacy.lp b/settings-privacy.lp
index 59d6875e..39491cc1 100644
--- a/settings-privacy.lp
+++ b/settings-privacy.lp
@@ -51,15 +51,15 @@ mg.include('scripts/pi-hole/lua/settings_header.lp','r')
                                     <input type="checkbox" id="database.DBexport" data-key="database.DBexport" title="log-queries">
                                     <label for="database.DBexport"><strong>Should FTL store queries in the database?</strong></label>
                                 </div>
-                                <div>
+                                <div class="row-flex">
                                     <input type="number" id="database.maxDBdays" data-key="database.maxDBdays" data-type="integer" value="" min="0" step="10" style="width: 5em;">
                                     <label for="database.maxDBdays"><strong>Maximum number of days to keep queries in the database</strong></label>
                                 </div>
-                                <div>
+                                <div class="row-flex">
                                     <input type="number" id="database.network.expire" data-key="database.network.expire" data-type="integer" value="" min="0" step="10" style="width: 5em;">
                                     <label for="database.network.expire"><strong>How long should IP addresses be kept in the network_addresses table [days]?</strong></label>
-                                    <p>IP addresses (and associated host names) older than the specified number of days are removed to avoid dead entries in the network overview table.</p>
                                 </div>
+                                <p>IP addresses (and associated host names) older than the specified number of days are removed to avoid dead entries in the network overview table.</p>
                             </div>
                         </div>
                     </div>
diff --git a/style/pi-hole.css b/style/pi-hole.css
index 662a3366..3a2ab5ec 100644
--- a/style/pi-hole.css
+++ b/style/pi-hole.css
@@ -1404,3 +1404,12 @@ table.dataTable tbody > tr > .selected {
   display: none;
   margin-top: -1px;
 }
+
+/* General layout - Row containing flex elements */
+.row-flex {
+  display: flex;
+  flex-direction: row;
+  gap: 0.5em;
+  margin: 0.5em 0;
+  align-items: start;
+}

From c8858320875fff6d8b6e5d888b1c5cbaa0dd9daa Mon Sep 17 00:00:00 2001
From: RD WebDesign <github@rdwebdesign.com.br>
Date: Tue, 14 Nov 2023 17:18:36 -0300
Subject: [PATCH 2/3] Add a line break between the checkboxes and the number of
 days selector

Signed-off-by: RD WebDesign <github@rdwebdesign.com.br>
---
 settings-privacy.lp | 1 +
 1 file changed, 1 insertion(+)

diff --git a/settings-privacy.lp b/settings-privacy.lp
index 39491cc1..f2aeed7b 100644
--- a/settings-privacy.lp
+++ b/settings-privacy.lp
@@ -51,6 +51,7 @@ mg.include('scripts/pi-hole/lua/settings_header.lp','r')
                                     <input type="checkbox" id="database.DBexport" data-key="database.DBexport" title="log-queries">
                                     <label for="database.DBexport"><strong>Should FTL store queries in the database?</strong></label>
                                 </div>
+                                <br>
                                 <div class="row-flex">
                                     <input type="number" id="database.maxDBdays" data-key="database.maxDBdays" data-type="integer" value="" min="0" step="10" style="width: 5em;">
                                     <label for="database.maxDBdays"><strong>Maximum number of days to keep queries in the database</strong></label>

From 1778a8a6507a36ff284c68efcb2f4925b17fff1f Mon Sep 17 00:00:00 2001
From: RD WebDesign <github@rdwebdesign.com.br>
Date: Tue, 14 Nov 2023 17:40:43 -0300
Subject: [PATCH 3/3] Fix indentation of paragraphs inside icheck elements

Signed-off-by: RD WebDesign <github@rdwebdesign.com.br>
---
 style/pi-hole.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/style/pi-hole.css b/style/pi-hole.css
index 3a2ab5ec..295ed48b 100644
--- a/style/pi-hole.css
+++ b/style/pi-hole.css
@@ -680,6 +680,11 @@ li:not(.menu-open) .treeview-menu .warning-count {
   border-color: #3c8dbc;
 }
 
+/* Fix indentation of <p> elements inside icheck elements */
+[class*="icheck-"] > label + p {
+  padding-left: 29px;
+}
+
 /* Fix some datatables layout on small screens */
 @media screen and (max-width: 660px), screen and (min-width: 767px) and (max-width: 960px) {
   #domainsTable_wrapper .table-responsive {