Figure out some kind of autohiding mechanism for multi-row tabs

[sonofevil]

These two stylesheets don't work well together. In particular, the height of the "hidden" tabs toolbar is still governed by the height of the multiple tab row, so just a big empty space if you have several rows. There is also the problem that if you right-click a tab, the tab bar gets hidden. But I assume this is because the context menu blocks the hover property, and I'm not sure if that's fixable.

I tried writing my own fixes, but I don't understand the logic of autohide_tabstoolbar.css and my results are very clunky. Would love a compatibility patch that makes them play together in an intuitive way.

[MrOtherGuy]

This sounds rather difficult because you can have variable number of tab rows. It would be kinda straightforward to set it up if the number of rows is fixed, but I think the autohiding mechanism needs to be something totally different than what autohide_tabstoolbar is doing.

[MrOtherGuy]

In fact, it is pretty simple to set it up such that you can set the number of rows for when toolbox is hovered and separately when it's not. So you could have 1 row of tabs visible when not hovered but then several for hovered state - but the issue becomes that this still won't work super nicely because hovering will then also move the web-content down. In autohide_tabstoolbar the web-content area is not moved providing much nicer experience.

[sonofevil]

In fact, it is pretty simple to set it up such that you can set the number of rows for when toolbox is hovered and separately when it's not. So you could have 1 row of tabs visible when not hovered but then several for hovered state - but the issue becomes that this still won't work super nicely because hovering will then also move the web-content down. In autohide_tabstoolbar the web-content area is not moved providing much nicer experience.

A problem I'm running into is that the variable must apply inside a shadow-root, but the hover pseudo-class applies outside the shadow-root. I tried

scrollbox:host(#navigator-toolbox:hover #tabbrowser-arrowscrollbox)

but that doesn't work.

[MrOtherGuy]

Variables go into the shadow root, so you can do stuff like:

#navigator-toolbox{
  --my-var: 3;
}
#navigator-toolbox:hover{
  --my-var: 1
}
scrollbox{ /* somewhere within navigator-toolbox */
  height: calc(20px * var(--my-var))
}

[sonofevil]

Oh, you're right. Idk why I didn't try it like that.

[sonofevil]

This sounds rather difficult because you can have variable number of tab rows. It would be kinda straightforward to set it up if the number of rows is fixed, but I think the autohiding mechanism needs to be something totally different than what autohide_tabstoolbar is doing.

Surprisingly this seems to work so far:

#navigator-toolbox-background {
    height: 100px;
}

:root{
  --multirow-n-rows: 0.8;
}

#navigator-toolbox:hover, 
*:has(#tabContextMenu:hover) #navigator-toolbox, 
*:has(#toolbar-context-menu:hover) #navigator-toolbox, 
#navigator-toolbox[movingtab] {
    overflow: visible !important;
    z-index: 1;
    height: min-content;
    --multirow-n-rows: 9 !important;
}

However, the 100px height is obviously a placeholder that needs to be replaced with a calculation of the actual height from available variables. This is gonna take me a while to figure out I think.

[MrOtherGuy]

That's pretty much what I tried figured as well. But you must be running maybe an old ESR Firefox because navigator-toolbox-bakcground haven't existed in a long while - so you might want to do something about that pretty soon since ESR 128 is just around the corner.

[sonofevil]

I'm using Waterfox. I'm actually surprised they haven't pulled the browser html from recent Firefox. Perhaps this has something to do with legacy addon support.

[MrOtherGuy]

Seems that I can make the behavior somewhat okay, if you accept that tabs toolbar expands only when tabs toolbar itself is hovered - not the when the any part of the whole toolbox is hovered. Then you can have the tabs toolbar cover the toolbar below it which I suppose is kinda okay.

Kinda hard to explain, but here is how that would go

[sonofevil]

I think I'm going to give up on the tab bar and move on to managing tabs with the sidebar, so I'm dropping this request. My problem is that in the collapsed state, when a single line is displayed, I see no way to display specifically the line with the active tab. And if I go for full hiding, I might as well use the sidebar.

Feel free to close if you don't want to add this style.

[MrOtherGuy]

Right, I'll just rename this with a topic to figure out some kind of autohiding mechanism for multi-row tabs.

I don't know what that should be like, or how it should work, but doesn't hurt to have a issue tracked in case someone comes up with a good solution.