diff --git a/chrome/multi-row_tabs.css b/chrome/multi-row_tabs.css index 20c89b6..f640305 100644 --- a/chrome/multi-row_tabs.css +++ b/chrome/multi-row_tabs.css @@ -1,21 +1,49 @@ /* Makes tabs to appear on multiple lines */ -/* Tab reordering will not work */ +/* Tab reordering will not work and can't be made to work */ +/* On Firefox 66 you can use multi-row_tabs_window_control_patch.css to hide window controls if you wish */ -#tabbrowser-tabs, -#tabbrowser-tabs > .tabbrowser-arrowscrollbox{ +/* It's recommended to move tabs new-tab-button outside tabs toolbar */ + +#tabbrowser-tabs{ min-height: unset !important; + padding-inline-start: 0px !important } -#tabbrowser-tabs .scrollbox-innerbox{ - display: flex; - flex-wrap: wrap; -} -#tabbrowser-tabs .arrowscrollbox-scrollbox { - overflow: -moz-hidden-unscrollable; - display: block; -} -.tabbrowser-tab{ max-height: 32px } -.tabbrowser-tab[fadein]{ +/* Test for Firefox > 66 */ +@supports (inset-block:auto){ + #tabbrowser-tabs > .tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox{ + display: flex; + flex-wrap: wrap; + } + #tabbrowser-tabs > .tabbrowser-arrowscrollbox { + overflow: -moz-hidden-unscrollable; + display: block; + } +} + +/* Test for Firefox < 66 */ +@supports not (inset-block:auto){ + #tabbrowser-tabs > .tabbrowser-arrowscrollbox{ + min-height: unset !important; + } + #tabbrowser-tabs .scrollbox-innerbox{ + display: flex; + flex-wrap: wrap; + } + #tabbrowser-tabs .arrowscrollbox-scrollbox { + overflow: -moz-hidden-unscrollable; + display: block; + } +} + +.tabbrowser-tab{ max-height: 32px } +.tabbrowser-tab[pinned]{ + position: static !important; + margin-inline-start: 0px !important; +} + + +.tabbrowser-tab[fadein]:not([pinned]){ min-width: 100px !important; flex-grow: 1; /* @@ -24,4 +52,11 @@ */ /*max-width: 100vw !important;*/ } -.tabbrowser-tab > stack{ width: 100%; height: 100% } \ No newline at end of file + +.tabbrowser-tab > stack{ width: 100%; height: 100% } + +#tabbrowser-tabs .scrollbutton-up, +#tabbrowser-tabs .scrollbutton-down, +#alltabs-button, +:root:not([customizing]) #TabsToolbar #new-tab-button, +#tabbrowser-tabs spacer{ display: none } \ No newline at end of file diff --git a/chrome/multi-row_tabs_Fx66+.css b/chrome/multi-row_tabs_Fx66+.css index ce03aeb..9f81de4 100644 --- a/chrome/multi-row_tabs_Fx66+.css +++ b/chrome/multi-row_tabs_Fx66+.css @@ -1,5 +1,6 @@ /* For Firefox 66+ */ /* Use multi-row_tabs_window_control_patch.css to hide window controls if you wish */ +/* This file is obsolete, you can use multi-row_tabs.css which should work on Firefox pre- and post-66 */ #tabbrowser-tabs{ @@ -31,5 +32,5 @@ #tabbrowser-tabs .scrollbutton-up, #tabbrowser-tabs .scrollbutton-down, #alltabs-button, -#TabsToolbar #new-tab-button, +:root:not([customizing]) #TabsToolbar #new-tab-button, #tabbrowser-tabs spacer{ display: none } \ No newline at end of file