Fix: Separator - Dyniamic's margin adjust, Static's accent color provide

black7375 · Nov 7, 2022 · 3a5800a · 3a5800a
1 parent 7350823
commit 3a5800a
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 27 deletions.
diff --git a/css/leptonChrome.css b/css/leptonChrome.css
@@ -6428,7 +6428,7 @@
   }
 }
 /*= Selected Tab - Photon like contextline ===================================*/
-@supports -moz-bool-pref("userChrome.tab.photon_like_contextline") {
+@supports -moz-bool-pref("userChrome.tab.photon_like_contextline") or -moz-bool-pref("userChrome.tab.static_separator") {
   :root[lwtheme-mozlightdark] #tabbrowser-tabs,
   :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"],
   :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] {
@@ -6441,6 +6441,8 @@
       /* -moz-accent-color */
     }
   }
+}
+@supports -moz-bool-pref("userChrome.tab.photon_like_contextline") {
   .tab-context-line {
     display: -moz-inline-box !important;
     height: 2px !important;
@@ -6668,6 +6670,14 @@
       .tab-background::before {
       opacity: 0 !important;
     }
+
+    :root:not([uidensity="compact"]) #tabs-newtab-button > .toolbarbutton-icon {
+      margin-left: 2px;
+    }
+
+    :root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon {
+      margin-left: 1px;
+    }
   }
   /* Animate */
   @media (prefers-reduced-motion: no-preference) {
@@ -6848,14 +6858,6 @@
   :root:not([uidensity="touch"]) #tabs-newtab-button > .toolbarbutton-icon {
     --toolbarbutton-inner-padding: calc((var(--tab-min-height) - 16px) / 2 - 1px);
   }
-
-  :root:not([uidensity="compact"]) #tabs-newtab-button > .toolbarbutton-icon {
-    margin-left: 2px;
-  }
-
-  :root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon {
-    margin-left: 1px;
-  }
 }
 /*= Unloaded Tab - Contents Opacity ===========================================*/
 @supports -moz-bool-pref("userChrome.tab.unloaded") {

diff --git a/src/tab/_selected_tab.scss b/src/tab/_selected_tab.scss
@@ -19,6 +19,19 @@
 }
 
 /*= Selected Tab - Photon like contextline ===================================*/
+@include Option("userChrome.tab.photon_like_contextline", "userChrome.tab.static_separator") {
+  :root[lwtheme-mozlightdark] #tabbrowser-tabs, /* Legacy: v96 */
+  :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"],
+  :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] {
+    --tab-line-color: rgb(10, 132, 255) !important;
+  }
+  @media (-moz-gtk-csd-available) {
+    :root:not(:-moz-lwtheme) #tabbrowser-tabs {
+      --tab-line-color: Highlight !important; /* -moz-accent-color */
+    }
+  }
+}
+
 @include Option("userChrome.tab.photon_like_contextline") {
   @import "selected_tab/photon_like_contextline";
 }
diff --git a/src/tab/newtab_button/_proton_like_button.scss b/src/tab/newtab_button/_proton_like_button.scss
@@ -1,10 +1,3 @@
 :root:not([uidensity="touch"]) #tabs-newtab-button > .toolbarbutton-icon {
   --toolbarbutton-inner-padding: calc((var(--tab-min-height) - 16px) / 2 - 1px);
 }
-
-:root:not([uidensity="compact"]) #tabs-newtab-button > .toolbarbutton-icon {
-  margin-left: 2px;
-}
-:root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon {
-  margin-left: 1px;
-}
diff --git a/src/tab/selected_tab/_photon_like_contextline.scss b/src/tab/selected_tab/_photon_like_contextline.scss
@@ -1,14 +1,3 @@
-:root[lwtheme-mozlightdark] #tabbrowser-tabs, /* Legacy: v96 */
-:root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"],
-:root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] {
-  --tab-line-color: rgb(10, 132, 255) !important;
-}
-@media (-moz-gtk-csd-available) {
-  :root:not(:-moz-lwtheme) #tabbrowser-tabs {
-    --tab-line-color: Highlight !important; /* -moz-accent-color */
-  }
-}
-
 .tab-context-line {
   display: -moz-inline-box !important;
   height: 2px !important;

diff --git a/src/tab/unselected_tab/_dynamic_separator.scss b/src/tab/unselected_tab/_dynamic_separator.scss
@@ -126,6 +126,13 @@
     .tab-background::before {
     opacity: 0 !important;
   }
+
+  :root:not([uidensity="compact"]) #tabs-newtab-button > .toolbarbutton-icon {
+    margin-left: 2px;
+  }
+  :root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon {
+    margin-left: 1px;
+  }
 }
 
 /* Animate */