Share your custom Firefox/Minefield 4 stylish scripts

3,047 · August 13, 2010

Since I don't know (or care) how the text style in Safari looks I can't just write you up a script, but you can make several changes to the font. I'll post what I'm using as an example and you can modify it as it suits you.

#PersonalToolbar .bookmark-item:not(menuitem){
 font-size: 4mm !important;
 font-family: calibri !important;
 font-weight: bold !important;
 color: white !important;
 text-shadow: 0 0px 3px rgba(0,0,0,2),
 	0 0 2px rgba(0, 0, 0,1) !important;
}

August 13, 2010

Since I don't know (or care) how the text style in Safari looks I can't just write you up a script, but you can make several changes to the font. I'll post what I'm using as an example and you can modify it as it suits you.
#PersonalToolbar .bookmark-item:not(menuitem){
 font-size: 4mm !important;
 font-family: calibri !important;
 font-weight: bold !important;
 color: white !important;
 text-shadow: 0 0px 3px rgba(0,0,0,2),
 	0 0 2px rgba(0, 0, 0,1) !important;
}

Actually, I am using that right now. I've attached the best screenshot I could find of the toolbar though, in case anyone else has any ideas

Edit 1: The text looks like it has an inner shadow which is what I'm kind of trying to do if possible.

Edit 2: It looks like this should achieve what I'm looking for, but it is hard to tell with the light blue background. Found the information here if anyone else is wondering about text shadows for styling.

#PersonalToolbar .bookmark-item:not(menuitem){
 font-weight: bold !important;
 text-shadow: 1px 1px 1px white;
 color:#333;
 background:#aaa !important;
}

Edited August 13, 2010 by family guy

27,724 · August 13, 2010

Hello,

this is what I'm currently working on:

Link is here: http://userstyles.org/styles/35240

I'd appreciate your opinions guys. :)

I have some issues in my style, as written in userstyle details, and I hope you have better ideas to fix it than me. ;)

What I didn't write in description, but I want to fix, is to move nav-bar and menu button 1 px left to keep it in one line with whole window. I found it impossible, however (Mozilla Team neither, they are not able to do what they did in their own mockup). :(

Edit: Ah, one more thing. When there are more cards, and they do not fit in screen space and <- -> are shown, and then I close tabs and there are a few of them so they fit in screen space, tab bar moves 3 px left. Why?

I really like the Button usage and would only like to use that portion of your code. I tried snipping some of it but then I get your button with the Orange minefield button on top of it. I fooled around some more and I got rid of the Orange button but now your button has two down arrows which I can't get rid of.?

2,737 · August 13, 2010

http://userstyles.org/styles/32627

27,724 · August 13, 2010

http://userstyles.org/styles/32627

Now if I can get it like the above it would be great.

2,737 · August 13, 2010

Now if I can get it like the above it would be great.

I tried , will do it again later

27,724 · August 13, 2010

Thanks I got that but it takes out the Glass on the Bookmarks bar. I am working on that now. If you know the code I could use, I would appreciate it. :D

27,724 · August 13, 2010

I had to go back to my old code. Messed it all up.

27,724 · August 13, 2010

I tried , will do it again later

Thanks Bogus :yes:

27,724 · August 14, 2010

Uploaded with ImageShack.us

It would be nice to have the CSS for this..

August 14, 2010

Here is my theme guys. Here you go.

http://userstyles.org/styles/35566

August 14, 2010

It would be nice to have the CSS for this..

It's a mix of extensions and stylish codes from userstyles.org. The extensions I use are AdBlockPlus, Locationbar², Nightly Tester Tools, Omnibar 0.7.0.20100707, SmoothWheel, Stylish 1.0.11, and Toggle Private Browsing 1.8.

Bookmark-Status Bar Text Color:

.toolbarbutton-text,
#main-menubar * {
  color: gray !important;
  text-shadow: 0 1 5px black !important;
}
#status-bar *{
opacity: 0.99 !important;
color: gray !important;
text-shadow: 0px 0px 1px black, 0px 0px 1px black, 0px 0px 1px black !important;
}

Firefox 4 beta - Rename Firefox Menu Button:

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

#appmenu-button{
padding-left: 10px !important;
padding-right: 10px !important;
}

#appmenu-button .button-box .box-inherit:before {
  content: "Quazzi";
}

#appmenu-button .button-box .box-inherit .button-text {
  display: none;
}

#navigator-toolbox[tabsontop="true"] &gt; #toolbar-menubar[autohide="true"] ~ #TabsToolbar {
  -moz-padding-start: 0 !important;
}

Firefox 4 Beta 3 - Customizations:

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


#urlbar, #searchbar &gt; *, .findbar-textbox, #search-box{
  -moz-appearance: none !important;
  background: rgba(20,20,20,.40) !important;
  -moz-border-radius: 6px !important;
  color: #99ccff !important;
  text-shadow: #000000 1px 1px 2px, #000000 -1px 1px 2px, #000000 1px -1px 2px, #000000 -1px -1px 2px !important;

}

#urlbar:hover, #searchbar:hover &gt; *, .findbar-textbox:hover {
  background: rgba(20,20,20,.75) !important;
  text-shadow: #ffffff 0px 0px 2px !important;
}

.findbar-textbox[status="notfound"]
{
 color: #ffffff !important;
}

#TabsToolbar, #browser-bottombox, #status-bar, #status-bar &gt; *, #nav-bar, #PersonalToolbar, #ybToolbar {

 background: transparent !important;
  color: #ffffff !important;
  text-shadow: #000000 1px 1px 2px, #000000 -1px 1px 2px, #000000 1px -1px 2px, #000000 -1px -1px 2px !important;
    -moz-appearance: none !important;
border: #000000 !important;

}


#status-bar{
 margin-top: 1px !important;
}
.findbar-find-next, .findbar-find-previous, .findbar-highlight{
 color: #ffffff !important;
}

#TabsToolbar[tabsontop="true"] { margin-top: 2px !important; margin-bottom: -2px !important; }

#nav-bar { margin-top: 0px !important; margin-bottom: 0px !important;}

.tabbrowser-tab, .tabs-newtab-button {
  background: rgba(20,20,20,.5) !important;
  color: #ffffff !important;
  text-shadow: #000000 1px 1px 2px, #000000 -1px 1px 2px, #000000 1px -1px 2px, #000000 -1px -1px 2px !important;
  font-size: 11px !important;
  border: #000000 1px solid !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
  -moz-box-shadow: inset 0px 0px 1em 0px rgba(255,255,255,.5) !important; 
  -moz-border-radius: 6px 6px 0px 0px !important;
  height: 24px !important;
}
.tabbrowser-tab:not([pinned="true"])
{
 margin-left: 1px !important;
 margin-right: 1px !important;
}


#TabsToolbar[tabsontop="true"] .tabbrowser-tab[pinned="true"]
{
 height: 24px !important;
}
#TabsToolbar[tabsontop="false"] .tabbrowser-tab[pinned="true"]
{
 height: 24px !important;
}


#TabsToolbar[tabsontop="true"] .tabbrowser-tab[pinned="true"] {


}

#TabsToolbar[tabsontop="false"] .tabbrowser-tab[pinned="true"] {

}

.tabbrowser-tab[pinned="true"] .tab-icon-image
{
 margin-top: 3px !important;

}

.tabbrowser-tab[selected="true"]{
 background: rgba(50,50,50,.5) !important;
 -moz-box-shadow: inset 0px 0px 2em 0px rgba(20,100,244,.75) !important;
 color: #99CCFF !important;

}

#appmenu-button {
  background: rgba(20,20,20,.25) !important;
  color: #99CCFF !important;
  text-shadow: rgba(0,0,0,.75) 1px 1px 2px, rgba(0,0,0,.75) -1px 1px 2px, rgba(0,0,0,.75) 1px -1px 2px, rgba(0,0,0,.75) -1px -1px 2px !important;
 -moz-box-shadow: inset 0px 0px 3em 0px rgba(20,100,244,.5) !important;

}
#appmenu-button:hover, .tabbrowser-tab:hover {
  background: -moz-linear-gradient(top, rgba(255,255,255,.75), rgba(20, 100, 244,.75) 5px, rgba(0,0,0,.75) 20px) !important;
  color: #99CCFF !important;
 text-shadow: #ffffff 0px 0px 2px !important;
 -moz-box-shadow: inset 0px 0px 8px 2px rgba(20,100,244,1), 0px 0px 1em rgba(20,100,244,1) !important;
}

.tabs-newtab-button:hover, #alltabs-button:hover, #new-tab-button:hover, .scrollbutton-down:hover, .scrollbutton-up:hover{
  background: -moz-linear-gradient(top, rgba(255,255,255,.75), rgba(20,100,244,.75) 5px, rgba(0,0,0,.75) 20px) !important;
  color: #99CCFF !important;
 text-shadow: #ffffff 0px 0px 2px !important;
 -moz-box-shadow: inset 0px 0px 8px 2px rgba(20,100,244,1) !important;
}



/* side bar stuff */

.chromeclass-directories *, #bookmarksPanel * { color: #ffffff !important;}
/*
#sidebar-search-container {
 background: rgba(250,50,50,.92) !important;
}
*/

#placesCommands, #editMenuCommands, #placesContext, #bhTooltip, #mainCommandSet, menupopup, popup {
 background: rgba(20,20,20,.75) !important;
 color: #ffffff !important;
-moz-appearance: none !important;
 -moz-border-radius: 6px !important;
}

menupopup *, popup *, .ac-title-box * {color: white !important;}

.ac-url-box * {color: #99ccff !important;}


#browser, #sidebar, #PopupAutoCompleteRichResult, #sidebar-header {
 background: transparent !important;
  color: #ffffff !important;
  text-shadow: #000000 1px 1px 2px, #000000 -1px 1px 2px, #000000 1px -1px 2px, #000000 -1px -1px 2px !important;
    -moz-appearance: -moz-win-glass !important;
border: #000000 !important;
}

#bookmarksPanel {
 background: transparent !important;
  color: #ffffff !important;
  text-shadow: #000000 1px 1px 2px, #000000 -1px 1px 2px, #000000 1px -1px 2px, #000000 -1px -1px 2px !important;
    -moz-appearance: -moz-win-media-toolbox !important;
border: #000000 !important;
}


#bookmarks-view {
  background: -moz-radial-gradient(top, rgba(255,255,255,.15), rgba(0,0,0,.75));
 padding-right: 5px !important;
}

.autocomplete-richlistbox {
background: -moz-radial-gradient(top, rgba(10,10,10,.55), rgba(20,20,20,1));
}

Firefox: Stylish: Status Icon:

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

#stylish-panel &gt; .statusbarpanel-icon {
margin: 0 0 0;
list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAv0lEQVR42mNgGAUogI2NTUVMTGy5lJTUfiRcDGOD5Dg4OAxwGiArK7tCTU1tv5aW1n5tbW0UDBIDySkoKKzEaQBIgYGBwX5jY+P9BQUF548cOfIShkFiIDmQGpwGAG0pBioE4f0wTegY5BKcBoCcClOI7AIQGyYOUkOUAcgYyTXFQDXFRBmA7H+iXWBkZLQOmwuQMUgNTgMOHz7cYWlpiWxIMbJmkNz69evbcRrw//9/OSCeAMRLcWCQnObgSv4APfmrGSB1kssAAAAASUVORK5CYII=") !important;
}

Remove Folder icons from Firefox toolbar:

        /* Remove icons in the Bookmarks Toolbar */
    .bookmark-item &gt; .toolbarbutton-icon {
      margin: 0px !important;
      display: none !important;
    }

    .bookmark-item,
    .bookmark-item[type=menu] {
      margin: 0 3px !important;
    }
#PersonalToolbar .bookmark-item:not(menuitem){
  font-size: 2.8mm !important;
  font-family: seguoe ui !important;
  font-weight: bold !important;
  color: gray !important;
  text-shadow: 0 0 3px rgba(0,0,0,1), 0 0 3px rgba(0, 0, 0,1) !important;
}

You can used the Packed Menu 1.3 extension to hide the titlebar button if you use WindowBlinds. (screenie)

27,724 · August 14, 2010

Thanks Quazzi :)

August 15, 2010

No comments on my style?

August 16, 2010

Very nice Quazzi, using some of it on mine. I like the bookmarks sidebar, is it possible to do the same for history sidebar? Also with your right click "popup" im getting line mix up shadows, sorry hard to explain, but when you hover over "Copy" you can see a little bit of "Paste" and/or "Cut". Thanks.

3,138 · August 16, 2010

nice layouts but i have no idea where to put these

August 16, 2010

Replaces the bookmarks icon when placed in the Personal Toolbar.

http://userstyles.org/styles/35199

Great thanx! but how can I move the icon left/right? for me it's to close to the text!?!

Replaces the bookmark star icon with newer ones from the mockups.

http://userstyles.org/styles/35201

Awesome!

27,724 · August 16, 2010

nice layouts but i have no idea where to put these

userChrome.css in your profile

C:\Users\user name\AppData\Roaming\Mozilla\Firefox\Profiles\vatj128u.default\chrome

Or install Stylish

1,720 · August 16, 2010

Yo, Since Im figuring you guys know about this alot mroe than me, ive been picking and fiddling around with various scripts in this thread..this is what I got.

Anyone got any clue on how to fix these faults?

1: small white "border" right under tabbar(visible in the favicon) nvm, fixed after reboot of firefox

2: menu bar in normal and fullscreen.

find%20faults.PNG

#appmenu-button
{   

    height: 20px !important;
    min-width: 33px !important;
    width: 43px !important;
}

#appmenu-button .button-text 
{
color: transparent !important;
text-shadow: none !important;
margin-left: -19px !important;
margin-right: -80px !important;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjVJivzgAAACkklEQVQ4T22SXUhTYRjHD1FQF7mCwAulm6AuS0qxLiIWZKgVXS2jNAkxiDBHF4ZlQl5ESWSWJXPGJjrDSAw209iH+LGttLnN447b/
NrmnGvoztS57Zzt37tDhUIP/Hkf3vf58fD834eitoXX690bi8WucRzXQWRMJBLGra2tjlAoJJHL5fu21/7LSUF+MplkPKsxKIwBPO6bx6PeWbQNeeAJRRGPx2m73X56B0ygs6lUaoMJbKKwZQaXZAu43LaIgrdOnHk2gZN1Q3g94ALH8RGTyXROgIPBoIhAHo5PIR091ghufV5Hee8GJJ1BAc59asLxOj2mfSyi0eiCVCo9RJE5quy+CPzhmACmcbWLx72BJMp6WBS/
n0N+w3fkNQyjc2QBrsA6rFbrA4qY8K1R48JmnBfAvzHq5XC7m3R8YcOph3rcbJ/EkGMFL9UMlpaW9BTP8+6qjknEuSSW2QTUdAS+MCfwXpZDo3YZd1QzMM+vwTK/
irvt4yAuuyliDF2tnEAkGkNJqw3nm6ZxRTYHpSlInEyAjEJM4YTT5FyBlNT6/X4mbY7qjdqGUdqHY9J+nKg1ILd+DHlEtd02rK6FwbKsoF6jCwr9THrGPsrhcBQ73Ito0/
xE5nUlskq7cLj8o6Dssi7cf6cnM/nTXdCtt8MX+JWSyWQ3qIqKit0Mw/T3DxPwagsyCpqQcfGPSC4iecMHLZxOJ1zuWVgsFp2IhPCXCoUic2pqavzT4BjE1Z04WNyM/
RdeQVTYjEyJHJLnX2GnHaBperKoqOjoju2pqak5YDabm8hasYPDP9D+ZQRKjRFGyzTcbndYq9W25uTkZP93X8nlrsrKyiyNRlNiMBie6HS6epVKVSoWi4+Qtz3bod8reAHfGw6GeQAAAABJRU5ErkJggg=="
) no-repeat 16px !important;
}


#appmenu-button-container
{
margin: 0px 0px 0px 0px !important;
}

#appmenu-button
{
padding: 2px 9px 2px 0px !important;
background: -moz-linear-gradient(top, rgba(58,127,197,1), rgba(47,119,189,1), rgba(0,58,229,1)) !important;
-moz-border-radius: 0px 0px 0px 0px !important;
border-top: 0px !important;
margin-top: -1px !important;
}

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

#main-window[sizemode="maximized"][tabsontop="true"] menubar 
{    
     margin-left: 48px !important; 
     padding-top: 6px !important; }

#toolbar-menubar
{
position: fixed !important;
 margin: 0 700px 3px 41px !important;
 background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.5) 100%)!important;

 text-shadow: 0 0 4px rgba(255, 255, 255, 0.8), 0 0 3px rgba(255, 255, 255, 0.8), 0 0 3px rgba(255, 255, 255, 0.8), 0 0 3px rgba(255, 255, 255, 0.8) !important;
 -moz-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5), 0 0 1px rgba(30, 30, 30, 0.5) inset, 0 0 1px rgba(60, 60, 60, 0.9) inset, 0 0 3px rgba(0, 0, 0, 0.7) inset !important;

}

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

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

yes..code is not very organized

3,138 · August 17, 2010

userChrome.css in your profile

C:\Users\user name\AppData\Roaming\Mozilla\Firefox\Profiles\vatj128u.default\chrome

Or install Stylish

thank you :)

3,138 · August 17, 2010

Just for fun :whistle:

[/code]

i like this but how come i have no icon ?

3,047 · August 17, 2010

i like this but how come i have no icon ?

Somehow simply copying and pasting the code into the forums didn't work. It inserts a space somewhere it doesn't belong in the image code.

Try this: phoenix.txt

3,047 · August 17, 2010

Or this

3,138 · August 17, 2010

Or this

thanks that worked

27,724 · August 18, 2010

Somehow simply copying and pasting the code into the forums didn't work. It inserts a space somewhere it doesn't belong in the image code.

Try this: phoenix.txt

You have to wrap it in code like below:

#appmenu-button .button-text {
color: transparent !important;
text-shadow: none !important;
margin-left: -17px !important;
margin-right: -20px !important;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABl0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjUuNUmK/OAAAAK/SURBVDhPY2BAAps3b2acFxLCtFhamhFZ/Pr160L9DAxCyGJY2Tdv3lTpY2dXW66ry4Ss4P79e3oHWppDm9jYjJYoKaHIwdWdOnmS//a5c+mdDAxx6KZ3d3Uwvn3zes7q5KTd3QICYdMZGNgxXHDz+nWfyxvWL25mYKjB5rxPHz+su7Z71/O53t4ngJY4o6g5cuQI75vnT7ecmD3rTiUDQx+6AefPnWH9/v3r809vX/87vmTRnw5Z2a3dDAwScHVXr15V+Pzh/Yvj8+Z+LWFgmI9uwLu3rx1//fz+D4j/P7l+9f80J6eXQGc6wtVdunhB+fu3Lz8eX7n0r5CF+U4PAwMLTPL9u7c2n16/vAvSDMIvbt/6vzQz430TA0MO3IBHDx5o/fj+9ffnd2/+F3FxfQM6jwcm+fnzp+afP76BNYPw5w/v/i/LyvxVy8CQDzfg7p3bKl8/f/x0ecvm38UszLse3bxhvrOtNW2ajIz7i6uXnb58ePcKZsC7Z0/+L8/J/lbPwFAIN2D3rh1Mnz99WPD0yuW35Tw8Fz6+fbNucXramemCglmvbt9y//rx/TuYAQdmzfzfoay8GmiAFEpYvXr10vrt0yeXbx878unm2dM/j0yc+OXktClngDZ+AGkGGvL/8q4df7u0tc8Co0kTI6rv3LnN/ODObY+3z5++fPLw/v/nQKfCbAVG4f9NjQ3/Z9tYL2hjYNDCm6TPnT1rfWrjxiXH9uz69PDc2d9rsrPerPTzm7jY0dFtc1aWxvq0NLWlQUEKc2RlBReKiTFjGHZg/36e/ZMmqR5asiTm+KKF83ZUVq5aFRHRvCo+Phqo2X+li4slyIATCxcaADOYCl7X7N+/X3B3ebnK0rQ0zR0pKWoTJSVFTu3bpzaFgUGZYM4EKTh27Bjz48eP2adNm8Z448YNcHa+cuUKSkYCAD6ngKt948p8AAAAAElFTkSuQmCC") no-repeat 16px !important;
}

#appmenu-button dropmarker:before {
content: "Phoenix" !important;
padding-right: 4px !important;
}

#appmenu-button-container{
margin: 0px 0px 4px 2px !important;
}

#appmenu-button{
padding: 2px 7px 2px 7px !important;
background: -moz-linear-gradient(top, rgba(251,89,65,1), rgba(189,40,25,1), rgba(157,6,0 ,1)) !important;
-moz-border-radius: 0px 0px 4px 4px !important;
border-top: 0px !important;
margin-top: -1px !important;
}

#appmenu-button:hover{
background: -moz-linear-gradient(top, rgba(251,89,65,1), rgba(251,55,65,1)) !important;
}

Sign In

Share your custom Firefox/Minefield 4 stylish scripts

Recommended Posts

Darrian

Link to comment

Share on other sites

family guy

Link to comment

Share on other sites

+Gary7 Subscriber²

Link to comment

Share on other sites

bogas04

Link to comment

Share on other sites

+Gary7 Subscriber²

Link to comment

Share on other sites

bogas04

Link to comment

Share on other sites

+Gary7 Subscriber²

Link to comment

Share on other sites

+Gary7 Subscriber²

Link to comment

Share on other sites

+Gary7 Subscriber²

Link to comment

Share on other sites

+Gary7 Subscriber²

Link to comment

Share on other sites

Warboy

Link to comment

Share on other sites

Quazzi

Link to comment

Share on other sites

+Gary7 Subscriber²

Link to comment

Share on other sites

Warboy

Link to comment

Share on other sites

BantryRed

Link to comment

Share on other sites

x-scratch

Link to comment

Share on other sites

vajlent

Link to comment

Share on other sites

+Gary7 Subscriber²

Link to comment

Share on other sites

KiHu

Link to comment

Share on other sites

x-scratch

Link to comment

Share on other sites

x-scratch

Link to comment

Share on other sites

Darrian

Link to comment

Share on other sites

Darrian

Link to comment

Share on other sites

x-scratch

Link to comment

Share on other sites

+Gary7 Subscriber²

Link to comment

Share on other sites

Recently Browsing 0 members