Elgato_dark/bunkerweb
1
0
Fork 0
mirror of https://github.com/bunkerity/bunkerweb synced 2026-05-24 09:28:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Refactor CSS transitions for smoother effects and update HTML to support dynamic theme attributes

Browse source
This commit is contained in:
Théophile Diot 2024-11-12 15:53:19 +01:00
parent c6d5061cd4
commit a0996041d4
No known key found for this signature in database
GPG key ID: FA995104A0BA376A
5 changed files with 18 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/ui/app/static/css/overrides.css
View file

@ -1215,3 +1215,13 @@ html[dir="rtl"].dark-style .border-primary {
.dark-style table.table.dataTable > tbody > tr.selected a {
color: initial !important;
}
.dark-style div.dts div.dt-scroll-body table,
.dark-style div.dts div.dataTables_scrollBody table {
background-color: #0c283a;
}
.dark-style .form-floating > :disabled ~ label,
.dark-style .form-floating > .form-control:disabled ~ label {
color: #9caeb7;
}

2
src/ui/app/static/js/pages/login.js
View file

@ -30,6 +30,7 @@ $(document).ready(() => {
.addClass("bg-dark-subtle")
.removeClass("bg-light-subtle");
$("#dark-mode-toggle").prop("checked", true);
$("html").attr("data-bs-theme", "dark");
} else {
$("html").removeClass("dark-style").addClass("light-style");
$(".bs-toast.bg-dark").addClass("bg-white").removeClass("bg-dark");
@ -37,6 +38,7 @@ $(document).ready(() => {
.addClass("bg-light-subtle")
.removeClass("bg-dark-subtle");
$("#dark-mode-toggle").prop("checked", false);
$("html").attr("data-bs-theme", null);
}
// Update input values

2
src/ui/app/static/js/pages/services.js
View file

@ -423,7 +423,7 @@ $(function () {
targets: 5,
},
],
order: [[1, "desc"]],
order: [[1, "asc"]],
autoFill: false,
responsive: true,
select: {

3
src/ui/app/static/js/utils.js
View file

@ -438,6 +438,7 @@ $(document).ready(() => {
$(".bg-light-subtle")
.addClass("bg-dark-subtle")
.removeClass("bg-light-subtle");
$("html").attr("data-bs-theme", "dark");
} else {
$("html").removeClass("dark-style").addClass("light-style");
$(".btn-outline-light")
@ -448,6 +449,7 @@ $(document).ready(() => {
$(".bg-dark-subtle")
.addClass("bg-light-subtle")
.removeClass("bg-dark-subtle");
$("html").attr("data-bs-theme", null);
}
$("#theme").val(darkMode ? "dark" : "light");
@ -457,6 +459,7 @@ $(document).ready(() => {
.replace(/\/profile$/, "/set_theme");
const csrfToken = $("#csrf_token").val();
const theme = darkMode ? "dark" : "light";
localStorage.setItem("theme", theme); // Save user preference
const data = new FormData();
data.append("theme", theme);

3
src/ui/app/templates/base.html
View file

@ -25,7 +25,8 @@
<!DOCTYPE html>
<html lang="en"
class="{{ current_user.theme }}-style layout-navbar-fixed layout-menu-fixed"
data-theme="theme-default">
data-theme="theme-default"
{% if current_user.theme == 'dark' %}data-bs-theme="dark"{% endif %}>
<head>
<meta charset="utf-8" />
<meta name="viewport"