pi-hole/web
1
0
Fork 0
mirror of https://github.com/pi-hole/web.git synced 2024-12-06 19:36:21 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add per-browser boxed layout setting

Browse Source 
Signed-off-by: DL6ER <dl6er@dl6er.de>
This commit is contained in:
DL6ER
2020-05-26 01:16:21 +02:00
committed by Adam Warner
parent 0e4d1e4e7f
commit 7ff5764f95
4 changed files with 48 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scripts/pi-hole/js/footer.js
+19 -1
View File
@@ -130,8 +130,24 @@ function applyCheckboxRadioStyle() {
if (chkboxStyle === null) {
chkboxStyle = "material-blue";
}
$("input[type='radio'],input[type='checkbox']").parent().removeClass();
$("input[type='radio'],input[type='checkbox']").parent().addClass("icheck-" + chkboxStyle);
$("input[type='radio'],input[type='checkbox']")
.parent()
.addClass("icheck-" + chkboxStyle);
}
function applyBoxedLayout() {
var boxedlayout = localStorage.getItem("boxedlayout");
if (boxedlayout === null) {
boxedlayout = true;
}
if (boxedlayout === true) {
$("body").addClass("layout-boxed");
} else {
$("body").removeClass("layout-boxed");
}
}
$(function () {
@@ -146,7 +162,9 @@ $(function () {
$("#cookieInfo").show();
}
// Apply per-browser styling settings
applyCheckboxRadioStyle();
applyBoxedLayout();
// Run check immediately after page loading ...
checkMessages();
scripts/pi-hole/js/settings.js
+20 -1
View File
@@ -5,7 +5,7 @@
* This file is copyright under the latest version of the EUPL.
* Please see LICENSE file for your rights under this license. */
/* global utils:false */
/* global utils:false, applyCheckboxRadioStyle:false, applyBoxedLayout:false */
$(function () {
$("[data-static]").on("click", function () {
@@ -281,10 +281,29 @@ $(function () {
if (iCheckStyle === null) {
iCheckStyle = "material-blue";
}
iCheckSelect.val(iCheckStyle);
iCheckSelect.change(function () {
localStorage.setItem("theme_icheck", iCheckSelect.val());
applyCheckboxRadioStyle();
});
// boxed style toggle
var boxedlayout = $("#boxedlayout");
chkboxData = localStorage.getItem("boxedlayout");
if (chkboxData !== null) {
// Restore checkbox state
boxedlayout.prop("checked", chkboxData === "true");
} else {
// Initialize checkbox
boxedlayout.prop("checked", true);
localStorage.setItem("boxedlayout", true);
}
boxedlayout.click(function () {
localStorage.setItem("boxedlayout", boxedlayout.prop("checked"));
applyBoxedLayout();
});
});
scripts/pi-hole/php/header.php
+1 -30
View File
@@ -130,35 +130,6 @@
$token = $_SESSION['token'];
}
if(isset($setupVars['WEBUIBOXEDLAYOUT']))
{
if($setupVars['WEBUIBOXEDLAYOUT'] === "boxed")
{
$boxedlayout = true;
}
else
{
$boxedlayout = false;
}
}
else
{
$boxedlayout = true;
}
// Override layout setting if layout is changed via Settings page
if(isset($_POST["field"]))
{
if($_POST["field"] === "webUI" && isset($_POST["boxedlayout"]))
{
$boxedlayout = true;
}
elseif($_POST["field"] === "webUI" && !isset($_POST["boxedlayout"]))
{
$boxedlayout = false;
}
}
function pidofFTL()
{
return shell_exec("pidof pihole-FTL");
@@ -227,7 +198,7 @@
<script src="scripts/vendor/moment.min.js"></script>
<script src="scripts/vendor/Chart.min.js"></script>
</head>
<body class="hold-transition sidebar-mini <?php if($boxedlayout){ ?>layout-boxed<?php } ?>">
<body class="hold-transition sidebar-mini">
<noscript>
<!-- JS Warning -->
<div>
settings.php
+8 -4
View File
@@ -1113,10 +1113,6 @@ if (isset($_GET['tab']) && in_array($_GET['tab'], array("sysadmin", "adlists", "
<div class="col-md-12">
<h4>Interface appearance</h4>
<?php theme_selection(); ?>
<div>
<input type="checkbox" name="boxedlayout" id="boxedlayout" value="yes" <?php if ($boxedlayout){ ?>checked<?php } ?>>
<label for="boxedlayout"><strong>Use boxed layout (for large screens)</strong></label>
</div>
<h4>CPU Temperature Unit</h4>
<div>
<input type="radio" name="tempunit" value="C" id="tempunit_C" <?php if ($temperatureunit === "C"){ ?>checked<?php } ?>>
@@ -1182,6 +1178,14 @@ if (isset($_GET['tab']) && in_array($_GET['tab'], array("sysadmin", "adlists", "
</select>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div>
<input type="checkbox" id="boxedlayout">
<label for="boxedlayout"><strong>Use boxed layout (for large screens)</strong></label>
</div>
</div>
</div>
</div>
</div>
</div>