From 7a5f6502bc11763ec156eef2d6b22934ed8792a6 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Sat, 8 Oct 2022 03:56:04 +0900 Subject: [PATCH 1/3] Fix: Tab Bar - Compatibility for TabMixPlus's multi row https://github.com/onemen/TabMixPlus/issues/168 --- css/leptonChrome.css | 22 ++++++++++++------- src/padding/_tabbar_height.scss | 10 ++++----- src/padding/_tabbar_width.scss | 2 +- src/tab/_connect_to_window.scss | 2 +- .../unselected_tab/_dynamic_separator.scss | 2 +- 5 files changed, 22 insertions(+), 16 deletions(-) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 0e0a801..c02b695 100644 --- 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 index 02456f7..2f6da44 100644 --- 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 index 6797e88..222303c 100644 --- 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 index e163495..cd05b30 100644 --- 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 index f1a8ed7..3607965 100644 --- 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; } From 16e310b2e02696b1c3ceb8fd1e833880ed050577 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Thu, 13 Oct 2022 09:42:26 +0900 Subject: [PATCH 2/3] Fix: Tab Bar - Height at `TabMixPlus`'s multirow' https://github.com/onemen/TabMixPlus/issues/168 --- css/leptonChrome.css | 6 ++++++ src/padding/_tabbar_height.scss | 5 +++++ 2 files changed, 11 insertions(+) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index c02b695..54bcc39 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -3591,6 +3591,12 @@ height: var(--tab-min-height) !important; } } + /* Works with TabMixPlus */ + #TabsToolbar[multibar] .tabbrowser-tab { + height: unset !important; + /* Original: var(--tab-min-height_mlt) */ + } + /* Scroll Button - Size Fix */ :root #tabbrowser-arrowscrollbox { --scrollbtn-vertical-padding: 3px; diff --git a/src/padding/_tabbar_height.scss b/src/padding/_tabbar_height.scss index 2f6da44..05f6e2d 100644 --- a/src/padding/_tabbar_height.scss +++ b/src/padding/_tabbar_height.scss @@ -59,6 +59,11 @@ } } +/* Works with TabMixPlus */ +#TabsToolbar[multibar] .tabbrowser-tab { + height: unset !important; /* Original: var(--tab-min-height_mlt) */ +} + /* Scroll Button - Size Fix */ :root #tabbrowser-arrowscrollbox { --scrollbtn-vertical-padding: 3px; From f83e98298ed2cc71ed181ccdf572a922f140454a Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Thu, 13 Oct 2022 09:31:56 +0900 Subject: [PATCH 3/3] Fix: Tab Bar - New tab button's separator vertical algin #315 --- css/leptonChrome.css | 4 ++++ src/tab/unselected_tab/_dynamic_separator.scss | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 54bcc39..40c7d50 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -6481,6 +6481,10 @@ --tab-separator-position-x: 2.5px; } + #tabbrowser-arrowscrollbox-periphery { + position: relative; + } + @supports -moz-bool-pref("userChrome.tab.newtab_button_like_tab") { #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox { position: absolute; diff --git a/src/tab/unselected_tab/_dynamic_separator.scss b/src/tab/unselected_tab/_dynamic_separator.scss index 3607965..c0a1a3a 100644 --- a/src/tab/unselected_tab/_dynamic_separator.scss +++ b/src/tab/unselected_tab/_dynamic_separator.scss @@ -35,6 +35,10 @@ } } +#tabbrowser-arrowscrollbox-periphery { + position: relative; +} + @include Option("userChrome.tab.newtab_button_like_tab") { #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox { position: absolute;