feat: Improve accesibility for split view buttons, b=no-bug, c=split-view, tabs

src/-stylelintignore.patch

@@ -1,5 +1,5 @@
 diff --git a/.stylelintignore b/.stylelintignore
-index 185490999507b8a5032977237af50f5e61c71df1..d535178552c6a744022be1d0bfff5fbb8bf9a5ef 100644
+index 185490999507b8a5032977237af50f5e61c71df1..77c1635d90c6480af4ebd3c6e3ec49780eaca571 100644
 --- a/.stylelintignore
 +++ b/.stylelintignore
 @@ -106,3 +106,19 @@ build/pgo/blueprint/**/*.css
@@ -17,7 +17,7 @@ index 185490999507b8a5032977237af50f5e61c71df1..d535178552c6a744022be1d0bfff5fbb
 +zen/common/styles/zen-theme.css
 +zen/compact-mode/zen-compact-mode.css
 +
-+zen/split-view/zen-decks.css
++zen/split-view/zen-split-view.css
 +zen/spaces/zen-workspaces.css
 +zen/common/styles/zen-toolbar.css
 +

src/browser/base/content/zen-assets.inc.xhtml

@@ -17,7 +17,7 @@
 <link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-browser-container.css" />
 <link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-omnibox.css" />
 <link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-workspaces.css" />
-<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-decks.css" />
+<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-split-view.css" />
 <link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-folders.css" />
 <link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-glance.css" />
 <link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-popup.css" />

src/zen/drag-and-drop/ZenDragAndDrop.js

@@ -828,7 +828,7 @@
 
     #createFakeTabSplit(dropElement, dropSide) {
       // Remove drop indicator
-      this.clearDragOverVisuals();
+      this.clearDragOverVisuals({ clearSplitDropIndicator: false });
 
       // Remove any existing fake tab
       if (this.#dragOverSplit.fakeTab) {
@@ -1191,8 +1191,11 @@
       }
     }
 
-    clearDragOverVisuals() {
+    clearDragOverVisuals({ clearSplitDropIndicator = true } = {}) {
       this.#removeDragOverBackground();
+      if (clearSplitDropIndicator) {
+        this._clearDragOverSplit();
+      }
       gZenPinnedTabManager.removeTabContainersDragoverClass();
     }
 

src/zen/split-view/jar.inc.mn

@@ -2,5 +2,5 @@
 # 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/.
 
-*       content/browser/zen-styles/zen-decks.css                                (../../zen/split-view/zen-decks.css)
+*       content/browser/zen-styles/zen-split-view.css                           (../../zen/split-view/zen-split-view.css)
         content/browser/zen-components/ZenViewSplitter.mjs                      (../../zen/split-view/ZenViewSplitter.mjs)

src/zen/split-view/zen-split-view.css

@@ -69,7 +69,7 @@
 }
 
 #tabbrowser-tabpanels[zen-split-view="true"]:not(.zen-split-view-no-transition):not([zen-split-resizing]) > [zen-split="true"] {
-  --zen-active-split-outline-color: light-dark(var(--zen-primary-color), var(--button-background-color-primary));
+  --zen-active-split-outline-color: light-dark(hsl(from var(--zen-primary-color) h s calc(l - 20)), var(--button-background-color-primary));
 
   transition: inset 0.09s ease-out !important;
   & browser {
@@ -173,7 +173,8 @@
   display: flex;
   -moz-context-properties: fill, fill-opacity;
   border-radius: var(--tab-border-radius);
-  color: inherit;
+  color: contrast-color(var(--zen-active-split-outline-color));
+  opacity: 0.8;
   fill: currentColor;
   width: 16px;
   height: 16px;

src/zen/tabs/zen-tabs/vertical-tabs.css

@@ -325,11 +325,15 @@
       display: none;
     }
 
-    #tabbrowser-tabs:not([movingtab]) &:active:not(:has(.tab-content > image:active)) {
+    :root:not([zen-renaming-tab="true"])
+    #tabbrowser-tabs:not([movingtab])
+    &:active:not(:has(.tab-content > image:active)) {
       scale: var(--zen-active-tab-scale);
     }
 
-    #tabbrowser-tabs:not([movingtab]) & .tab-content > image:active {
+    :root:not([zen-renaming-tab="true"])
+    #tabbrowser-tabs:not([movingtab])
+    & .tab-content > image:active {
       scale: 0.92;
     }
 

surfer.json

@@ -20,7 +20,7 @@
       "brandShortName": "Zen",
       "brandFullName": "Zen Browser",
       "release": {
-        "displayVersion": "1.19.2b",
+        "displayVersion": "1.19.3b",
         "github": {
           "repo": "zen-browser/desktop"
         },