Changed the UI to a new refreshed one

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..3b588199c8ab98157cc423e47fa209d7899d8656 100644
+index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..01ebb483e6d9632588578b8b05195250ca26968a 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,15 +18,7 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..3b588199c8ab98157cc423e47fa209d7
  ChromeUtils.defineESModuleGetters(this, {
    AMTelemetry: "resource://gre/modules/AddonManager.sys.mjs",
    AboutNewTab: "resource:///modules/AboutNewTab.sys.mjs",
-@@ -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 = {
+@@ -1735,6 +1744,11 @@ var gBrowserInit = {
      }
  
      // Misc. inits.
@@ -38,15 +30,7 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..3b588199c8ab98157cc423e47fa209d7
      gUIDensity.init();
      TabletModeUpdater.init();
      CombinedStopReload.ensureInitialized();
-@@ -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(
+@@ -6660,7 +6674,7 @@ function setToolbarVisibility(
        );
      }
  
@@ -55,7 +39,7 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..3b588199c8ab98157cc423e47fa209d7
      switch (isVisible) {
        case true:
        case "always":
-@@ -9780,6 +9796,13 @@ var gDialogBox = {
+@@ -9780,6 +9794,13 @@ var gDialogBox = {
      parentElement.style.removeProperty("width");
      parentElement.style.removeProperty("height");
      document.documentElement.setAttribute("window-modal-open", true);
@@ -69,7 +53,7 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..3b588199c8ab98157cc423e47fa209d7
      // Call this first so the contents show up and get layout, which is
      // required for SubDialog to work.
      parentElement.showModal();
-@@ -10157,3 +10180,45 @@ var FirefoxViewHandler = {
+@@ -10157,3 +10178,15 @@ var FirefoxViewHandler = {
      this.button?.toggleAttribute("attention", shouldShow);
    },
  };
@@ -85,33 +69,3 @@ index 4f145c494973374e87f3a3ed5eb6b33a43c518c8..3b588199c8ab98157cc423e47fa209d7
 +  // 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);
-+  },
-+}