Tabs background color: FF 2.0 default theme

Tabs background color: FF 2.0 default theme
99

The author has marked this style as obsolete.

*****
By Greg S
Last updated Sep 28 2006
0 installs this week, 391 total.

It appears that 2.0 default theme is using semi transparent images for it's background which means you can change the background color with stylish to achieve a different look. I've scanned through "App Styles" and didn't find where this has been done but I could have missed it. If it has, please post and I will delete the style. This is for content tabs and I'm sure other elements need to be added

9/28/06: Added selected, hover & text color changes. Don't forget to change them colors

Install options

Feedback

Reviews

achilles said on Feb 22 2007

Have modified the code a bit to separate out the Unselected, Hovered and Selected Tabs Colors (& Text Colors for each of them), hope it helps:

/****************************************************************Begin Code*****************************************************************************/

/*:::::::::::::::::::::::::::::::::::::::: Tabs Appearance in Firefox 2 (Please Change Colors as per your Liking) :::::::::::::::::::::::::::::::::::::::::::*/

/* Unselected Tabs Color */
.tab-image-left,
.tab-image-right,
.tab-image-middle,
.tab-close-button,
.scrollbutton-up,
.scrollbutton-down-box,
.tabs-alltabs-box
{
background-color: rgb(255, 255, 255) !important;
}

/* Hovered Tabs Color */
.tabbrowser-tab:not([selected="true"]):hover > .tab-image-left,
.tabbrowser-tab:not([selected="true"]):hover > .tab-image-right,
.tabbrowser-tab:not([selected="true"]):hover > .tab-image-middle,
.tabbrowser-tab:not([selected="true"]):hover > .tab-close-button
{
background-color: rgb(220, 220, 220) !important;
}

/* Selected Tab Color */
.tabs-bottom,
.tabbrowser-tab[selected="true"] > .tab-image-left,
.tabbrowser-tab[selected="true"] > .tab-image-right,
.tabbrowser-tab[selected="true"] > .tab-image-middle,
.tabbrowser-tab[selected="true"] > .tab-close-button
{
background-color: rgb(149, 179, 215) !important;
}

/* Unselected Tab Text Color*/
.tabbrowser-tab > .tab-image-middle > .tab-text
{
color: rgb(79, 129, 189) !important;
}

/* Hovered Tab Text Color */
.tabbrowser-tab:not([selected="true"]):hover > .tab-image-middle > .tab-text {
color: #000000 !important;
}

/* Selected Tab Text Color */
.tabbrowser-tab[selected="true"] > .tab-image-middle > .tab-text
{
color: #000000 !important;
}

/****************************************************************End Code*****************************************************************************/ *****

jw25 said on Oct 25 2006

Nice, thanks. Please add the tabbar or tabbrowser-strip(?) color.
How do I use different colors for active and hover? ****

Jhon said on Sep 27 2006

Excellent, good discovery!

I use these colors in the css:

.tab-image-left,
.tab-image-right,
.tab-image-middle,
.tab-close-button,
.scrollbutton-up,
.scrollbutton-down-box,
.tabs-alltabs-box
{
color: rgb(255,255,255) !important;
background-color: rgb(61,119,203) !important;
} ****

Paulfox said on Sep 27 2006

In light of your brilliant work long ago on a "Post your userstyles thread," where I got my start from you and Raila, I knew it would be YOU who fixed this Greg! Thanks so much. I actually requested this 2 weeks ago on the Stylish forum, no takers. My original stuff for tabs was all from your post last year, long before Stylish - and now you've fixed it for 2.0!! Woo Hoo!! I've got some of my own that work, but the elements ".tab-image-left, .tab-image-middle, .tab-image-right, .tabs-alltabs-box" were what made the difference, and I couldn't "get" those. Cheers. And no, it's nowhere else to be found here.

Now, if only the "hover" color could be different I'd be pretty much back to your "old" css that worked so well until 2.0. Thanks very, very much indeed. Because of you, at least we;'re now "getting close" to tab color control once again. CHEERS!! *****

makondo said on Sep 26 2006

Great! Thanks, Greg! I didn't have to change anything - nothing here is "too cramped" and i don't see any scrolls (must be TMP?). But, changing the color to an image wiped off the tab look, they now look like blocks. Which is OK with me, i actually like it!
Thanks again!! *****