[education/rkward] rkward/windows: Support arbitrary color theme in HTML viewer, instead of just light or dark.
Thomas Friedrichsmeier
null at kde.org
Fri Apr 1 21:54:53 BST 2022
Git commit 7023c0e72ed714a78520d6cd6037755cb1fbbabc by Thomas Friedrichsmeier.
Committed on 01/04/2022 at 20:54.
Pushed by tfry into branch 'master'.
Support arbitrary color theme in HTML viewer, instead of just light or dark.
M +21 -24 rkward/windows/rkhtmlwindow.cpp
https://invent.kde.org/education/rkward/commit/7023c0e72ed714a78520d6cd6037755cb1fbbabc
diff --git a/rkward/windows/rkhtmlwindow.cpp b/rkward/windows/rkhtmlwindow.cpp
index 04113184..c948f3e6 100644
--- a/rkward/windows/rkhtmlwindow.cpp
+++ b/rkward/windows/rkhtmlwindow.cpp
@@ -315,33 +315,30 @@ RKHTMLWindow::RKHTMLWindow (QWidget *parent, WindowMode mode) : RKMDIWindow (par
QWebEngineProfile::defaultProfile ()->installUrlSchemeHandler ("help", new RKWebEngineKIOForwarder (RKWardMainWindow::getMain()));
}
#endif
- // See https://bugreports.qt.io/browse/QTBUG-89753
- // Our CSS files try to support dark mode, automatically, but important versions of QWebEnginePage fail to honor the prefers-color-scheme selector
- // To help those, apply the corresponding color values via javascript.
- bool is_dark = (KColorScheme(QPalette::Normal).background().color().lightnessF() < .5); // <<- HACK to detect dark mode
- if (is_dark) {
- QString color_scheme_js = QStringLiteral("function rksetcolor(name, value) { document.querySelector(':root').style.setProperty(name, value); }\n"
- "rksetcolor('--regular-text-color', 'white');\n"
- "rksetcolor('--background-color', 'black');\n"
- "rksetcolor('--header-color', 'darkgray');\n"
- "rksetcolor('--anchor-color', '#3366ff');");
+ // Apply current color scheme to page. This needs support in the CSS of the page, so will only work for RKWard help and output pages.
+ // Note that the CSS in those pages also has "automatic" support for dark mode ("prefers-color-scheme: dark"; but see https://bugreports.qt.io/browse/QTBUG-89753), however,
+ // for a seamless appearance, the only option is to set the theme colors dynamically, via javascript.
+ auto scheme = KColorScheme(QPalette::Normal);
+ QString color_scheme_js = QStringLiteral("function rksetcolor(name, value) { document.querySelector(':root').style.setProperty(name, value); }\n"
+ "rksetcolor('--regular-text-color', '%1');\n"
+ "rksetcolor('--background-color', '%2');\n"
+ "rksetcolor('--header-color', '%3');\n"
+ "rksetcolor('--anchor-color', '%4');").arg(scheme.foreground().color().name(), scheme.background().color().name(), scheme.foreground(KColorScheme::VisitedText).color().name(), scheme.foreground(KColorScheme::LinkText).color().name());
#ifdef NO_QT_WEBENGINE
- connect(page, &RKWebPage::loadFinished, [this, color_scheme_js](){
- page->mainFrame()->evaluateJavaScript(color_scheme_js);
- });
+ connect(page, &RKWebPage::loadFinished, [this, color_scheme_js](){
+ page->mainFrame()->evaluateJavaScript(color_scheme_js);
+ });
#else
- auto p = QWebEngineProfile::defaultProfile();
- QWebEngineScript fix_color_scheme;
- QString id = QStringLiteral("fix_color_scheme");
- if (p->scripts()->findScript(id).isNull()) {
- fix_color_scheme.setName(id);
- fix_color_scheme.setInjectionPoint(QWebEngineScript::DocumentReady);
- fix_color_scheme.setSourceCode(color_scheme_js);
- p->scripts()->insert(fix_color_scheme);
- }
- //page->setBackgroundColor(Qt::black); // avoids brief white blink while loading, but is too risky on pages that are not dark scheme aware.
+ auto p = QWebEngineProfile::defaultProfile();
+ QWebEngineScript fix_color_scheme;
+ QString id = QStringLiteral("fix_color_scheme");
+ p->scripts()->remove(p->scripts()->findScript(id)); // remove any existing variant of the script. It might have been created for the wrong theme.
+ fix_color_scheme.setName(id);
+ fix_color_scheme.setInjectionPoint(QWebEngineScript::DocumentReady);
+ fix_color_scheme.setSourceCode(color_scheme_js);
+ p->scripts()->insert(fix_color_scheme);
+ //page->setBackgroundColor(scheme.background().color()); // avoids brief white blink while loading, but is too risky on pages that are not dark scheme aware.
#endif
- }
layout->addWidget (findbar);
findbar->hide ();
More information about the rkward-tracker
mailing list