Share your custom Firefox/Minefield 4 stylish scripts

[foxxyn8]

Thanks a lot! As always the man with the answers. :D

What about the line between tab-bar and nav-bar? I can't seem to manage to remove it...

LE: Ignore this. I saw Drifus's post later, fixed it know. Thanks Drifus!

You don't need to adjust the margin. A new background-image value was added to #TabsToolbar, that's the line you're seeing.

#TabsToolbar {
        background-image: none !important
}

[xoperax]

Can someone please help me write a script that replace FF 4 "list all tabs" by "undo closed tab". Also, please help me to change firefox location toolbar and button color to white, inactive tab color is white, active tab color is firefox's inactive tab color. Thanks.

[Drifus]

You don't need to adjust the margin. A new background-image value was added to #TabsToolbar, that's the line you're seeing.

#TabsToolbar {
        background-image: none !important
}

Change the margin may be needed in certain styles. Here I needed that. Without the negative margin, an empty line stands in place of the background, when in maximized mode.

Check my style please.

Drifus - Firefox 4 project - aero clean

By the way, double click to open a new tab no longer works with the tabs in the titlebar. Could you help me with this?

#navigator-toolbox > #TabsToolbar {
	-moz-binding: url("chrome://global/content/bindings/toolbar.xml#toolbar") !important;
}

Related bug:

https://bugzilla.mozilla.org/show_bug.cgi?id=575248

[foxxyn8]

Change the margin may be needed in certain styles. Here I needed that. Without the negative margin, an empty line stands in place of the background, when in maximized mode.

Check my style please.

Drifus - Firefox 4 project - aero clean

By the way, double click to open a new tab no longer works with the tabs in the titlebar. Could you help me with this?

#navigator-toolbox > #TabsToolbar {
	-moz-binding: url("chrome://global/content/bindings/toolbar.xml#toolbar") !important;
}

Related bug:

1 - On you style (without your margin fix) that line is the 1px top margin of #nav-bar.. Set it and the bottom border of #TabsToolbar to 0 and it goes away. If you need that pixel use padding instead. Nice looking style BTW. :)

2- I don't have a solution for that. It works in a normal window, but not a maxmized one. Thank you, Mozilla. :hmmm:

[+Gary7 Subscriber²]

How would I be able to glass or make transparent the navigational toolbar? Any ideas would be appreciated. Or just to change it to the color below:

[foxxyn8]

How would I be able to glass or make transparent the navigational toolbar? Any ideas would be appreciated. Or just to change it to the color below:

transparent:

#nav-bar { 
        background:none !important; 
        border-color: transparent !important
}

your colors:

#nav-bar{
        background-color: rgb(117, 203, 235) !important;
        background-image:none !important
}

your colors with opacity:

#nav-bar{
        background-color: rgba(117, 203, 235, 0.5) !important;
        background-image:none !important
}

[+Gary7 Subscriber²]

Thanks Foxy!

[CGar]

So I'm currently using the following code to make the new tab page glassed

#appcontent,
#content > tabbox > tabpanels {
  background-color: transparent !important;
}

#main-window[stylish-url="about:blank"]:not([onclose="PrintUtils.exitPrintPreview(); return false;"]) #content browser{ 
opacity: 0 !important;
}

However, whenever I use any personas, they tend to look like this

Is there anything I can do so that the persona doesn't run into the tab?

[foxxyn8]

you can either disable the persona on that tab:

#main-window[stylish-url="about:blank"][lightweightthemes="true"] {
background: none !important;
}

or

you can move the background image up so that it's bottom justified with the bottom-most toolbar:

#main-window[stylish-url="about:blank"][lightweightthemes="true"] {
background-color: transparent !important;
background-position: 100% -24.5% !important;
}

or if you can get the url to the background-image of your persona you can do it like this:

#main-window[stylish-url="about:blank"][lightweightthemes="true"] {
background: none !important;
}

#main-window[stylish-url="about:blank"][lightweightthemes="true"] #navigator-toolbox  {
background-image: url("http://www.getpersonas.com/static/1/8/5918/1232849758499.jpg")!important;
background-position: 100% 3.5% !important;
}

Other than that I don't have a solution. I'm open to suggestions though.

[CGar]

I appreciate the speedy response foxxyn8! I tried them out, but they don't quite achieve what I was hoping.

It seems like this may not be solved by a simple Stylish code segment, which is a shame, cause I really like some of these personas, but I also love having a completely glassed about:blank

I also noticed that on Vista, the image repeats over and over unlike on 7, so there's no glass at all.

[Drifus]

1 - On you style (without your margin fix) that line is the 1px top margin of #nav-bar.. Set it and the bottom border of #TabsToolbar to 0 and it goes away. If you need that pixel use padding instead. Nice looking style BTW. :)

2- I don't have a solution for that. It works in a normal window, but not a maxmized one. Thank you, Mozilla. :hmmm:

Thanks foxxyn8.

1- But without that margin at the nav-bar, the tabs are 1 pixel overlapped with it. Because I removed the border-top of the nav-bar.

Padding-top in the nav-bar or padding-bottom in the tabbar not fix that space here.

2 - This is a funny bug. I looked at all .js. .xul .css in omni. Nothing can give me some clue.

[+Gary7 Subscriber²]

http://userstyles.org/styles/44045?r=1297542182

The above style is a Tribute to Foxxny8 for all of the help that he has shown me and this community. Great Job Foxxy!

[ajua]

O.K.! Working!

You did something for Identity Box while using S4E? Looking a bit out of the box... Site & Fav icons always disabled.

I use the latest MineField version. It isn't FireFox beta 6 btw. Just made it look like.

What colors are you using for the toolbar and tabs? Can you share your script?

I would also like to know how to change the bookmark folder icons.

[Ziz4rD]

I create a new style. Only look at the picture.

http://userstyles.org/styles/44070

but, need help to remove the white and gray line, when the window is maximized have solucion, but when is normal, there's the plroblem.

[foxxyn8]

http://userstyles.org/styles/44045?r=1297542182

The above style is a Tribute to Foxxny8 for all of the help that he has shown me and this community. Great Job Foxxy!

Thanks, Gary! That looks pretty cool.

:D

Thanks foxxyn8.

1- But without that margin at the nav-bar, the tabs are 1 pixel overlapped with it. Because I removed the border-top of the nav-bar.

Padding-top in the nav-bar or padding-bottom in the tabbar not fix that space here.

2 - This is a funny bug. I looked at all .js. .xul .css in omni. Nothing can give me some clue.

This is what I see with a 1px margin-top for the navbar and a 0px margin-bottom for the tab bar:

And this is with a 0px margin-top for navbar and 0px margin-bottom for tabbar

I don't see any overlap

[grayscale]

foxxyn8, I can't get this to work.Bookmarks toolbar does not autohide. Using ff4beta11.

http://userstyles.org/styles/43656

[foxxyn8]

foxxyn8, I can't get this to work.Bookmarks toolbar does not autohide. Using ff4beta11.

http://userstyles.org/styles/43656

Try reducing or removing -moz-transition-delay property of #navigator-toolbox:not([customizing]) #PersonalToolbar

[Drifus]

This is what I see with a 1px margin-top for the navbar and a 0px margin-bottom for the tab bar:

And this is with a 0px margin-top for navbar and 0px margin-bottom for tabbar

I don't see any overlap

I needed that negative margin in the nav-bar because there was this line overlapping on older trunks. In addition to fixing problems with tabs [pinned] only when it is alone (without other tabs), the icon appeared with 15px. Also because I use 21px height for the tabs.

But apparently, this trick is no longer necessary, and no longer fix the problem of the icon.

To fix the icon with 15px when in "tabs[pinned] alone"on lastest nightly build, I'm using something dirty to force 16 x 16px.

.tabbrowser-tab[pinned] {
         min-height: 24px !important;
}

Don't ask me how this works. It was by cut-and-try.

[foxxyn8]

I needed that negative margin in the nav-bar because there was this line overlapping on older trunks. In addition to fixing problems with tabs [pinned] only when it is alone (without other tabs), the icon appeared with 15px. Also because I use 21px height for the tabs.

But apparently, this trick is no longer necessary, and no longer fix the problem of the icon.

To fix the icon with 15px when in "tabs[pinned] alone"on lastest nightly build, I'm using something dirty to force 16 x 16px.

.tabbrowser-tab[pinned] {
         min-height: 24px !important;
}

Don't ask me how this works. It was by cut-and-try.

I can tell you why it works:

Your tab height is 22px. The top border is 4px. The bottom border is 3px. 22px - 4px - 3px = 15px. That's all the space left allocated to the label and images.

When you increase its height to 23px you're giving it 16px for the label and images.

[Drifus]

... The top border is 4px. The bottom border is 3px. 22px - 4px - 3px = 15px.

Borders of what?

Also, do you know if there are margins/padding inside tabs?

[foxxyn8]

Borders of what?

Also, do you know if there are margins/padding inside tabs?

1).tabbrowser-tab as defined in browser.css:

 -moz-border-image: url(tabbrowser/tab.png) 4 5 3 6 / 4px 5px 3px 6px repeat stretch;

2) Domi shows that all margins and padding of .tabbrowser tabs and its children are 0. The exceptions are .tab-icon-image and .tab-throbber which have a right margin of 3px.

[Drifus]

1).tabbrowser-tab as defined in browser.css:

 -moz-border-image: url(tabbrowser/tab.png) 4 5 3 6 / 4px 5px 3px 6px repeat stretch;

2) Domi shows that all margins and padding of .tabbrowser tabs and its children are 0. The exceptions are .tab-icon-image and .tab-throbber which have a right margin of 3px.

tab.png. You're right! I forgot this.

Thanks for the explanation.

Do you have a better approaching on how to deal with tabs fixed in 22px? Especially on the issue "pinned tabs"/"pinned tabs alone"

My apologies for excessive questions.

[grayscale]

Try reducing or removing -moz-transition-delay property of #navigator-toolbox:not([customizing]) #PersonalToolbar

nice, thanks. btw, how can i make it non-transparent?

[foxxyn8]

tab.png. You're right! I forgot this.

Thanks for the explanation.

Do you have a better approaching on how to deal with tabs fixed in 22px? Especially on the issue "pinned tabs"/"pinned tabs alone"

My apologies for excessive questions.

No apologies necessary.

I'll do some more investigating, but it looks like your approach is the only one working at the moment(at least if you're wanting to keep the 22px tab bar). I would however reduce the height to 23px since its the minimum necessary to keep a 16px icon. Then again I thought the 15px icon looked aesthetically better.

you did notice that it's all the tab icons; whether they're in pinned or normal tabs is irrelevant?

nice, thanks. btw, how can i make it non-transparent?

reduce the opacity timing at -moz-transition property for #navigator-toolbox:not([customizing]) #PersonalToolbar

[grayscale]

Did not work :/

this is what happens when i hover on the address bar:

It'll be better if it is non-transparent.

Here's what I use:

/*Bookmarks*/
#PersonalToolbar { 
position: fixed !important;
top:53px !important; 
left: 0 !important; 
right: 0 !important;
visibility: collapse !important;
-moz-transition: visibility .5s, opacity 1s ease !important;
}

#personal-bookmarks { 
width: 100% !important;
}

#nav-bar:hover ~ #PersonalToolbar,
#PersonalToolbar:hover {
background:rgba(0,0,0,.3);
visibility: visible !important;
opacity: 1;
-moz-transition: visibility !important;
-moz-transition-delay: .75s!important;

} 

Thanks foxxy