Fix: Tab Bar - Compatibility for TabMixPlus's multi row

onemen/TabMixPlus#168
black7375 · Oct 7, 2022 · 7a5f650 · 7a5f650
1 parent e4a235b
commit 7a5f650
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 16 deletions.
diff --git a/css/leptonChrome.css b/css/leptonChrome.css
@@ -3442,7 +3442,7 @@
         padding-inline: 1px !important;
       }
     }
-    .tabbrowser-tab:not([last-visible-tab]) {
+    #TabsToolbar:not([multibar]) .tabbrowser-tab:not([last-visible-tab]) {
       margin-inline-end: -1px !important;
     }
   }
@@ -3573,15 +3573,21 @@
       /* Prevent overflow pinned tab bottom margin */
     }
 
-    :root:not([uidensity="compact"]) #tabbrowser-arrowscrollbox,
-    #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"],
-    #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-stack,
-    #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-content {
+    :root:not([uidensity="compact"]) #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox,
+    #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"],
+    #TabsToolbar:not([multibar])
+      #tabbrowser-arrowscrollbox[overflowing="true"]
+      > .tabbrowser-tab[pinned="true"]
+      .tab-stack,
+    #TabsToolbar:not([multibar])
+      #tabbrowser-arrowscrollbox[overflowing="true"]
+      > .tabbrowser-tab[pinned="true"]
+      .tab-content {
       max-height: var(--tab-min-height) !important;
       /* Force apply height */
     }
 
-    :root[uidensity="compact"] #tabbrowser-arrowscrollbox {
+    :root[uidensity="compact"] #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox {
       height: var(--tab-min-height) !important;
     }
   }
@@ -6139,7 +6145,7 @@
     z-index: 1 !important;
   }
 
-  #TabsToolbar {
+  #TabsToolbar:not([multibar]) {
     overflow: hidden;
     /* Prevent toolbar area over */
   }
@@ -6470,7 +6476,7 @@
   }
 
   @supports -moz-bool-pref("userChrome.tab.newtab_button_like_tab") {
-    #tabbrowser-arrowscrollbox {
+    #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox {
       position: absolute;
     }
 

diff --git a/src/padding/_tabbar_height.scss b/src/padding/_tabbar_height.scss
@@ -48,13 +48,13 @@
     --toolbarbutton-inner-padding: calc((var(--tab-min-height) - 18px) / 2) !important; /* Prevent overflow pinned tab bottom margin */
   }
 
-  :root:not([uidensity="compact"]) #tabbrowser-arrowscrollbox,
-  #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"],
-  #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-stack,
-  #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-content {
+  :root:not([uidensity="compact"]) #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox,
+  #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"],
+  #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-stack,
+  #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-content {
     max-height: var(--tab-min-height) !important; /* Force apply height */
   }
-  :root[uidensity="compact"] #tabbrowser-arrowscrollbox {
+  :root[uidensity="compact"] #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox {
     height: var(--tab-min-height) !important;
   }
 }

diff --git a/src/padding/_tabbar_width.scss b/src/padding/_tabbar_width.scss
@@ -95,7 +95,7 @@
       padding-inline: 1px !important;
     }
   }
-  .tabbrowser-tab:not([last-visible-tab]) {
+  #TabsToolbar:not([multibar]) .tabbrowser-tab:not([last-visible-tab]) {
     margin-inline-end: -1px !important;
   }
 }

diff --git a/src/tab/_connect_to_window.scss b/src/tab/_connect_to_window.scss
@@ -16,7 +16,7 @@
 #tabbrowser-tabs {
   z-index: 1 !important;
 }
-#TabsToolbar {
+#TabsToolbar:not([multibar]) {
   overflow: hidden;   /* Prevent toolbar area over */
 }
 

diff --git a/src/tab/unselected_tab/_dynamic_separator.scss b/src/tab/unselected_tab/_dynamic_separator.scss
@@ -36,7 +36,7 @@
 }
 
 @include Option("userChrome.tab.newtab_button_like_tab") {
-  #tabbrowser-arrowscrollbox {
+  #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox {
     position: absolute;
   }