From 38789f82db4bfbeafa8b4e98e082a2ba6fb1d384 Mon Sep 17 00:00:00 2001 From: vantezzen Date: Wed, 16 Oct 2019 10:26:32 +0200 Subject: Add custom CSS for darkmode to fix WhatsApp and Threema QR codes --- src/webview/darkmode/custom.js | 22 ++++++++++++++++++++++ src/webview/recipe.js | 7 +++++-- 2 files changed, 27 insertions(+), 2 deletions(-) create mode 100644 src/webview/darkmode/custom.js diff --git a/src/webview/darkmode/custom.js b/src/webview/darkmode/custom.js new file mode 100644 index 000000000..4b2b89fb2 --- /dev/null +++ b/src/webview/darkmode/custom.js @@ -0,0 +1,22 @@ +// CSS for pages that need custom styles to work correctly in darkmode +export default { + 'web.whatsapp.com': ` + div.landing-window > div.landing-main { + background-color: #FFFFFF !important; + } + div.landing-window > div.landing-main * { + color: #212121 !important; + } + `, + 'web.threema.ch': ` + .scan { + background-color: #FFF; + } + .scan * { + color: #212121; + } + .scan input.md-input { + color: #212121; + } + ` +}; diff --git a/src/webview/recipe.js b/src/webview/recipe.js index 3f2338b68..854cbce58 100644 --- a/src/webview/recipe.js +++ b/src/webview/recipe.js @@ -10,6 +10,7 @@ import { } from 'darkreader'; import ignoreList from './darkmode/ignore'; +import customDarkModeCss from './darkmode/custom'; import RecipeWebview from './lib/RecipeWebview'; @@ -116,7 +117,7 @@ class RecipeController { this.cldIdentifier.destroy(); } } - + if (this.settings.service.isDarkModeEnabled || this.settings.app.darkMode) { debug('Enable dark mode'); @@ -128,7 +129,9 @@ class RecipeController { injectDarkModeStyle(this.settings.service.recipe.path); } else if (!ignoreList.includes(window.location.host)) { // Use darkreader instead - enableDarkMode(); + enableDarkMode({}, { + css: customDarkModeCss[window.location.host] || '' + }); } } else { debug('Remove dark mode'); -- cgit v1.2.3-70-g09d2