hide tabs scrollbuttons: Fix behavior with separate pinned tabs container

Fixes #628
This commit is contained in:
MrOtherGuy
2026-05-15 06:41:07 +03:00
parent 494efca729
commit 1f477a50cf
+6 -8
View File
@@ -4,9 +4,9 @@ See the above repository for updates as well as full license text. */
/* This should hide tabs scrollbuttons in a manner that preserves the ability to move tab strip when reordering tabs */ /* This should hide tabs scrollbuttons in a manner that preserves the ability to move tab strip when reordering tabs */
:root{ :root{
--uc-tab-shadow-max-size: 6px; --uc-tab-shadow-max-size: 3px;
/* Funny, but we let this to be overridden in ESR 128 which doesn't exist in Firefox 139 */ /* Funny, but we let this to be overridden in ESR 128 which doesn't exist in Firefox 139 */
--tab-shadow-max-size: var(--uc-tab-shadow-max-size); --tab-shadow-max-size: var(--uc-tab-shadow-max-size);
} }
#tabbrowser-arrowscrollbox{ #tabbrowser-arrowscrollbox{
@@ -18,12 +18,12 @@ See the above repository for updates as well as full license text. */
#tabbrowser-tabs:not([movingtab]){ #tabbrowser-tabs:not([movingtab]){
--uc-scroll-visibility: hidden; --uc-scroll-visibility: hidden;
} }
#tabbrowser-tabs[overflow]{ #tabbrowser-arrowscrollbox[overflowing]{
--uc-scrollbox-base-margin: -31px; --uc-scrollbox-base-margin: -31px;
--uc-scrollbox-margin: calc(var(--uc-scrollbox-base-margin) + var(--tab-shadow-max-size)); --uc-scrollbox-margin: calc(var(--uc-scrollbox-base-margin) + var(--tab-shadow-max-size));
} }
:root[uidensity="compact"] #tabbrowser-tabs[overflow]{ #pinned-tabs-container{
--uc-scrollbox-base-margin: -25px; padding-inline-end: var(--uc-tab-shadow-max-size,0);
} }
#tabbrowser-arrowscrollbox:not([scrolledtostart]){ #tabbrowser-arrowscrollbox:not([scrolledtostart]){
--uc-scrollbox-overflow-start-margin: -1px; --uc-scrollbox-overflow-start-margin: -1px;
@@ -42,7 +42,7 @@ spacer[part="overflow-end-indicator"]{
#scrollbutton-down:is([disabled=""],[disabled="true"]) > .toolbarbutton-icon, #scrollbutton-down:is([disabled=""],[disabled="true"]) > .toolbarbutton-icon,
#scrollbutton-up:is([disabled=""],[disabled="true"]) > .toolbarbutton-icon{ #scrollbutton-up:is([disabled=""],[disabled="true"]) > .toolbarbutton-icon{
opacity: 0.4; opacity: 0.4;
} }
#scrollbutton-up, #scrollbutton-up,
#scrollbutton-down{ #scrollbutton-down{
position: relative; position: relative;
@@ -54,11 +54,9 @@ spacer[part="overflow-end-indicator"]{
opacity: 1 !important; opacity: 1 !important;
} }
#scrollbutton-up{ #scrollbutton-up{
margin-inline-start: calc(0px - var(--tab-shadow-max-size,0px)) !important;
background-image: var(--uc-scrollbutton-up-background); background-image: var(--uc-scrollbutton-up-background);
} }
#scrollbutton-down{ #scrollbutton-down{
margin-inline-end: calc(0px - var(--tab-shadow-max-size,0px)) !important;
background-image: var(--uc-scrollbutton-down-background); background-image: var(--uc-scrollbutton-down-background);
} }
scrollbox[orient="horizontal"], scrollbox[orient="horizontal"],