WebUI: fix color scheme for iframes

A backport of #21750 as a follow up to #21748.

Original PR #21750.
PR #21810.
This commit is contained in:
Hanabishi 2024-11-11 16:03:40 +05:00 committed by GitHub
parent 1e27e6504e
commit 9ab3c573dc
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
26 changed files with 124 additions and 35 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" />
@ -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>
</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

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

@ -29,6 +29,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>
"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>
"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

@ -1667,19 +1667,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>
</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

@ -381,6 +381,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>