Theme colors are updated to main window now

src/browser/base/content/browser-js.patch

@@ -1,5 +1,5 @@
 diff --git a/browser/base/content/browser.js b/browser/base/content/browser.js
-index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..01ebb483e6d9632588578b8b05195250ca26968a 100644
+index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..3b588199c8ab98157cc423e47fa209d7899d8656 100644
 --- a/browser/base/content/browser.js
 +++ b/browser/base/content/browser.js
 @@ -13,6 +13,15 @@ ChromeUtils.importESModule("resource://gre/modules/NotificationDB.sys.mjs");
@@ -18,7 +18,15 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..01ebb483e6d9632588578b8b05195250
  ChromeUtils.defineESModuleGetters(this, {
    AMTelemetry: "resource://gre/modules/AddonManager.sys.mjs",
    AboutNewTab: "resource:///modules/AboutNewTab.sys.mjs",
-@@ -1735,6 +1744,11 @@ var gBrowserInit = {
+@@ -1610,6 +1619,7 @@ var gBrowserInit = {
+     // Update the chromemargin attribute so the window can be sized correctly.
+     window.TabBarVisibility.update();
+     TabsInTitlebar.init();
++    ZenThemeHandler.init();
+ 
+     new LightweightThemeConsumer(document);
+ 
+@@ -1735,6 +1745,11 @@ var gBrowserInit = {
      }
  
      // Misc. inits.
@@ -30,7 +38,15 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..01ebb483e6d9632588578b8b05195250
      gUIDensity.init();
      TabletModeUpdater.init();
      CombinedStopReload.ensureInitialized();
-@@ -6660,7 +6674,7 @@ function setToolbarVisibility(
+@@ -2489,6 +2504,7 @@ var gBrowserInit = {
+     TabsInTitlebar.uninit();
+ 
+     ToolbarIconColor.uninit();
++    ZenThemeHandler.uninit();
+ 
+     // In certain scenarios it's possible for unload to be fired before onload,
+     // (e.g. if the window is being closed after browser.js loads but before the
+@@ -6660,7 +6676,7 @@ function setToolbarVisibility(
        );
      }
  
@@ -39,7 +55,7 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..01ebb483e6d9632588578b8b05195250
      switch (isVisible) {
        case true:
        case "always":
-@@ -9780,6 +9794,13 @@ var gDialogBox = {
+@@ -9780,6 +9796,13 @@ var gDialogBox = {
      parentElement.style.removeProperty("width");
      parentElement.style.removeProperty("height");
      document.documentElement.setAttribute("window-modal-open", true);
@@ -53,7 +69,7 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..01ebb483e6d9632588578b8b05195250
      // Call this first so the contents show up and get layout, which is
      // required for SubDialog to work.
      parentElement.showModal();
-@@ -10157,3 +10178,15 @@ var FirefoxViewHandler = {
+@@ -10157,3 +10180,45 @@ var FirefoxViewHandler = {
      this.button?.toggleAttribute("attention", shouldShow);
    },
  };
@@ -69,3 +85,33 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..01ebb483e6d9632588578b8b05195250
 +  // TODO: actually use profile data to generate the avatar, instead of just using the name
 +  mainWindowEl.style.setProperty("--avatar-image-url", `url(${profile.zenAvatarPath})`);
 +} 
++
++var ZenThemeHandler = {
++  init() {
++    window.addEventListener("windowlwthemeupdate", this);
++    window.addEventListener("nativethemechange", this);
++    this.executeAllUpdates();
++  },
++
++  uninit() {
++    window.removeEventListener("windowlwthemeupdate", this);
++    window.removeEventListener("nativethemechange", this);
++  },
++
++  handleEvent(event) {
++    this.executeAllUpdates();
++  },
++
++  executeAllUpdates() {
++    this.updateAccentColorPref();
++  },
++
++  updateAccentColorPref() {
++    let root = document.documentElement;
++    const themeAccent = Services.prefs.getStringPref(
++      "zen.theme.accent-color",
++      "#0b57d0"
++    );
++    root.style.setProperty("--zen-primary-color", themeAccent);
++  },
++}