From f5638b12252718eda9ba18e915e08995651462ef Mon Sep 17 00:00:00 2001
From: fen4flo <fb8599422@gmail.com>
Date: Sun, 7 Jun 2026 01:02:40 +0200
Subject: [PATCH 1/4] fix: Change to use gDialogBox instead of openDialog

---
 .../ZenSpaceRoutingManager.sys.mjs            | 16 ++---
 src/zen/space-routing/zen-space-routing.css   | 24 ++-----
 .../space-routing/zen-space-routing.inc.xhtml | 66 +++++++++----------
 3 files changed, 45 insertions(+), 61 deletions(-)

diff --git a/src/zen/space-routing/ZenSpaceRoutingManager.sys.mjs b/src/zen/space-routing/ZenSpaceRoutingManager.sys.mjs
index 9109e89245..9a844af6a8 100644
--- a/src/zen/space-routing/ZenSpaceRoutingManager.sys.mjs
+++ b/src/zen/space-routing/ZenSpaceRoutingManager.sys.mjs
@@ -254,16 +254,16 @@ class nsZenSpaceRoutingManager {
    * @param {Window} parentWindow - The parent browser window
    * @returns {Window|null} The instanced editor window
    */
-  openSpaceRoutingDialog(parentWindow) {
-    const control = parentWindow.openDialog(
+  async openSpaceRoutingDialog(parentWindow) {
+    await parentWindow.gDialogBox.open(
       "chrome://browser/content/zen-components/windows/zen-space-routing.xhtml",
-      "",
-      "centerscreen,modal,dependent,resizable=no,titlebar=no",
-      { parentWindow }
+      {
+        features: "resizable=no",
+        sizeTo: "available",
+        allowDuplicateDialogs: false,
+        parentWindow,
+      },
     );
-
-    control.focus();
-    return control;
   }
 
   /**
diff --git a/src/zen/space-routing/zen-space-routing.css b/src/zen/space-routing/zen-space-routing.css
index 31aea297e6..446bee5ec5 100644
--- a/src/zen/space-routing/zen-space-routing.css
+++ b/src/zen/space-routing/zen-space-routing.css
@@ -36,11 +36,7 @@
   display: none !important;
 }
 
-#zen-space-routing-dialog-container {
-  background-color: var(--sr-background);
-  padding: 0;
-  margin: 24px;
-
+window {
   height: var(--sr-height);
   max-height: var(--sr-height);
   min-height: var(--sr-height);
@@ -178,7 +174,7 @@ menulist {
 }
 
 .sr-rule-bottom {
-  margin-left: 85px;
+  margin-left: 87px;
 }
 
 .input,
@@ -217,27 +213,17 @@ button {
 .sr-remove,
 .close-icon {
   & hbox {
-    display: initial;
-    padding: 0;
-    margin: 0;
+    display: flex;
   }
 
   opacity: 0.5;
-
-  &:hover {
-    opacity: 0.8;
-  }
-
-  transition: 0.2s opacity cubic-bezier(0.075, 0.82, 0.165, 1);
-
   appearance: none !important;
   background: none;
   border: none !important;
 
-  aspect-ratio: 1;
-  height: 24px;
+  height: 32px;
+  width: 32px;
   padding: 3px;
-  width: 24px;
 
   min-width: 0 !important;
   color: var(--text-color-secondary);
diff --git a/src/zen/space-routing/zen-space-routing.inc.xhtml b/src/zen/space-routing/zen-space-routing.inc.xhtml
index dfda342298..f0cff02e9e 100644
--- a/src/zen/space-routing/zen-space-routing.inc.xhtml
+++ b/src/zen/space-routing/zen-space-routing.inc.xhtml
@@ -56,42 +56,40 @@
     <html:link rel="localization" href="browser/zen-space-routing.ftl" />
   </linkset>
 
-  <vbox
-    id="zen-space-routing-dialog-container"
-    class="dialogBox"
-    role="dialog"
-  >
-    <vbox id="sr-container">
-      <hbox id="sr-header">
-        <h3 data-l10n-id="zen-space-routing-dialog-title"></h3>
-        <html:div class="sr-left">
-          <button
-            id="sr-new-route"
-            data-l10n-id="zen-space-routing-new-route"
-          ></button>
-          <button class="close-icon" data-l10n-id="zen-space-routing-close-button" id="sr-close"></button>
-        </html:div>
-      </hbox>
-      <html:hr class="hr"></html:hr>
-      <vbox id="sr-content">
-        <vbox id="sr-empty-content">
-          <image class="sr-airplane"></image>
-          <p data-l10n-id="zen-space-routing-rulepanel-placeholder"></p>
-        </vbox>
-# All rules will be injected here later
+  <vbox id="sr-container">
+    <hbox id="sr-header">
+      <h3 data-l10n-id="zen-space-routing-dialog-title"></h3>
+      <html:div class="sr-left">
+        <button
+          id="sr-new-route"
+          data-l10n-id="zen-space-routing-new-route"
+        ></button>
+        <button
+          class="close-icon"
+          data-l10n-id="zen-space-routing-close-button"
+          id="sr-close"
+        ></button>
+      </html:div>
+    </hbox>
+    <html:hr class="hr"></html:hr>
+    <vbox id="sr-content">
+      <vbox id="sr-empty-content">
+        <image class="sr-airplane"></image>
+        <p data-l10n-id="zen-space-routing-rulepanel-placeholder"></p>
       </vbox>
-      <html:hr class="hr"></html:hr>
-      <hbox id="sr-footer">
-        <h4 data-l10n-id="zen-space-routing-external-default"></h4>
-        <html:div class="sr-left">
-          <menulist class="select" id="sr-default-external-open-in">
-            <menupopup id="sr-default-external-open-in-popup">
-# Select open in types will be injected here
-            </menupopup>
-          </menulist>
-        </html:div>
-      </hbox>
+# All rules will be injected here later
     </vbox>
+    <html:hr class="hr"></html:hr>
+    <hbox id="sr-footer">
+      <h4 data-l10n-id="zen-space-routing-external-default"></h4>
+      <html:div class="sr-left">
+        <menulist class="select" id="sr-default-external-open-in">
+          <menupopup id="sr-default-external-open-in-popup">
+# Select open in types will be injected here
+          </menupopup>
+        </menulist>
+      </html:div>
+    </hbox>
   </vbox>
 
   <script>

From 3584df24151e4eab0c942a014aca04d9454d934f Mon Sep 17 00:00:00 2001
From: "mr. m" <mr.m@tuta.com>
Date: Sun, 7 Jun 2026 10:54:13 +0200
Subject: [PATCH 2/4] no-bug: Finishing touches

---
 .../base/content/zen-panels/popups.inc        |  3 +-
 .../space-routing/ZenSpaceRoutingDialog.mjs   |  9 ++++
 .../ZenSpaceRoutingManager.sys.mjs            |  2 +-
 src/zen/space-routing/zen-space-routing.css   | 49 ++++++++++---------
 .../space-routing/zen-space-routing.inc.xhtml | 18 ++-----
 5 files changed, 42 insertions(+), 39 deletions(-)

diff --git a/src/browser/base/content/zen-panels/popups.inc b/src/browser/base/content/zen-panels/popups.inc
index bc9abc04e3..2ff92383d4 100644
--- a/src/browser/base/content/zen-panels/popups.inc
+++ b/src/browser/base/content/zen-panels/popups.inc
@@ -30,10 +30,11 @@
   <menuitem id="context_zenReorderWorkspaces" data-l10n-id="zen-workspaces-panel-context-reorder" command="cmd_zenReorderWorkspaces"/>
   <menuitem id="context_zenUnloadWorkspace" data-l10n-id="zen-workspaces-panel-unload" command="cmd_zenUnloadWorkspace"/>
   <menuitem id="context_zenUnloadAllOtherWorkspace" data-l10n-id="zen-workspaces-panel-unload-others" command="cmd_zenUnloadAllOtherWorkspace"/>
-  <menuitem id="context_zenSpaceRoutingSettings" data-l10n-id="zen-space-routing-settings" command="cmd_zenOpenSpaceRoutingSettings"/>
   <menuseparator/>
   <menuitem data-l10n-id="zen-panel-ui-workspaces-create" command="cmd_zenOpenWorkspaceCreation"/>
   <menuitem id="context_zenDeleteWorkspace" data-l10n-id="zen-workspaces-panel-context-delete" command="cmd_zenCtxDeleteWorkspace"/>
+  <menuseparator/>
+  <menuitem id="context_zenSpaceRoutingSettings" data-l10n-id="zen-space-routing-settings" command="cmd_zenOpenSpaceRoutingSettings"/>
 </menupopup>
 
 <menupopup id="zenFolderActions">
diff --git a/src/zen/space-routing/ZenSpaceRoutingDialog.mjs b/src/zen/space-routing/ZenSpaceRoutingDialog.mjs
index 3bdb6324f9..494db0682a 100644
--- a/src/zen/space-routing/ZenSpaceRoutingDialog.mjs
+++ b/src/zen/space-routing/ZenSpaceRoutingDialog.mjs
@@ -196,8 +196,17 @@ export class nsZenSpaceRoutingDialog {
     bottomRow.append(bottomLabelContainer, openInMenulist);
 
     root.append(topRow, bottomRow);
+
+    root.style.display = "none";
     container.appendChild(root);
 
+    // Wait for l10n to catch up and then show the element to avoid flickering.
+    this.editorWindow.promiseDocumentFlushed(() =>
+      this.editorWindow.requestAnimationFrame(() => {
+        root.style.display = "";
+      })
+    );
+
     removeButton.addEventListener("click", () => {
       this.onRemoveRoutePressed(route.id, root);
     });
diff --git a/src/zen/space-routing/ZenSpaceRoutingManager.sys.mjs b/src/zen/space-routing/ZenSpaceRoutingManager.sys.mjs
index 9a844af6a8..b5d07c7a3e 100644
--- a/src/zen/space-routing/ZenSpaceRoutingManager.sys.mjs
+++ b/src/zen/space-routing/ZenSpaceRoutingManager.sys.mjs
@@ -262,7 +262,7 @@ class nsZenSpaceRoutingManager {
         sizeTo: "available",
         allowDuplicateDialogs: false,
         parentWindow,
-      },
+      }
     );
   }
 
diff --git a/src/zen/space-routing/zen-space-routing.css b/src/zen/space-routing/zen-space-routing.css
index 446bee5ec5..172263809f 100644
--- a/src/zen/space-routing/zen-space-routing.css
+++ b/src/zen/space-routing/zen-space-routing.css
@@ -1,17 +1,13 @@
-/*
- * This Source Code Form is subject to the terms of the Mozilla Public
+/* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+@namespace html "http://www.w3.org/1999/xhtml";
+@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
 
 :root {
-  background: none;
-  appearance: none;
-  border: none;
-  outline: none;
-  color-scheme: light dark;
+  --background-color-canvas: light-dark(white, #212223) !important;
 
-  --sr-background: light-dark(white, #212223);
   --select-background-color: light-dark(#eceef0, #3e3f43);
   --input-background-color: light-dark(#f1f2f4, #2c2d31);
   --hr-color: light-dark(#cdced4, #313235);
@@ -88,20 +84,22 @@ window {
   }
 
   & p {
-    font-weight: bold;
     font-size: small;
-
+    opacity: 0.8;
     color: var(--text-color);
   }
 }
 
-.hr {
-  color: var(--hr-color);
+#sr-new-route {
+  padding: 4px 6px !important;
+}
+
+html|hr {
+  border-color: var(--hr-color) !important;
   padding: 0;
   margin: 0;
-  margin-left: 32px;
-  margin-right: 32px;
-  border-style: solid;
+  margin-left: 22px;
+  margin-right: 22px;
   border-width: 0.5px;
 }
 
@@ -122,13 +120,14 @@ p {
 
 .select {
   width: 150px;
+  min-height: unset;
   height: 26px;
   padding: 4px;
 }
 
 .select,
 .select * {
-  background-color: var(--select-background-color);
+  background-color: var(--select-background-color) !important;
   color: var(--text-color);
   margin: 0;
 
@@ -197,9 +196,10 @@ menulist {
 }
 
 button {
-  user-select: none !important;
+  background-color: var(--select-background-color) !important;
+  min-height: unset !important;
 
-  padding: 2px;
+  padding: 2px !important;
   display: flex;
   justify-content: center;
 
@@ -218,7 +218,6 @@ button {
 
   opacity: 0.5;
   appearance: none !important;
-  background: none;
   border: none !important;
 
   height: 32px;
@@ -230,11 +229,15 @@ button {
 
   -moz-context-properties: fill, fill-opacity;
   fill: currentColor;
+
+  &:not(:hover) {
+    background: none !important;
+  }
 }
 
 #sr-header {
   width: 100%;
-  padding: var(--content-padding);
+  padding: var(--content-padding) 20px;
   align-items: center;
 
   display: flex;
@@ -271,7 +274,7 @@ button {
 #sr-content {
   width: 100%;
   overflow: scroll;
-  padding: var(--content-padding);
+  padding: 20px var(--content-padding);
   flex-grow: 1;
 
   display: flex;
diff --git a/src/zen/space-routing/zen-space-routing.inc.xhtml b/src/zen/space-routing/zen-space-routing.inc.xhtml
index f0cff02e9e..7b4cdc8581 100644
--- a/src/zen/space-routing/zen-space-routing.inc.xhtml
+++ b/src/zen/space-routing/zen-space-routing.inc.xhtml
@@ -18,10 +18,10 @@
   dialogroot="true"
 >
   <linkset>
-    <html:link rel="stylesheet" href="chrome://global/skin/commonDialog.css" />
     <html:link
       rel="stylesheet"
-      href="chrome://global/content/commonDialog.css"
+      href="chrome://browser/content/zen-styles/zen-space-routing.css"
+      type="text/css"
     />
     <html:link
       rel="stylesheet"
@@ -33,21 +33,11 @@
       href="chrome://browser/content/zen-styles/zen-theme.css"
       type="text/css"
     />
-    <html:link
-      rel="stylesheet"
-      href="chrome://browser/content/zen-styles/zen-space-routing.css"
-      type="text/css"
-    />
     <html:link
       rel="stylesheet"
       href="chrome://browser/skin/zen-icons/icons.css"
       type="text/css"
     />
-    <html:link
-      rel="stylesheet"
-      href="chrome://browser/content/zen-styles/zen-animations.css"
-      type="text/css"
-    />
     <html:link
       rel="stylesheet"
       type="text/css"
@@ -71,7 +61,7 @@
         ></button>
       </html:div>
     </hbox>
-    <html:hr class="hr"></html:hr>
+    <html:hr />
     <vbox id="sr-content">
       <vbox id="sr-empty-content">
         <image class="sr-airplane"></image>
@@ -79,7 +69,7 @@
       </vbox>
 # All rules will be injected here later
     </vbox>
-    <html:hr class="hr"></html:hr>
+    <html:hr />
     <hbox id="sr-footer">
       <h4 data-l10n-id="zen-space-routing-external-default"></h4>
       <html:div class="sr-left">

From d588b81a7326a28fa5022a59bbb8e538459a8119 Mon Sep 17 00:00:00 2001
From: "mr. m" <mr.m@tuta.com>
Date: Sun, 7 Jun 2026 11:03:26 +0200
Subject: [PATCH 3/4] no-bug: Sneak in boosts theme change

---
 src/zen/boosts/ZenBoostsEditor.mjs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/zen/boosts/ZenBoostsEditor.mjs b/src/zen/boosts/ZenBoostsEditor.mjs
index c65b45e16e..7254ac3fda 100644
--- a/src/zen/boosts/ZenBoostsEditor.mjs
+++ b/src/zen/boosts/ZenBoostsEditor.mjs
@@ -218,7 +218,7 @@ export class nsZenBoostEditor {
     const editor = new Editor({
       mode: Editor.modes.css,
       lineNumbers: true,
-      theme: "mozilla",
+      theme: this.isDarkMode ? "mozilla" : "default",
       readOnly: false,
       gutters: ["CodeMirror-linenumbers"],
     });

From 42b7713f57011c1a174ba4a8533e25ed99771758 Mon Sep 17 00:00:00 2001
From: "mr. m" <mr.m@tuta.com>
Date: Sun, 7 Jun 2026 11:24:17 +0200
Subject: [PATCH 4/4] no-bug: Focus input when showing the items

---
 src/zen/space-routing/ZenSpaceRoutingDialog.mjs | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/zen/space-routing/ZenSpaceRoutingDialog.mjs b/src/zen/space-routing/ZenSpaceRoutingDialog.mjs
index 494db0682a..786a4fc015 100644
--- a/src/zen/space-routing/ZenSpaceRoutingDialog.mjs
+++ b/src/zen/space-routing/ZenSpaceRoutingDialog.mjs
@@ -204,6 +204,7 @@ export class nsZenSpaceRoutingDialog {
     this.editorWindow.promiseDocumentFlushed(() =>
       this.editorWindow.requestAnimationFrame(() => {
         root.style.display = "";
+        input.focus();
       })
     );
 
@@ -221,8 +222,6 @@ export class nsZenSpaceRoutingDialog {
       this.onRouteOpenInChange(e.target.value, route.id)
     );
 
-    input.focus();
-
     this.updateShowNoRouteText();
 
     return root;