Not a bug... but cannot control tab height anymore in FF96.0.2 :(
Closed this issue · 9 comments
Hi Izheil,
This is not really a bug from your side, but I was using for many years with your advice:
#tabbrowser-tabs {
--tab-min-height: 15px !important;
margin-left: 0px !important;
height: 15px !important;
}
And since FF96.0.2, it seems that it doesn’t work anymore, tabs height have increased and I cannot find the way to make them smaller, and then the whole multirow tabs takes a bigger height.
Then I have set the "Compact" mode but it is not compact enough for me.
So I have changed the "inherit" to 15px in MultiRowTabLiteforFx.uc (same height as it was before with the code you kindly advised to me in userChrome), but it doesn’t change anything.
Do you have any idea of how I can come back to smaller tab height?
Thank you,
CanIask ;)
I updated multirow now with some minor changes to better support smaller tab heights, but basically what you should change would be these lines:
#TabsToolbar {
--tab-min-height: inherit !important;
}
/* These below control the padding of the new tab button and min/max/close buttons respectively.
YOU DON'T NEED TO CHANGE THESE unless you want to use values of --tab-min-height lower than 20px.
Before changing them, you need to UNCOMMENT the 2 rules below for them TO TAKE EFFECT. */
/*
#TabsToolbar {
--toolbarbutton-inner-padding: inherit !important;
}
.titlebar-buttonbox .titlebar-button {
padding-top: 8px !important;
padding-bottom: 8px !important;
}
*/
As you can see the 2 lower rules are commented out, since they are only useful when making tabs smaller. You will have to play with those values after uncommenting them.
The first step then is uncommenting them removing the starting /*
and the ending */
so that it looks like:
#TabsToolbar {
--toolbarbutton-inner-padding: inherit !important;
}
.titlebar-buttonbox .titlebar-button {
padding-top: 8px !important;
padding-bottom: 8px !important;
}
After that, you will have to remove part of the padding of other elements for the tabs to actually resize. to anything smaller than 20px.
--toolbarbutton-inner-padding
changes the inner padding of the new tab button. Giving it a value of 3px-0px would make the tabs have a lower height limit.
The .titlebar-buttonbox .titlebar-button
paddings will make the min/max/close buttons smaller as well so that the tab bar won't appear "floating".
If you have any other button on the tab bar (like extension buttons), you'll have to place them somewhere else, or they will also limit the min height.
Thank you Izheil,
I forgot to say that I tried before to uncomment the 2 rules you mentioned (I saw the little explanation above), but without "removing part of the padding of other elements", and of course it didn’t work.
So now I did it again but I must say I don’t really catch what it means to "remove part of the padding of other elements for the tabs"... Should I delete all other rules containing the word "padding"? I believe not...
It seems, as far as I can see, that rows have a little bit reduced except the last one, which has the + for a new tab and which has increased making the all rows taller.
I’ll keep trying !
EDIT : back to previous change ! In fact it seems that compared to before FF96.0.2, this is the gap between each rows that have increased a little, making the total taller.
By the way, when making all these changes, should I leave the "Compact" mode ? Or do these changes of the rules take precedence over the "Compact" mode anyway?
There are 2 paddings, the one of the + button, and the one around tabs.
The one from --toolbarbutton-inner-padding
is the + one, the other 2 paddings are the ones around the tabs (that will just change the padding of the min/max/button, so it should only affect rows when there is only 1 row).
Let's say you want a 15px row of tabs:
#TabsToolbar {
--tab-min-height: 15px !important;
}
/* These below control the padding of the new tab button and min/max/close buttons respectively.
YOU DON'T NEED TO CHANGE THESE unless you want to use values of --tab-min-height lower than 20px.
Before changing them, you need to UNCOMMENT the 2 rules below for them TO TAKE EFFECT. */
#TabsToolbar {
--toolbarbutton-inner-padding: 0 !important;
}
.titlebar-buttonbox .titlebar-button {
padding-top: 0px !important;
padding-bottom: 0px !important;
}
^ This will give the most compact way to achieve this.
If you change the --toolbarbutton-inner-padding
it will increase the tab size of the last row (where the + button is), since it adapts to the buttons inside that row.
As for using compact mode, it's recommended if you are going below 29px tab height (even if you change it through here), since that way it won't show the "playing" thing on a second row inside each tab, and will always show content in 1 row.
So I replaced the whole code you kindly provided above and it doesn’t change anything compared to what we have with the "Compact’.
Also, on top of these taller tabs, the distance between each row seems to have increased compared to what was existing before FF96.0.2, which makes the total of rows taller.
It looks like, this new version does not care of what is in the MultiRowTabLiteforFx.uc.js file, at least for the tabs height... :(
So good to see that, at least, it can work. But there must be something I do not correctly understand and then replicate.
I inserted the modified code you proposed, changed --toolbarbutton-inner-padding
to 0px
...and it does not change what I can have with the "Compact" mode :(
Are you using the lastest version from the repository? I added some changes to the repository version to better fit the tab height after the first reply.
Are you using the lastest version from the repository? I added some changes to the repository version to better fit the tab height after the first reply.
:o That was the reason... Sorry for bothering you on this.
This is all good now. In fact, now, 20px is better than 15 ;)
Thank you very much Izheil. You can keep the explanation in the file as I believe such possibility may interest a lot of people.
Feliz año nuevo ! by the way ;)
Thanks, happy new year to you too!
I'll add some more explanations on the file.