Tab Mix Plus

I would like to see a few tweaks added to the display/appearance:

2) Allow color change to the "open a new tab" tab (the little tab with a plus sign in it),
2) Allow adjustment of the tab height, including the little tab mentioned above (as opposed to width, which is already available),
3) Allow shading/gradation (lighter on top, darker on bottom) in the tab color.

Thanks,
Ellen

Hi,

I never got any kind of response to this request, so I'm bringing it up again. If nothing else, could the developer please at least add to Display > Tab > Customize color change to the "open a new tab" tab? I find it sticks out like a sore thumb.

Thanks,
Ellen

"open a new tab" is not a tab, it's toolbar button and has nothing to do with TMP, it's an Fx button. Changing its color will do you no good as it's an image and you need to change the image. You can do this by using Stylish or userChrom.css
You can do the same for tabs (height, gradient) in the same manner.
If you need help with that, i can help you but you can also search the Stylish site for styles and post in the forum if you need help with that.

For instance, New tab button color:

#new-tab-button, .tabs-newtab-button
{ -moz-appearance: none !important;
background-color: red !important; }


But you can change the image to your liking with something like this, for instance:





You can also change the bg for that image but it will take some tweaking to get it right.

There many styles available for tabs. You can use a code like this to change colors for tabs and New tab button:

.tabbrowser-tabs tab, #new-tab-button, .tabs-newtab-button
{ -moz-appearance: none !important;
background-image: -moz-linear-gradient(top, #ccc, #4E5A6C, #25456C)!important; }



The tabs height can be changed with something like this:

.tabbrowser-tab
{ -moz-appearance: none !important;
height: 21px !important; }

I don't think TMP should fiddle with tabs height 'cause there's just too much that can go wrong, like multi-row display, diff. themes, personas,etc.

_________________
VistaHP/Fx latest beta/TMP latest dev.build/Troubleshooting TMP/My styles

Thank you, I tried the code that you gave.

I like that there is no background shading, but I would prefer that I had the option of matching it to the 10% shading that I have for my "other" tabs. And then, what I would like is simply to leave the plus sign as it is. I'm not crazy about that little folder icon that you put in there. How can I do that?

Thanks,
Ellen

Not easy. As i said, it's an image. You have to find another one to replace it but you can't change the color of the image unless you know how to use an image editor and know how to open the Fx omnja folder where the default images are.
You can search the net for an image of '+' sign and replace the one i show above as an example.
The tabs colors is also an example. I don't know what color are your tabs and what color you want them to be.

Use this for the button (just an example image! the code is valid):

_________________
VistaHP/Fx latest beta/TMP latest dev.build/Troubleshooting TMP/My styles

The background color is just the default FF background color, some sort of charcoal gray or something. Anyway, in TMP, I have it set for 10%, so it is just a little bit darker than the rest of the toolbar.

Is there no way to just keep the FF plus sign while changing the background?

No, not that i know of. See my post above. It's an image.

About your tabs, i don't understand what you want. You don't want to change the color now?
Don't set anything in the TMP options (uncheck the tabs style) and try this style which you can customize to any color you want:

.tabbrowser-tabs tab, #new-tab-button, .tabs-newtab-button
{ -moz-appearance: none !important;
background-image: -moz-linear-gradient(top, #ccc, #777)!important; }

#ccc - almost white, #777 - grey. Change them as you wish

_________________
VistaHP/Fx latest beta/TMP latest dev.build/Troubleshooting TMP/My styles

That's not what I'm looking for, but if it were transparent, it might be. How do I make it transparent, a 10% transparency?

#new-tab-button, .tabs-newtab-button
{ background-color: transparent !important;
background-image: url() !important; }

Make what transparent? There many, many styles on us.o that make tabs transparent fully or partially. What's your OS. Transparency will look good only with Vista/Win7 as the toolbar uses 'glass' (aero) effect.
Can you be more specific, please?

Try and change to your liking any of this:

_________________
VistaHP/Fx latest beta/TMP latest dev.build/Troubleshooting TMP/My styles

That top code is almost there. I meant not total absence of color but a 10% grey (like 6D6D6D), just a touch. I am able to add that to the inactive tabs via TMP, but not to the new tab button. But it's already looking a whole lot better.

Later: tweaked the bottom code to my liking (please understand I know hardly anything about coding) and it looks good. I've got the gradient, I've got the transparency, except that now there is no difference between the active tab and the inactive tabs. How do I get the active tab to be more opaque?

instead of #6D6D6D, use rgba(103,103,103,.5), something like this:



1103,103,103 - is the color code and the .7 is it's intensity (opacity). You can try .5, .9, .1 ..... or whatever works for you. Or you can use its HEX value of #6D6D6D at the bottom which is not transparent but the top part is [rgba(190,190,190, .5)].

Something like this?



Here's a pic taken with the last code, you can see some color bg behind tabs:

_________________
VistaHP/Fx latest beta/TMP latest dev.build/Troubleshooting TMP/My styles

Right, but for the active tab?

What does it ^ mean?

_________________
VistaHP/Fx latest beta/TMP latest dev.build/Troubleshooting TMP/My styles

I don't know. I don't know why you're asking.

OK, since i get very little feedback from you and it's taking too much of my time as is, here:

this are IDs for other tabs:

/* ============ active tab */

tabbrowser-tab[selected="true"]:not([pinned])
{ }

.tabbrowser-tab[selected="true"][pinned]
{ }


/* ============ read tabs */

.tabbrowser-tab[selected="false"],
.tabbrowser-tab:not([selected="true"])[visited]
{ }

You can use the same code pattern from the codes above and insert it w/in the curly brackets. You can change colors as i've shown you above. You can find colors on the web by searching, for instance: http://www.colorizer.org , http://www.webtutorialplus.com/html-color-picker.aspx, http://www.uize.com/examples/sortable-color-table.html , etc.)

You can use :not([pinned]) and [pinned] or delete those portions if you don't use pinned tabs.

I have a style for borderless tabs which is probably too 'dramatic' for you but it has almost all the IDs for everything 'tab' in it and you're welcome to look in, copy, experiment and get it just right for you. Should you have a specific problem/question, post a screenshot and describe exactly what you'd like to do.
Good Luck!

Oh, and you're welcome.

_________________
VistaHP/Fx latest beta/TMP latest dev.build/Troubleshooting TMP/My styles