vh/NetAlertX
1
0
Fork 0
mirror of https://github.com/jokob-sk/NetAlertX.git synced 2025-12-07 09:36:05 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Implement ui theme selector

Browse Source
This commit is contained in:
johnwang16
2024-10-18 22:08:58 -04:00
parent 7dd77e06d4
commit aa1a18015d
13 changed files with 84 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
front/css/app.css
View File

@@ -215,7 +215,7 @@
body
{
background-image: url('img/background.png');
background-image: url('../img/background.png');
}
/* -----------------------------------------------------------------------------

2
front/css/dark-patch.css
View File

@@ -18,7 +18,7 @@ html {
}
body {
background-image: url('img/boxed-bg-dark.png') !important;
background-image: url('../img/boxed-bg-dark.png') !important;
}
body, .bg-yellow, .callout.callout-warning, .alert-warning, .label-warning, .modal-warning .modal-body {

21
front/css/system-dark-patch-cal.css Executable file
View File

@@ -0,0 +1,21 @@
@media (prefers-dark-scheme: dark) {
.fc-sat {
background-color: #444D56; }
.fc-sun {
background-color: #444D56; }
.fc-today {
background-color: #8D9AAC !important;
border: none !important;
}
.fc-cell-content {
background-color: #272c30;
}
.fc-widget-header {
background-color: #353c42;
}
.fc-unthemed .fc-content, .fc-unthemed .fc-divider, .fc-unthemed .fc-list-heading td, .fc-unthemed .fc-list-view, .fc-unthemed .fc-popover, .fc-unthemed .fc-row, .fc-unthemed tbody, .fc-unthemed td, .fc-unthemed th, .fc-unthemed thead{
border-color: #353c42 !important;
}
}

2
front/css/system-dark-patch.css
View File

@@ -20,7 +20,7 @@
}
body {
background-image: url('img/boxed-bg-dark.png') !important;
background-image: url('../img/boxed-bg-dark.png') !important;
}
body, .bg-yellow, .callout.callout-warning, .alert-warning, .label-warning, .modal-warning .modal-body {

10
front/deviceDetails.php
View File

@@ -641,8 +641,14 @@
<!-- Dark-Mode Patch -->
<?php
if ($ENABLED_DARKMODE === True) {
echo '<link rel="stylesheet" href="css/dark-patch-cal.css">';
switch ($UI_THEME) {
case "Dark":
echo '<link rel="stylesheet" href="css/dark-patch-cal.css">';
break;
case "System":
echo '<link rel="stylesheet" href="css/system-dark-patch-cal.css">';
break;
}
?>

9
front/index.php
View File

@@ -103,8 +103,13 @@ if (isset ($_SESSION["login"]) == FALSE || $_SESSION["login"] != 1)
<!-- Dark-Mode Patch -->
<?php
if ($ENABLED_DARKMODE === True) {
echo '<link rel="stylesheet" href="css/dark-patch.css">';
switch ($UI_THEME) {
case "Dark":
echo '<link rel="stylesheet" href="css/dark-patch.css">';
break;
case "System":
echo '<link rel="stylesheet" href="css/system-dark-patch.css">';
break;
}
?>
<link rel="stylesheet" href="/css/offline-font.css">

24
front/js/common.js
View File

@@ -1186,18 +1186,24 @@ function hideUIelements(settingKey) {
// -----------------------------------------------------------------------------
// apply dark mode
// apply theme
$(document).ready(function() {
// Assume getSetting is a function that returns true or false for dark mode
if (getSetting("UI_dark_mode") === "True") {
// Add the dark mode stylesheet
setCookie("UI_dark_mode", "True")
$('head').append('<link rel="stylesheet" href="css/dark-patch.css">');
// Set the background image for dark mode
let theme = getSetting("UI_theme");
if (theme) {
theme = theme.replace("['","").replace("']","");
// Add the theme stylesheet
setCookie("UI_theme", theme);
switch(theme) {
case "Dark":
$('head').append('<link rel="stylesheet" href="css/dark-patch.css">');
break;
case "System":
$('head').append('<link rel="stylesheet" href="css/system-dark-patch.css">');
break
}
} else {
setCookie("UI_dark_mode", "False")
// Set the background image for light mode
setCookie("UI_theme", "Light");
}
});

9
front/php/templates/header.php
View File

@@ -73,8 +73,13 @@
<!-- Dark-Mode Patch -->
<?php
if ($ENABLED_DARKMODE === True) {
echo '<link rel="stylesheet" href="css/dark-patch.css">';
switch ($UI_THEME) {
case "Dark":
echo '<link rel="stylesheet" href="css/dark-patch.css">';
break;
case "System":
echo '<link rel="stylesheet" href="css/system-dark-patch.css">';
break;
}
?>

8
front/php/templates/skinUI.php
View File

@@ -4,12 +4,12 @@
// ## GUI settings processing start
// ###################################
if( isset($_COOKIE['UI_dark_mode']))
if( isset($_COOKIE['UI_theme']))
{
$ENABLED_DARKMODE = $_COOKIE['UI_dark_mode'] == "True";
$UI_THEME = $_COOKIE['UI_theme'];
}else
{
$ENABLED_DARKMODE = False;
$UI_THEME = "Light";
}
$pia_skin_selected = 'skin-blue';
@@ -18,4 +18,4 @@ $pia_skin_selected = 'skin-blue';
// ## GUI settings processing end
// ###################################
?>
?>

16
front/plugins/ui_settings/config.json
View File

@@ -461,30 +461,30 @@
]
},
{
"function": "dark_mode",
"function": "theme",
"type": {
"dataType": "boolean",
"dataType": "array",
"elements": [
{
"elementType": "input",
"elementOptions": [{ "type": "checkbox" }],
"elementType": "select",
"elementOptions": [{ "multiple": "false", "orderable": "false" }],
"transformers": []
}
]
},
"default_value": false,
"options": [],
"default_value": "Light",
"options": ["Light","Dark","System"],
"localized": ["name", "description"],
"name": [
{
"language_code": "en_us",
"string": "Dark mode"
"string": "Theme"
}
],
"description": [
{
"language_code": "en_us",
"string": "Enable dark mode."
"string": "UI theme to use. System will auto switch between Light and Dark."
}
]
}

10
front/presence.php
View File

@@ -216,8 +216,14 @@
<!-- Dark-Mode Patch -->
<?php
if ($ENABLED_DARKMODE === True) {
echo '<link rel="stylesheet" href="css/dark-patch-cal.css">';
switch ($UI_THEME) {
case "Dark":
echo '<link rel="stylesheet" href="css/dark-patch-cal.css">';
break;
case "System":
echo '<link rel="stylesheet" href="css/system-dark-patch-cal.css">';
break;
}
?>