Share your custom Firefox/Minefield 4 stylish scripts

By Steven P.
in Web Browser Discussion & Support

 Share

Recommended Posts

Apprentice

wojtekmaj

Posted
Posted

Is there a stylish code I can use, that would move the Menu bar to the right of the firefox button, when I press the "alt" key?

FFMenu.png

I believe it works properly for a long time, but you can update once again. I just tested it on newest Firefox Nightly and it works awesome. It's downloadable from the same address.

This is how it looks like on my computer.

ff4stylemenu.png

Link to comment
Share on other sites
Veteran

Darrian

Posted
Posted

Also a question, is it possible to remove the close button also on the active tab?

Sorry for the delay, I totally missed this post.

I don't know how to do it with CSS, but you can go to about:config, search for "browser.tabs.closeButtons" and set the value to "2"

Link to comment
Share on other sites
Veteran

SkyDX

Posted
Posted

Sorry for the delay, I totally missed this post.

I don't know how to do it with CSS, but you can go to about:config, search for "browser.tabs.closeButtons" and set the value to "2"

Thanks, worked like a charm^^

Link to comment
Share on other sites
Mentor

+Heartripper Subscriber¹

Posted
  • Subscriber¹
Posted

menu.png

Does anyone have a script that would reduce the spacing underneath the Firefox button a few pixels?

try

#navigator-toolbox{
margin-top: -2px !important;
}

adjust the -2px value to your needs

Link to comment
Share on other sites
Mentor

Inklin

Posted
Posted

Here is mine (originally posted in other thread but many many pages back now)

This is not all my work, so thank you to other users who have been working on these scripts.

post-251146-12795092674992.jpg

Tabs in Titlebar

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

#appmenu-button-container{
position: fixed !important;
}

#navigator-toolbox[tabsontop="true"] #TabsToolbar{
padding-left: 95px !important;
}


#navigator-toolbox[tabsontop="true"] #TabsToolbar{
padding-left: 78px !important;
padding-top:1px !important;
padding-right:107px !important;
}


#appmenu-button{
padding: 3px 14px 3px 14px !important;
margin-top:3px !important;
}

#appmenu-button
{
background-color: rgba(54, 121, 166, 0.2) !important;
}

#appmenu-button .button-text { display:none !important; }
#appmenu-button dropmarker:before { content: "Fx " !important; }

Glassy Nav/bookmarks bar

/*:::::::::::::::::::::::::::::::::::::::Do Not Remove This Line::::::::::::::::::::::::::::::::::::::: */

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

#navigator-toolbox:not([tabsontop=true]) #nav-bar
{
-moz-box-shadow: threedshadow 0 -1px inset !important;
padding-bottom: 7px !important;
}

#navigator-toolbox:not([tabsontop=true]) toolbar:not(#nav-bar):not(#toolbar-menubar)
{
background-color: rgba(223,233,245, 0.5) !important;
}

#main-window:not([sizemode="maximized"]) #navigator-toolbox:not([tabsontop=true]) toolbar:not(#nav-bar):not(#toolbar-menubar)
{
border-left: 1px solid threedshadow !important;
border-right: 1px solid threedshadow !important;
}

#navigator-toolbox:not([tabsontop=true]) #PersonalToolbar
{
background: -moz-linear-gradient(top, rgba(255,255,255,.5), rgba(255,255,255,0)) !important;
}

#navigator-toolbox:not([tabsontop="true"]) #TabsToolbar
{
padding-top: 2px !important;
}

#navigator-toolbox[tabsontop=true]
{
border-bottom: 1px solid threedshadow !important;
}

#navigator-toolbox[tabsontop=true] #TabsToolbar
{
-moz-box-shadow: inset threedshadow 0px -1px !important;
}

#navigator-toolbox[tabsontop=true] toolbar:not(#TabsToolbar):not(#toolbar-menubar)
{
background-color: rgba(223,233,245,.3) !important;
}

#main-window:not([sizemode="maximized"]) #navigator-toolbox[tabsontop=true] toolbar:not(#TabsToolbar):not(#toolbar-menubar)
{
border-left: 1px solid threedshadow !important;
border-right: 1px solid threedshadow !important;
}

#navigator-toolbox[tabsontop=true] #nav-bar
{
padding-top: 0px !important;
padding-bottom: 1px !important;
background: -moz-linear-gradient(top, rgba(242,246,251,1), rgba(255,255,255,0)) !important;
}

.tabbrowser-tab[selected=true]
{
font-weight: bold !important;
}

Only works with tabs on top, placing tabs on bottom places the nav bar in the title bar rendering the nav bar over the top of the menu button and window toggles.

this works with small buttons only but to make it look good with the default large button option change:

#navigator-toolbox[tabsontop=true] #nav-bar
{
padding-top: 0px !important;
padding-bottom: 1px !important;
background: -moz-linear-gradient(top, rgba(242,246,251,1), rgba(255,255,255,0)) !important;
}

to:

#navigator-toolbox[tabsontop=true] #nav-bar
{
padding-top: 5px !important;
padding-bottom: 5px !important;
background: -moz-linear-gradient(top, rgba(242,246,251,1), rgba(255,255,255,0)) !important;
}

Note: You may need to make some adjustments depending on the windows theme you are using.

Since todays nightly this and other tabs in titlebar implementations no longer work.

I have somewhat forced the tabs back into the titlebar by changing:

#navigator-toolbox[tabsontop="true"] #TabsToolbar{
padding-left: 78px !important;
padding-top:1px !important;
padding-right:107px !important;
}

to:

#navigator-toolbox[tabsontop="true"] #TabsToolbar{
padding-left: 78px !important;
margin-top: -21px !important;
padding-right:107px !important;
}

This works in full screen mode just fine but in windowd mode there is still about 10px gap or so at the top and it looks a little weird.

EDIT: just realized this doesn't work too well, the tabs get put in the title bar but there seems to be something overlaying them as the top half of the close tab button and new tab button don't work. Something did change in todays nightly and it's not looking good.

any ideas?

Link to comment
Share on other sites
Mentor

Kyang

Posted
Posted

Since todays nightly this and other tabs in titlebar implementations no longer work.

I have somewhat forced the tabs back into the titlebar by changing:

This works in full screen mode just fine but in windowd mode there is still about 10px gap or so at the top and it looks a little weird.

EDIT: just realized this doesn't work too well, the tabs get put in the title bar but there seems to be something overlaying them as the top half of the close tab button and new tab button don't work. Something did change in todays nightly and it's not looking good.

any ideas?

(I don't really know what I'm doing. I simply messed around with the scripts in this thread until I got something I wanted. :/ . But anyways.)

I could use this for full minimalism: 

#main-window:not([sizemode="maximized"]) {
  margin-top: -23px !important;
}

#appmenu-button-container {
  display: none !important;
}

#TabsToolbar{
  padding: 0px 120px 0px 0px !important;
}

#main-window[sizemode="maximized"] {
  margin-top: -22px !important;

}

Looks like this:

Max:

maxv.png

Normal:

windowed.png

Though I hate the tiny drag area, so I'm using this:

#main-window[sizemode="maximized"]#appmenu-button-container {
  display: none !important;
}

#main-window[sizemode="maximized"] #navigator-toolbox[tabsontop="true"]:not([inFullscreen="true"]) #TabsToolbar{
  padding: 0px 120px 0px 0px !important;
}

#main-window[sizemode="maximized"] {
  margin-top: -22.9px !important;

}

Looks like this:

Normal:

windowed.png

Max:

maxci.png

EDIT:

I'm also using SoapyHamHocks's app button style on page 13, and a few other things , but they don't affect the tab placement very much

Link to comment
Share on other sites
Rising Star

BilliShere

Posted
Posted

Guys...there are two things that I am attempting to adjust by noobishly trying to write a stylish userstyle. after many great manhours spent on this issue...it turns out that I suck and don't know what variables to use.

The two things are the following:

1. I want to adjust the curvature of the bottom part of the tabs. I wanted the tabs to be more curvy (curve outwards more) at the part where they join with the navbar when the tabs on top function is enabled. In the current betas and nightlies these tabs are very straight and meet the navbar at sharper (an almost 90 degrees) angle. Does anyone know of a stylish script that would allow me to fix this problem?

2. I wanted to make the entire toolbar set actually reach the inner margin/border of the window's aero borders. ugh. I can't explain properly so the following (rather shoddy) mspaintjob will probably help.

D335C.png

notice:

-how the mockup has a seamless and sexier edge for the toolbars unlike the current beta 3

-and how the tabs in the mockup (and in strata40 theme) are curvy unlike in the current firefox beta 3 build.

any suggestions on how to fix these two things?

Link to comment
Share on other sites
Rising Star

BilliShere

Posted
Posted

1. Someone will need to make a new tab border image.

2. Not possible yet.

thanks man! appreciate it. looks like I'll just have to wait in this case. no biggie. they're minor annoyances that will probably be fixed in the final release.

Link to comment
Share on other sites
Apprentice

wojtekmaj

Posted
Posted

Hmmmm i see SOME problems with new nightly if it comes to tabs-in-titlebar userstyles, but I found it pretty easy to fix, I have already applied it to my userstyle.

My fix is:

/* fixes issue caused by newest nightly */
#titlebar-spacer { 
	display: none !important;
}

...and that hides empty, unneeded spacer that is causing problems with clicking anything in tabbar moved to titlebar.

Userstyle working with newest nightlies:

http://userstyles.org/styles/35240

Link to comment
Share on other sites
Rising Star

Warboy

Posted
Posted

@ warboy - please share the code for the black background, thx

I would, but there is still bugs with it I can't figure out. When I maximumize the window. The title bar becomes 1/4 of it's normal size.

Also what's the code to color tabs on hover like the Phoenix script?

Link to comment
Share on other sites
Grand Master

Brandon H Supervisor

Posted
  • Supervisor
Posted

tabs in title bar issue from the past couple days is fixed in todays nightly, it now works like it did before again

Link to comment
Share on other sites
Rising Star

Warboy

Posted
Posted

tabs in title bar issue from the past couple days is fixed in todays nightly, it now works like it did before again

What does that mean tho? because the issue was introduced because of new tab animations, did they remove/disable the animations or what?

Link to comment
Share on other sites
Mentor

+Heartripper Subscriber¹

Posted
  • Subscriber¹
Posted

What does that mean tho? because the issue was introduced because of new tab animations, did they remove/disable the animations or what?

the iussue was introduced because they put a "titlebar" element, and this broke the css codes. :)

Link to comment
Share on other sites
Veteran

Darrian

Posted
Posted

See the first post of the Firefox 4 (beta 3) thread

I would, but there is still bugs with it I can't figure out. When I maximumize the window. The title bar becomes 1/4 of it's normal size.

Also what's the code to color tabs on hover like the Phoenix script?

.tabbrowser-tab:hover{
background: -moz-linear-gradient(top, rgba(251,89,65,1), rgba(251,55,65,.85)) !important;
}

(Which is from the Phoenix script, btw--change RGBA values as needed)

Link to comment
Share on other sites
Proficient

family guy

Posted
Posted

Is there any way to get items in the bookmarks toolbar to resemble Safari somewhat? I got rid of the favicons using a script on the first page, but I would prefer the text style to look somewhat the way Safari does.

Link to comment
Share on other sites
This topic is now closed to further replies.
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.