diff --git a/qt/aqt/clayout.py b/qt/aqt/clayout.py index aa1c36c0f..b3a44e48e 100644 --- a/qt/aqt/clayout.py +++ b/qt/aqt/clayout.py @@ -344,6 +344,10 @@ class CardLayout(QDialog): def on_night_mode_action_toggled(self) -> None: self.night_mode_is_enabled = not self.night_mode_is_enabled + force = json.dumps(self.night_mode_is_enabled) + self.preview_web.eval( + f"document.documentElement.classList.toggle('night-mode', {force});" + ) self.on_preview_toggled() def on_mobile_class_action_toggled(self) -> None: diff --git a/qt/aqt/data/web/css/reviewer.scss b/qt/aqt/data/web/css/reviewer.scss index 1d35ef397..a39fca0fa 100644 --- a/qt/aqt/data/web/css/reviewer.scss +++ b/qt/aqt/data/web/css/reviewer.scss @@ -8,6 +8,7 @@ hr { body { margin: 20px; overflow-wrap: break-word; + background-color: var(--window-bg); } // explicit nightMode definition required diff --git a/qt/aqt/theme.py b/qt/aqt/theme.py index 10970b53c..75a10e96f 100644 --- a/qt/aqt/theme.py +++ b/qt/aqt/theme.py @@ -35,6 +35,7 @@ class ThemeManager: _icon_cache_dark: Dict[str, QIcon] = {} _icon_size = 128 _dark_mode_available: Optional[bool] = None + default_palette: Optional[QPalette] = None # Qt applies a gradient to the buttons in dark mode # from about #505050 to #606060. @@ -133,6 +134,7 @@ class ThemeManager: return QColor(self.color(colors)) def apply_style(self, app: QApplication) -> None: + self.default_palette = app.style().standardPalette() self._apply_palette(app) self._apply_style(app) diff --git a/qt/aqt/webview.py b/qt/aqt/webview.py index 6b01df6d9..ccfd86c88 100644 --- a/qt/aqt/webview.py +++ b/qt/aqt/webview.py @@ -215,7 +215,10 @@ class AnkiWebView(QWebEngineView): QWebEngineView.__init__(self, parent=parent) self.set_title(title) self._page = AnkiWebPage(self._onBridgeCmd) - self._page.setBackgroundColor(self._getWindowColor()) # reduce flicker + # reduce flicker + self._page.setBackgroundColor( + self.get_window_bg_color(theme_manager.night_mode) + ) # in new code, use .set_bridge_command() instead of setting this directly self.onBridgeCmd: Callable[[str], Any] = self.defaultOnBridgeCmd @@ -388,16 +391,17 @@ class AnkiWebView(QWebEngineView): else: return 3 - def _getWindowColor(self) -> QColor: - if theme_manager.night_mode: - return theme_manager.qcolor(colors.WINDOW_BG) - if isMac: + def get_window_bg_color(self, night_mode: bool) -> QColor: + if night_mode: + return QColor(colors.WINDOW_BG[1]) + elif isMac: # standard palette does not return correct window color on macOS return QColor("#ececec") - return self.style().standardPalette().color(QPalette.Window) + else: + return theme_manager.default_palette.color(QPalette.Window) def standard_css(self) -> str: - palette = self.style().standardPalette() + palette = theme_manager.default_palette color_hl = palette.color(QPalette.Highlight).name() if isWin: @@ -437,7 +441,10 @@ div[contenteditable="true"]:focus { } zoom = self.zoomFactor() - background = self._getWindowColor().name() + + window_bg_day = self.get_window_bg_color(False).name() + window_bg_night = self.get_window_bg_color(True).name() + body_bg = window_bg_night if theme_manager.night_mode else window_bg_day if is_rtl(anki.lang.currentLang): lang_dir = "rtl" @@ -445,11 +452,11 @@ div[contenteditable="true"]:focus { lang_dir = "ltr" return f""" -body {{ zoom: {zoom}; background: {background}; direction: {lang_dir}; }} +body {{ zoom: {zoom}; background-color: {body_bg}; direction: {lang_dir}; }} html {{ {font} }} {button_style} -:root {{ --window-bg: {background} }} -:root[class*=night-mode] {{ --window-bg: {background} }} +:root {{ --window-bg: {window_bg_day} }} +:root[class*=night-mode] {{ --window-bg: {window_bg_night} }} """ def stdHtml(