Question & useful info on quantum tab close buttons

Talk about add-ons and extension development.
Post Reply
phkhgh
Posts: 845
Joined: January 25th, 2007, 2:49 pm
Location: So. U.S.A.

Question & useful info on quantum tab close buttons

Post by phkhgh »

I thought I'd post what finally worked to hide 'X' tab close buttons until hovered.
And ask about eliminating or altering the tab title "text fading" and use more width of the tabs.
Fx quantum's UI is really jacked.

In Fx 62.0.2 (Linux), the code that hid tab close buttons until hovered was:

Code: Select all

/* Show close button on hover 
 * https://www.reddit.com/r/FirefoxCSS/comments/7dclp7/multirow_tabs_in_ff57/ */
.tab-close-button{ display: none }
.tabbrowser-tab:not([pinned]):hover .tab-close-button{
    display: -moz-box !important
} 
It doesn't pop, spin or flash - just hides the X til the tab's hovered (appears quickly for me).
Now, if I can use a little more of the unhovered / unselected tab's width for the title. About one letter or so MORE seems to be visible, that would be hidden if the close button was permanent.
So, if one letter of the tab title can occupy space beneath where the X WILL BE - when hovered, why not use most of the space beneath where the X will be?
Is that possible?

For my own education I wanted to ask why these codes didn't work, that who ever listed them claimed they worked perfectly in Fx 57+?
One that DID NOT WORK was:

Code: Select all

/* Hide tabs close button until tab is hovered. Didn't seem work 62.0.2 */

.tabbrowser-tab:not(:hover) .tab-close-button{ display:none; }
.tabbrowser-tab:not([pinned]):hover .tab-close-button{ display:block !important; }
 
I assume the one above incorrectly used "display: block" instead of display: -moz-box? Did Mozilla change the code for that from between v57 & v62?

Another that DID NOT WORK was:

Code: Select all

/* Hide tabs close button until tab is hovered */
/* From mozillazine or supp.mozilla - didn't show close button only when hover
 * supposedly, .tabbrowser-tabs was changed to #tabbrowser-tabs */
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([pinned="true"]):hover .tab-close-button:not([selected="true"]) {
  display: -moz-box !important; }
Post Reply