Pi-Hole/web
1
0
Fork 0
mirror of https://github.com/pi-hole/web.git synced 2025-12-20 02:38:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Better text and controls layout

Browse Source 
- 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 <github@rdwebdesign.com.br>
This commit is contained in:
RD WebDesign
2024-02-13 15:22:32 -03:00
parent 4fba41bca1
commit 0854c2afef
2 changed files with 16 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
search.lp
View File

@@ -17,7 +17,6 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r')
<div class="col-md-12">
<div class="box">
<div class="box-header">
<!-- domain-search-block - Single search field mobile/desktop -->
<div id="domain-search-block" class="input-group">
<input id="domain" type="url" class="form-control" placeholder="Domain to look for (example.com or sub.example.com)" autocomplete="off" spellcheck="false" autocapitalize="none" autocorrect="off">
<input id="quiet" type="hidden" value="no">
@@ -28,17 +27,17 @@ mg.include('scripts/pi-hole/lua/header_authenticated.lp','r')
</div>
<div class="box-body">
<div class="row">
<div class="col-md-6">
<div class="col-md-4">
<div>
<input type="checkbox" id="partialMatch" data-key="partialMatch">
<label for="partialMatch"><strong>Use partial matching</strong></label>
</div>
</div>
<div class="col-md-6">
<!-- /domain-search-block -->
<div id="limitbox-block" class="form-inline">
<br class="hidden-md hidden-lg">
<div class="col-md-8">
<div id="domain-limitbox-block" class="form-inline">
<label for="number">Maximum number of results to be returned:&nbsp;</label>
<input class="form-control input-sm" type="number" min="0" value="20" id="number">
<label for="number">Maximum number of results to be returned</label>
</div>
</div>
</div>

11
style/pi-hole.css
View File

@@ -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;
}
}