github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-06-24 17:46:28 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

DEV: Add app event triggers for interface color changes (#31558)

Browse Source
This commit is contained in:
Jean
2025-02-28 12:08:42 -04:00
committed by GitHub
parent 56a0b17b12
commit cbdd28321e
1 changed files with 5 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
app/assets/javascripts/discourse/app/services/interface-color.js
View File

@ -7,6 +7,7 @@ const DARK = "dark";
const LIGHT = "light"; const LIGHT = "light";
export default class InterfaceColor extends Service { export default class InterfaceColor extends Service {
@service appEvents;
@service siteSettings; @service siteSettings;
@service session; @service session;
@tracked forcedColorMode; @tracked forcedColorMode;
@ -68,6 +69,7 @@ export default class InterfaceColor extends Service {
darkStylesheet.media = "none"; darkStylesheet.media = "none";
} }
} }
this.appEvents.trigger("interface-color:changed", LIGHT);
} }
forceDarkMode({ flipStylesheets = true } = {}) { forceDarkMode({ flipStylesheets = true } = {}) {
@ -85,6 +87,7 @@ export default class InterfaceColor extends Service {
darkStylesheet.media = "all"; darkStylesheet.media = "all";
} }
} }
this.appEvents.trigger("interface-color:changed", DARK);
} }
removeColorModeOverride() { removeColorModeOverride() {
@ -94,11 +97,13 @@ export default class InterfaceColor extends Service {
const lightStylesheet = this.#lightColorsStylesheet(); const lightStylesheet = this.#lightColorsStylesheet();
if (lightStylesheet) { if (lightStylesheet) {
lightStylesheet.media = "(prefers-color-scheme: light)"; lightStylesheet.media = "(prefers-color-scheme: light)";
this.appEvents.trigger("interface-color:changed", LIGHT);
} }
const darkStylesheet = this.#darkColorsStylesheet(); const darkStylesheet = this.#darkColorsStylesheet();
if (darkStylesheet) { if (darkStylesheet) {
darkStylesheet.media = "(prefers-color-scheme: dark)"; darkStylesheet.media = "(prefers-color-scheme: dark)";
this.appEvents.trigger("interface-color:changed", DARK);
} }
} }