Share your custom Firefox/Minefield 4 stylish scripts

[Frylock86]

This provides complete transparency to the nav bar:

#navigator-toolbox[tabsontop="true"] #nav-bar {
                background: none !important; 
                border-color: transparent !important;
}

That did it! Thanks! :D

[luving]

Just curious because I'm rather new to all this css stuff

Is there any advantage of border-color: transparent over border: none?

Can't see any difference between our code snippets.

[xMetian]

I've got a little question, well two.

Is it possible to change the bookmarks font size and those separators ?.

And if it is possible to change the separators , is it also possible to use an img for them ?.

Thanks! :D

( Awesome thread btw, give me a lot of ideas to play with ).

[xMetian]

(( SORRY if this is a double post.. For some reasons I can't edit my old post O.o ))

About the font size, don't mind. I found it already :blush:

[foxxyn8]

Just curious because I'm rather new to all this css stuff

Is there any advantage of border-color: transparent over border: none?

Can't see any difference between our code snippets.

border:none completely removes the border while border-color:transparent maintains the border while making it transparent.

Basically you lose the width of the border if you remove it completely.

border is shorthand for border-style/width/color, so you're setting the style to "none" which removes the border completely.

border: none is the same as border-style: none

[flexkeyboard]

does anyone know how to reorder the dropmarker after the refresh/stop button?

[luving]

border:none completely removes the border while border-color:transparent maintains the border while making it transparent.

Basically you lose the width of the border if you remove it completely.

border is shorthand for border-style/width/color, so you're setting the style to "none" which removes the border completely.

border: none is the same as border-style: none

Thanks

Good explanation :)

[Bringo]

I am trying to update this style for Firefox 4.0 RC but I have a problem.

http://userstyles.org/styles/40211/

Some AppMenu items without "iconic=true" attribute can't be styled as an iconic menu, such as appmenu_newTab (New Tab), #appmenu_customize (Options), #appmenu_help (Help).

I tried the usual

-moz-binding:url("chrome://global/content/bindings/menu.xml#menuitem-iconic-noaccel")

to add the icon, but it didn't work.

so I tried all possible bindings I could think of, nothing worked.

any ideas? please!

[foxxyn8]

I am trying to update this style for Firefox 4.0 RC but I have a problem.

http://userstyles.org/styles/40211/

Some AppMenu items without "iconic=true" attribute can't be styled as an iconic menu, such as appmenu_newTab (New Tab), #appmenu_customize (Options), #appmenu_help (Help).

I tried the usual

-moz-binding:url("chrome://global/content/bindings/menu.xml#menuitem-iconic-noaccel")

to add the icon, but it didn't work.

so I tried all possible bindings I could think of, nothing worked.

any ideas? please!

adding .splitmenu-menuitem to

menuitem[label]:not(.searchbar-engine-menuitem)
{-moz-binding:url("chrome://global/content/bindings/menu.xml#menuitem-iconic-noaccel")!important}

will make those three icons show, but you'll still have to adjust margins/padding for alignment

[Semtex]

Hi

I'm using this extension https://addons.mozilla.org/pl/firefox/addon/extended-statusbar/ to show load speed and other loading values, like You can see on screen, bar is quite long and infos are only in 1/3 parts of length:

So I was wonder if there is possibility to change this bar length to red line and make it bit flexible, so if there is more infos, bar will be bit longer or shorter.

lol, I hope it is clear?

[trag3dy]

Can some one help me fix this code so it's updated for Firefox 4? It was made way back in Firefox 2 I think when app tabs didn't exist. :laugh:

Right now it works just fine but it widens the app tabs as well and that sort of breaks things:

@-moz-document url("chrome://browser/content/browser.xul") {
tab[selected="true"] {
min-width: 250px !important;
}
tab:not([selected="true"]) {
max-width: 150px !important;
}
/* comment the following if you find the resize on hover bothersome */
tab:not([selected="true"]):hover {
min-width: 250px !important;
}
}

Also, does anyone know about using gdipp.dll with Firefox 4? I currently only have the 64-bit version installed but I read that only works with 64-bit programs (oddly enough..) and I would need to install the x86 version to make it work with non 64-bit programs like firefox. If it can eve work with firefox that is.

[luving]

Can some one help me fix this code so it's updated for Firefox 4? It was made way back in Firefox 2 I think when app tabs didn't exist. :laugh:

Right now it works just fine but it widens the app tabs as well and that sort of breaks things:

@-moz-document url("chrome://browser/content/browser.xul") {
tab[selected="true"] {
min-width: 250px !important;
}
tab:not([selected="true"]) {
max-width: 150px !important;
}
/* comment the following if you find the resize on hover bothersome */
tab:not([selected="true"]):hover {
min-width: 250px !important;
}
}

Also, does anyone know about using gdipp.dll with Firefox 4? I currently only have the 64-bit version installed but I read that only works with 64-bit programs (oddly enough..) and I would need to install the x86 version to make it work with non 64-bit programs like firefox. If it can eve work with firefox that is.

So you want to avoid that this code is affecting app tabs right?

If that is what you mean try this:

tab:not([pinned])[selected="true"] {
min-width: 250px !important;
}
tab:not([pinned]):not([selected="true"]) {
max-width: 150px !important;
}
/* comment the following if you find the resize on hover bothersome */
tab:not([pinned]):not([selected="true"]):hover {
min-width: 250px !important;
}

[trag3dy]

So you don't want this code to work for app tabs right?

If this is what you mean try this:

tab:not([pinned])[selected="true"] {
min-width: 250px !important;
}
tab:not([pinned]):not([selected="true"]) {
max-width: 150px !important;
}
/* comment the following if you find the resize on hover bothersome */
tab:not([pinned]):not([selected="true"]):hover {
min-width: 250px !important;
}

That works but it seems to restrict tabs to the min-width until the tab is hovered.

Edit: fixed.. I just removed the min-width part. Thanks! And welcome to Neowin! :yes:

[luving]

That works but it seems to restrict tabs to the min-width until the tab is hovered.

Edit: fixed.. I just removed the min-width part. Thanks! And welcome to Neowin! :yes:

Thank you :)

Isn't this code supposed to restrict the min-width?

Make sure to check tab overflow when you take that part out.

Looks weird when it gets 250px on hover and then jumps back to the overflow-width once you select it.

Or do you mean something else?

Edit: found a bug in that code. When you close a tab while its hovered but not selected it gets a "ghost tab" and just leaves an empty space. This works for me (still with the min-width part in it)

tab:not([pinned])[selected="true"] {
	min-width: 250px !important;
}

tab:not([pinned]):not([selected="true"]) {
	max-width: 150px !important;
}

tab:not([fadein]):not([pinned]):not([selected="true"]) {
 	max-width: 1px !important;
 	min-width: 1px !important;
}

/* comment the following if you find the resize on hover bothersome */
	tab:not([pinned]):not([selected="true"]):hover {
	min-width: 250px !important;
}

Edit 2: close animation is choppy for a reason i can't see at the moment

[trag3dy]

I was getting the ghost tabs and choppy close animation as well. Anyways, thanks again! I'll try that new code.

[luving]

I was getting the ghost tabs and choppy close animation as well. Anyways, thanks again! I'll try that new code.

I have NO clue why this fixed it but this is working for me.

(Again with min-width because I'm not sure what you meant)

tab:not([pinned])[selected="true"] {
        min-width: 250px !important;
}

tab:not([pinned]):not([selected="true"]) {
        max-width: 150px !important;
}

tab:not([fadein]):not([selected="true"]) {
        max-width: 1px !important;
        min-width: 1px !important;
}

/* comment the following if you find the resize on hover bothersome */
        tab[fadein]:not([pinned]):not([selected="true"]):hover {
        min-width: 250px !important;
}

[trag3dy]

It's hard to describe exactly. :laugh:

I wanted the tab width to follow normal behavior but not shrink past the 150px width no matter what. Not be restricted to 150px until it's hovered. I hope that makes sense because I'm not sure exactly how to describe what I was trying to achieve.

So until the tab bar is filled up the tab width would stay at 250px and then shrink but not get smaller than 150px??? I don't know, again I hope it makes sense because I'm just confusing myself, now. :rofl:

[luving]

It's hard to describe exactly. :laugh:

I wanted the tab width to follow normal behavior but not shrink past the 150px width no matter what. Not be restricted to 150px until it's hovered. I hope that makes sense because I'm not sure exactly how to describe what I was trying to achieve.

So until the tab bar is filled up the tab width would stay at 250px and then shrink but not get smaller than 150px??? I don't know, again I hope it makes sense because I'm just confusing myself, now. :rofl:

So ALL tabs are supposed to be 250px until overflow

With overflow only the selected tab is supposed to be 250px, all other tabs normal behavior but restricted to min 150px?

Again: I don't see why tab animation got fixed but its working for me

tab:not([pinned])[selected="true"] {
        min-width: 250px !important;
}

tab:not([pinned]):not([selected="true"]) {
        min-width: 150px !important;
}

tab:not([fadein]):not([selected="true"]) {
        max-width: 1px !important;
        min-width: 1px !important;
}

/* comment the following if you find the resize on hover bothersome */
        tab[fadein]:not([pinned]):not([selected="true"]):hover {
        min-width: 250px !important;
}

[trag3dy]

Thanks! That works perfect. (Y)

Could it just be that the old code I had was very crude and not efficient with all the changes made to Firefox 3 and 4? Like I said before, it was really old.

[trag3dy]

tab:not([pinned])[selected="true"] {
        min-width: 250px !important;
}

tab:not([pinned]):not([selected="true"]) {
        min-width: 150px !important;
}

tab:not([fadein]):not([selected="true"]) {
        max-width: 1px !important;
        min-width: 1px !important;
}

/* comment the following if you find the resize on hover bothersome */
        tab[fadein]:not([pinned]):not([selected="true"]):hover {
        min-width: 250px !important;
}

Can't edit my post so..yeah..new post. I found a flaw in this. It breaks the tabs in the stratiform addon. :wacko:

[SoapyHamHocks Member]

Can't edit my post so..yeah..new post. I found a flaw in this. It breaks the tabs in the stratiform addon. :wacko:

What exactly are you trying to do? Do you want the selected tab to be larger than the inactive ones?

[trag3dy]

What exactly are you trying to do? Do you want the selected tab to be larger than the inactive ones?

I was trying to make it so that when I had a lot of tabs open the selected tab (but not pinned tabs) would be the full 250px width, and also the hovered tab resizes to full width as well so I can see the name. Not a huge deal if it can't be made to work without breaking other addons.

[SoapyHamHocks Member]

I was trying to make it so that when I had a lot of tabs open the selected tab (but not pinned tabs) would be the full 250px width, and also the hovered tab resizes to full width as well so I can see the name. Not a huge deal if it can't be made to work without breaking other addons.

I see. Give this a try:

.tabbrowser-tab[fadein] {
  max-width: 150px !important;
}

.tabbrowser-tab[fadein]:not([pinned])[selected],
.tabbrowser-tab[fadein]:not([pinned]):hover {
  width: 250px !important;
  max-width: 250px !important;
}

[trag3dy]

Works great, and it doesn't break the tabs in stratiform. Thanks!

[dnast]

^ Dude. Your sig. Seriously?