Share your custom Firefox/Minefield 4 stylish scripts

By Steven P.
in Web Browser Discussion & Support

 Share

Recommended Posts

Community Regular

foxxyn8

Posted
Posted

foxy, is it possible that the code isn't copied correctly, i've seen before in this thread where the code tag has messed up the script for whatever reason, try putting it in a quote or pasting it in a .txt file and uploading it

worth a try i suppose

That's usually only a problem caused by the insertion of line breaks in data URIs. Don't think that's the problem here, but like you said it's worth a shot so here's a link to the code that I'm using right now:

http://foxxyn8.pastebin.com/

Please recommend some elementary reading material where I can know more about things like "@namespace url(http://www.mozilla.o...ere.is.only.xul);"

Mozilla Developer Network is a good source:

https://developer.mozilla.org/en/CSS_Reference

Enthusiast

mysiskatten

Posted
Posted

That's usually only a problem caused by the insertion of line breaks in data URIs. Don't think that's the problem here, but like you said it's worth a shot so here's a link to the code that I'm using right now:

http://foxxyn8.pastebin.com/

that fixed it :) ..sorry for all the problem I caused you.

Can I ask for one more? I dont want it to show bookamark bar when I mouse over tabs, only when I mouseover locaation bar.

Thank you

foxy, is it possible that the code isn't copied correctly, i've seen before in this thread where the code tag has messed up the script for whatever reason, try putting it in a quote or pasting it in a .txt file and uploading it

worth a try i suppose

Yes that did it for me. Thanks

Community Regular

foxxyn8

Posted
Posted

that fixed it :) ..sorry for all the problem I caused you.

Can I ask for one more? I dont want it to show bookamark bar when I mouse over tabs, only when I mouseover locaation bar.

Thank you

No problem, glad it's working for you now. Thanks, Brando. To have it show only when you hover the navbar replace

#navigator-toolbox:hover > #PersonalToolbar

with

#nav-bar:hover ~ #PersonalToolbar,

#PersonalToolbar:hover

Here's the style link at USO : Firefox 4 Bookmark Toolbar Autohide

Enthusiast

mysiskatten

Posted
Posted

No problem, glad it's working for you now. Thanks, Brando. To have it show only when you hover the navbar replace

#navigator-toolbox:hover > #PersonalToolbar

with

#nav-bar:hover ~ #PersonalToolbar,

#PersonalToolbar:hover

Here's the style link at USO : Firefox 4 Bookmark Toolbar Autohide

Perfect worked :)

Enthusiast

mysiskatten

Posted
Posted

Perfect worked :)

...hmm bookmark bar must have this to "#nav-bar:hover ~ #PersonalToolbar", it closes in 1.25 sec so I must be quick to make my choice.. and i´m slow.

how?

I use this as solution but would be great if above worked

-moz-transition-delay: 5s!important;

Edit:

SORRY missed second row #PersonalToolbar:hover that fixed it

Thanks

Apprentice

Ziz4rD

Posted
Posted

No problem, glad it's working for you now. Thanks, Brando. To have it show only when you hover the navbar replace

#navigator-toolbox:hover > #PersonalToolbar

with

#nav-bar:hover ~ #PersonalToolbar,

#PersonalToolbar:hover

Here's the style link at USO : Firefox 4 Bookmark Toolbar Autohide

good work, but the bar appears so bookmark bar is disabled, which is very annoying.

I modificades for this code, just appears when is enabled,

#navigator-toolbox:hover > #PersonalToolbar[collapsed="false"] {
	visibility: visible !important;
	opacity: 1 !important;
	-moz-transition: .9s ease-in !important;
	-moz-transition-delay: 1.25s!important;
}

Enthusiast

mysiskatten

Posted
Posted

good work, but the bar appears so bookmark bar is disabled, which is very annoying.

I modificades for this code, just appears when is enabled,

#navigator-toolbox:hover > #PersonalToolbar[collapsed="false"] {
	visibility: visible !important;
	opacity: 1 !important;
	-moz-transition: .9s ease-in !important;
	-moz-transition-delay: 1.25s!important;
}

yes thats even better.. do you know if you can make personas work on bookmark bar with this?

Community Regular

foxxyn8

Posted
Posted

good work, but the bar appears so bookmark bar is disabled, which is very annoying.

I modificades for this code, just appears when is enabled,

#navigator-toolbox:hover > #PersonalToolbar[collapsed="false"] {
	visibility: visible !important;
	opacity: 1 !important;
	-moz-transition: .9s ease-in !important;
	-moz-transition-delay: 1.25s!important;
}

Forgot to test that, thanks! :D

yes thats even better.. do you know if you can make personas work on bookmark bar with this?

I don't know of any way to do that, sorry. :(

Collaborator

vasa1

Posted
Posted

I took this code from http://userstyles.org/styles/31267

(Global dark style - changes everything to DARK - By stormi.) and made a few changes.

It works for me with Fx 4 beta 10 with Stylish 1.1.

My newbie question is this: is it possible to place the code in userChrome.css or userContent.css? Or will it work only via Stylish?

@namespace html url(http://www.w3.org/1999/xhtml);
@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url-prefix(http://), url-prefix(https://), url-prefix(ftp://), url-prefix(file://), url-prefix(about) 

scrollbarbutton {
  -moz-appearance: none !important;
  background-color: transparent;
  border: none}
thumb {
  -moz-appearance: none !important;
  border: none !important;
  background-color: #800000 !important;
  -moz-border-radius: 10px; }
scrollbar {
  -moz-appearance: none !important;
  background: transparent !important;
  -moz-box-shadow: inset #000 0 0 8px}

scrollbar[orient="vertical"] thumb {min-width: 12px !important; max-width: 12px !important; min-height: 14px !important}
scrollbar[orient="horizontal"] thumb {min-height: 12px !important; max-height: 12px !important}
scrollbar[orient="vertical"] { min-width: 12px !important; max-width: 12px !important}
scrollbar[orient="horizontal"] { min-height: 12px !important; max-height: 12px !important}

Enthusiast

mysiskatten

Posted
Posted

Forgot to test that, thanks! :D

I don't know of any way to do that, sorry. :(

I think 59 is better than 60 on this

#main-window[tabsontop=true] #PersonalToolbar {

top: 59px !important;

If I don´t like the transition ease in ease out effect what can I remove to just make it appear then disappear.

I know I can set it to 0sec but I want to remove rows that I don´t need.

Bug? Sometimes the bookmark bar appears when it shouldn't(flickering)

thanks again for userstyle

Community Regular

foxxyn8

Posted
Posted

I think 59 is better than 60 on this

#main-window[tabsontop=true] #PersonalToolbar {

top: 59px !important;

If I don´t like the transition ease in ease out effect what can I remove to just make it appear then disappear.

I know I can set it to 0sec but I want to remove rows that I don´t need.

Bug? Sometimes the bookmark bar appears when it shouldn't(flickering)

thanks again for userstyle

remove both instances of opacity

change both -moz-transition: properties to moz-transition: visibility !important; (hopefully it won't reintroduce that previous problem)

I haven't noticed any flickering....yet

Positioning is set for Default theme on standard Win7 Aero theme (what I thought l thought looked good, which was to cover the bottom border of the toolbar above it, it's purely aesthetic and easy to change.) I use a custom Aero theme and those positions don't work for me either, but I wrote it for Default settings (I don't even use the bookmark toolbar, lol.)

I took this code from http://userstyles.org/styles/31267

(Global dark style - changes everything to DARK - By stormi.) and made a few changes.

It works for me with Fx 4 beta 10 with Stylish 1.1.

My newbie question is this: is it possible to place the code in userChrome.css or userContent.css? Or will it work only via Stylish?

Scrollbars contain anonymous content and therefore can't be styled with userChrome/userContent (user style sheets), only with stylish (user agent style sheets).

Grand Master

+Gary7 Subscriber²

Posted
  • Subscriber²
Posted

With this afternoon's nightly, Mozilla has taken the link status out of the URL bar as well as the progress indicator. The Code below will make the Link Status that will appear in the lower left hand corner show a transparent box. It seems that Mozilla is starting to copy everything from Chrome. 

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

.statuspanel-label[value=""]{
	display: none !important;}

.statuspanel-label:not([value=""]){
	opacity: 1 !important;
	-moz-transition-property: opacity: 0 !important;
	-moz-transition-delay: 2000ms !important; }

#main-window[sizemode="normal"]:not([inFullscreen]) .statuspanel-inner{
	margin: 0 1px !important;}

.statuspanel-label {
	color: Windows Text !important;
	border-color: Transparent !important;
	background: Transparent !important;}

Neowinian

RoadFx

Posted
Posted

I cannot get this to work on Windows 7.

If you're using Stylish, just install it; if not, you have to go with userContent.css instead of userChrome.css

Also, it is possible one of your extensions or any other modification is clashing with it.

Grand Master

+Gary7 Subscriber²

Posted
  • Subscriber²
Posted

If you're using Stylish, just install it; if not, you have to go with userContent.css instead of userChrome.css

Also, it is possible one of your extensions or any other modification is clashing with it.

I did get it to work but it was making and moving everything way too close together. Oh and I do know where CSS goes.

Apprentice

Ziz4rD

Posted
Posted

With this afternoon's nightly, Mozilla has taken the link status out of the URL bar as well as the progress indicator. The Code below will make the Link Status that will appear in the lower left hand corner show a transparent box. It seems that Mozilla is starting to copy everything from Chrome. 

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

.statuspanel-label[value=""]{
	display: none !important;}

.statuspanel-label:not([value=""]){
	opacity: 1 !important;
	-moz-transition-property: opacity: 0 !important;
	-moz-transition-delay: 2000ms !important; }

#main-window[sizemode="normal"]:not([inFullscreen]) .statuspanel-inner{
	margin: 0 1px !important;}

.statuspanel-label {
	color: Windows Text !important;
	border-color: Transparent !important;
	background: Transparent !important;}

I have a new code that fixes a bit of the status panel at the bottom of the browser, Minefield 4.0b11pre.

43526_before.png43526_after.png

http://userstyles.org/styles/43526

Hey garry7 use this, I have the same problen and I do the solucion last week

Collaborator

vasa1

Posted
Posted

Scrollbars contain anonymous content and therefore can't be styled with userChrome/userContent (user style sheets), only with stylish (user agent style sheets).

It seemed that something changed in 2009:

http://forums.mozillazine.org/viewtopic.php?p=7187235&sid=05bd1faeb11708d01949c8ea773261ba#p7187235

note that due to a ... anonymous content change in Fx, scrollbars cannot be styled in userChrome.css anymore. either a theme or Stylish is required.
Community Regular

foxxyn8

Posted
Posted

Actually it changed in mid 2007. See Bug 424184 - Can no longer style scrollbars from userchrome.css or usercontent.css for reasons why

Grand Master

+Gary7 Subscriber²

Posted
  • Subscriber²
Posted

Hey garry7 use this, I have the same problen and I do the solucion last week

I basically was, just changed it so that the box was transparent. With the latest release of Status 4 Evar, you can remove it all together or place it on a toolbar. I removed it. Mozilla does not seem to know when they have a good thing.

Thanks!

Neowinian

RoadFx

Posted
Posted

I did get it to work but it was making and moving everything way too close together. Oh and I do know where CSS goes.

Well, it intentionally re-sizes things as you re-size the window:

mdz2Ys.jpg

But if you can take an screen shot to show me if there is any issue, I'd appreciate.

Collaborator

Deo Domuique

Posted
Posted

Today's build broke a piece of my code... Especially about "#back button"...

Do you know if something has been changed, generally ?

I have a style for toolbar buttons and excluded the #back button. The code starts like this ".toolbarbutton-1:not(#back-button) { "

It worked, but, today seems it doesn't recognize the "not" command for back button and its included to general style...

Community Regular

foxxyn8

Posted
Posted

Today's build broke a piece of my code... Especially about "#back button"...

Do you know if something has been changed, generally ?

I have a style for toolbar buttons and excluded the #back button. The code starts like this ".toolbarbutton-1:not(#back-button) { "

It worked, but, today seems it doesn't recognize the "not" command for back button and its included to general style...

Maybe something in the patch for this bug:

edit: I just did a simple

.toolbarbutton-1:not(#back-button) {padding-left: 10px !important;}

and the back button didn't move.

Grand Master

+Gary7 Subscriber²

Posted
  • Subscriber²
Posted

Today's build broke a piece of my code... Especially about "#back button"...

Do you know if something has been changed, generally ?

I have a style for toolbar buttons and excluded the #back button. The code starts like this ".toolbarbutton-1:not(#back-button) { "

It worked, but, today seems it doesn't recognize the "not" command for back button and its included to general style...

The recent builds have broken quite a deal. I really do not like the fact that Mozilla decided to take the status text and progress out of the location bar. :shiftyninja:

This topic is now closed to further replies.
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.