WebUI: fix color scheme for iframes

Applies the color scheme for iframe dialogs.

Fixup for #21613.
PR #21750.
This commit is contained in:
Hanabishi 2024-11-09 13:02:28 +05:00 committed by GitHub
parent fe153f8919
commit 06fe3e5fb0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
29 changed files with 133 additions and 38 deletions

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -8,6 +8,8 @@
<link rel="stylesheet" href="css/Window.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/download.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script src="scripts/pathAutofill.js?v=${CACHEID}"></script>

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -8,6 +8,8 @@
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/mocha.min.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/speedslider.js?v=${CACHEID}"></script>
</head>

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -28,6 +28,7 @@
<script defer src="scripts/lib/mocha.min.js"></script>
<script defer src="scripts/cache.js?v=${CACHEID}"></script>
<script defer src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script defer src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script defer src="scripts/mocha-init.js?locale=${LANG}&v=${CACHEID}"></script>
<script defer src="scripts/lib/clipboard.min.js"></script>
<script defer src="scripts/filesystem.js?v=${CACHEID}"></script>

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script src="scripts/pathAutofill.js?v=${CACHEID}"></script>
<script>

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script src="scripts/pathAutofill.js?v=${CACHEID}"></script>
<script>

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script src="scripts/filesystem.js?v=${CACHEID}"></script>
<script>

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1760,19 +1760,6 @@ window.addEventListener("load", () => {
window.qBittorrent.Cache.preferences.init();
window.qBittorrent.Cache.qbtVersion.init();
// Setup color scheme switching
const colorSchemeQuery = window.matchMedia("(prefers-color-scheme: dark)");
const updateColorScheme = () => {
const root = document.documentElement;
const colorScheme = LocalPreferences.get("color_scheme");
const validScheme = (colorScheme === "light") || (colorScheme === "dark");
const isDark = colorSchemeQuery.matches;
root.classList.toggle("dark", ((!validScheme && isDark) || (colorScheme === "dark")));
};
colorSchemeQuery.addEventListener("change", updateColorScheme);
updateColorScheme();
// switch to previously used tab
const previouslyUsedTab = LocalPreferences.get("selected_window_tab", "transfers");
switch (previouslyUsedTab) {

View file

@ -0,0 +1,56 @@
/*
* Bittorrent Client using Qt and libtorrent.
* Copyright (C) 2024 sledgehammer999 <hammered999@gmail.com>
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License
* as published by the Free Software Foundation; either version 2
* of the License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program; if not, write to the Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*
* In addition, as a special exception, the copyright holders give permission to
* link this program with the OpenSSL project's "OpenSSL" library (or with
* modified versions of it that use the same license as the "OpenSSL" library),
* and distribute the linked executables. You must obey the GNU General Public
* License in all respects for all of the code used other than "OpenSSL". If you
* modify file(s), you may extend this exception to your version of the file(s),
* but you are not obligated to do so. If you do not wish to do so, delete this
* exception statement from your version.
*/
"use strict";
window.qBittorrent ??= {};
window.qBittorrent.ColorScheme ??= (() => {
const exports = () => {
return {
update,
};
};
const LocalPreferences = new window.qBittorrent.LocalPreferences.LocalPreferencesClass();
const colorSchemeQuery = window.matchMedia("(prefers-color-scheme: dark)");
const update = () => {
const root = document.documentElement;
const colorScheme = LocalPreferences.get("color_scheme");
const validScheme = (colorScheme === "light") || (colorScheme === "dark");
const isDark = colorSchemeQuery.matches;
root.classList.toggle("dark", ((!validScheme && isDark) || (colorScheme === "dark")));
};
colorSchemeQuery.addEventListener("change", update);
return exports();
})();
Object.freeze(window.qBittorrent.ColorScheme);
window.qBittorrent.ColorScheme.update();

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/misc.js?locale=${LANG}&v=${CACHEID}"></script>
<script>
"use strict";

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -7,6 +7,8 @@
<link rel="stylesheet" href="css/style.css?v=${CACHEID}" type="text/css">
<link rel="stylesheet" href="css/Window.css?v=${CACHEID}" type="text/css">
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/download.js?v=${CACHEID}"></script>
<script src="scripts/pathAutofill.js?v=${CACHEID}"></script>
</head>

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="${LANG}">
<html lang="${LANG}" class="dark">
<head>
<meta charset="UTF-8">
@ -8,6 +8,8 @@
<script src="scripts/lib/MooTools-Core-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/MooTools-More-1.6.0-compat-compressed.js"></script>
<script src="scripts/lib/mocha.min.js"></script>
<script src="scripts/localpreferences.js?v=${CACHEID}"></script>
<script src="scripts/color-scheme.js?v=${CACHEID}"></script>
<script src="scripts/speedslider.js?v=${CACHEID}"></script>
</head>

View file

@ -393,6 +393,7 @@
<file>private/rename_rule.html</file>
<file>private/scripts/cache.js</file>
<file>private/scripts/client.js</file>
<file>private/scripts/color-scheme.js</file>
<file>private/scripts/contextmenu.js</file>
<file>private/scripts/download.js</file>
<file>private/scripts/dynamicTable.js</file>