Clean: Tab - Static separator use --toolbarseparator-color as dynamic

black7375 · Nov 27, 2022 · 87d7b47 · 87d7b47
1 parent 9204e1c
commit 87d7b47
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 10 deletions.
diff --git a/css/leptonChrome.css b/css/leptonChrome.css
@@ -6120,6 +6120,9 @@
 }
 /*= Unselected Tab - Static Separator ========================================*/
 @supports -moz-bool-pref("userChrome.tab.static_separator") {
+  #TabsToolbar {
+    --toolbarseparator-color: color-mix(in srgb, currentColor 30%, transparent);
+  }
   .tabbrowser-tab[first-visible-tab="true"] .tab-background::before,
   .tab-background::after {
     content: "";
@@ -6131,13 +6134,12 @@
     position: absolute;
     /* Position */
     top: 50%;
-    transform: translateY(-50%) !important;
+    transform: translateY(-50%);
     /* Bar shape */
     width: 0px;
     height: 100%;
     /* Bar Color */
-    opacity: 0.3;
-    border-right: 1px solid var(--lwt-background-tab-separator-color, currentColor) !important;
+    border-right: 1px solid var(--toolbarseparator-color);
   }
   .tab-background::after {
     right: 0;
@@ -6146,8 +6148,7 @@
     .tabbrowser-tab[visuallyselected] .tab-background::before,
     .tabbrowser-tab[visuallyselected] .tab-background::after,
     .tabbrowser-tab[beforeselected-visible] .tab-background::after {
-      --lwt-background-tab-separator-color: var(--tab-line-color, var(--lwt-tab-line-color, rgb(10, 132, 255)));
-      opacity: 1;
+      --toolbarseparator-color: var(--tab-line-color, var(--lwt-tab-line-color, rgb(10, 132, 255)));
     }
   }
   @supports not -moz-bool-pref("userChrome.tab.static_separator.selected_accent") {

diff --git a/src/tab/unselected_tab/_static_separator.scss b/src/tab/unselected_tab/_static_separator.scss
@@ -1,3 +1,7 @@
+#TabsToolbar {
+  --toolbarseparator-color: color-mix(in srgb, currentColor 30%, transparent);
+}
+
 .tabbrowser-tab[first-visible-tab="true"] .tab-background::before,
 .tab-background::after {
   content: "";
@@ -11,15 +15,14 @@
 
   /* Position */
   top: 50%;
-  transform:  translateY(-50%) !important;
+  transform:  translateY(-50%);
 
   /* Bar shape */
   width: 0px;
   height: 100%;
 
   /* Bar Color */
-  opacity: 0.3;
-  border-right: 1px solid var(--lwt-background-tab-separator-color, currentColor) !important;
+  border-right: 1px solid var(--toolbarseparator-color);
 }
 .tab-background::after {
   right: 0;
@@ -29,8 +32,7 @@
 .tabbrowser-tab[visuallyselected] .tab-background::after,
 .tabbrowser-tab[beforeselected-visible] .tab-background::after {
   @include Option("userChrome.tab.static_separator.selected_accent") {
-    --lwt-background-tab-separator-color: var(--tab-line-color, var(--lwt-tab-line-color, rgb(10, 132, 255)));
-    opacity: 1;
+    --toolbarseparator-color: var(--tab-line-color, var(--lwt-tab-line-color, rgb(10, 132, 255)));
   }
   @include NotOption("userChrome.tab.static_separator.selected_accent") {
     opacity: 0;