Share your custom Firefox/Minefield 4 stylish scripts

1,526 · March 25, 2011

Is there a way to move the page loading status poput at the bottom left of the screen? I want it a few pixels up and few to the right, so there's just a little gap.

You can try this:

.statuspanel-label {
  margin: 0 5px 5px !important;
}

It will move it 5px from the bottom and left.

March 25, 2011

Is there a way to move the page loading status poput at the bottom left of the screen? I want it a few pixels up and few to the right, so there's just a little gap.

statuspanel { 
        position: fixed; 
        bottom:5px;
        left:5px !important;  
}

**edit: Soapy's approach is probably better

March 25, 2011

You can try this:
.statuspanel-label {
  margin: 0 5px 5px !important;
}
It will move it 5px from the bottom and left.

statuspanel { 
        position: fixed; 
        bottom:5px;
        left:5px !important;  
}

Exactly what I wanted.

Thanks!

March 25, 2011

You can try this:
.statuspanel-label {
  margin: 0 5px 5px !important;
}
It will move it 5px from the bottom and left.

Perfect! But what is the function of the first "0"?

March 25, 2011

Perfect! But what is the function of the first "0"?

.statuspanel-label {
  margin: 0 5px 5px !important;
}

is shorthand for:

.statuspanel-label {
  margin-top: 0 !important;
  margin-right: 5px !important;
  margin-bottom: 5px !important;
  margin-left: 5px !important;
}

Here's a further explanation: http://www.devarticles.com/c/a/Web-Style-Sheets/CSS-shorthand-at-a-glance/4/

2,516 · March 25, 2011

Get the stratiform addon. Failing that try:

http://userstyles.org/styles/33773/firefox-4-choose-your-color

I did not know Stratiform could do that, thanks!

March 25, 2011

.statuspanel-label {
  margin: 0 5px 5px !important;
}
is shorthand for:
.statuspanel-label {
  margin-top: 0 !important;
  margin-right: 5px !important;
  margin-bottom: 5px !important;
  margin-left: 5px !important;
}
Here's a further explanation: http://www.devarticles.com/c/a/Web-Style-Sheets/CSS-shorthand-at-a-glance/4/

Thanks, foxxyn8. Will definitely read your link tomorrow. :)

11,347 · March 26, 2011

I posted this in my own topic, but thought I should share it here. This will get your Fx 4 tabs all the way into the title bar and take up all available horizontal space, assuming you've moved the Firefox menu button elsewhere (use one of many extensions):

* Tabs in Title Bar

#main-window[sizemode=normal][tabsontop] #appmenu-button-container {
position: fixed !important;
z-index: 2 !important;
}
#main-window[sizemode=normal][tabsontop] #toolbar-menubar[autohide="true"]{
margin-top:-14px;
-moz-padding-start:70px!important;
}
#main-window[sizemode=normal] #navigator-toolbox[tabsontop] &gt; #toolbar-menubar[autohide] ~ #TabsToolbar {
-moz-padding-start:0px!important;
-moz-padding-end:110px!important;
}

March 26, 2011

I have yet another question. This one is more related to "content" than to "chrome" but I hope I'll get help!

If I'm viewing a web-page in Fx4, I can select just a bit of the page content by "left-click-hold and drag" with the mouse. If I then right-click, I get a context menu with the option to "View Selection Source". Taking this option opens a new window titled "DOM Source of Selection ..." which shows the source code of the highlighted stuff as well as some code to the left and right (as opposed to ctrl+U which shows source code for an entire page).

I want to know how to tweak the appearance of this page, the "DOM Source of Selection ...". Specifically, I'd like a darker page background with appropriately contrasting text.

I searched userStyles.org but the closest I got was this: http://userstyles.org/styles/37975/about-blank-view-source-dark which helps fix about:blank and about:source (when we hit Ctrl+U on a page).

March 26, 2011

I have yet another question. This one is more related to "content" than to "chrome" but I hope I'll get help!

If I'm viewing a web-page in Fx4, I can select just a bit of the page content by "left-click-hold and drag" with the mouse. If I then right-click, I get a context menu with the option to "View Selection Source". Taking this option opens a new window titled "DOM Source of Selection ..." which shows the source code of the highlighted stuff as well as some code to the left and right (as opposed to ctrl+U which shows source code for an entire page).

I want to know how to tweak the appearance of this page, the "DOM Source of Selection ...". Specifically, I'd like a darker page background with appropriately contrasting text.

I searched userStyles.org but the closest I got was this: http://userstyles.org/styles/37975/about-blank-view-source-dark which helps fix about:blank and about:source (when we hit Ctrl+U on a page).

try this:

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url-prefix("view-source:"){

html {background: #111 !important; color: white !important;}

.start-tag, .end-tag {color: violet !important;}

.attribute-name {color: #ddd !important;}

.attribute-value {color: steelblue !important;}

.comment {color: lightgreen !important;}

a {color:blue !important;}

}

March 26, 2011

try this:

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url-prefix("view-source:"){

html {background: #111 !important; color: white !important;}

.start-tag, .end-tag {color: violet !important;}

.attribute-name {color: #ddd !important;}

.attribute-value {color: steelblue !important;}

.comment {color: lightgreen !important;}

a {color:blue !important;}

}

Perfect. As usual. :)

The neat thing is that it works for both plain view source (entire page source), and view source for a particular selection.

Just to push my luck, is it possible to get it to wrap to screen width? No big deal if it isn't, but great if it is.

Edit: I fiddled a bit with the colors and squeezed in one more line as well:

/* View Source*/
@-moz-document url-prefix("view-source:"){
html {background: #111 !important; color: #666611 !important; }
::-moz-selection {background-color: #377 !important; color: #000 !important} /* &lt;&lt;&lt; I added this line*/
.start-tag, .end-tag {color: violet !important; }
.attribute-name {color: #444 !important; }
.attribute-value {color: green !important; }
.comment {color: lightgreen !important; }
a {color: #888 !important;}
}

39,379 · March 26, 2011

How can I remove the drop down arrow from the Firefox button? Thanks :)

March 26, 2011

How can I remove the drop down arrow from the Firefox button? Thanks :)

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

March 27, 2011

Perfect. As usual. :)

The neat thing is that it works for both plain view source (entire page source), and view source for a particular selection.

Just to push my luck, is it possible to get it to wrap to screen width? No big deal if it isn't, but great if it is.

Sure, just add this to your code:

pre {white-space: pre-line !important; overflow-x: hidden !important;}

or just enable "Wrap Long Lines" in the "View" menu

10,523 · March 27, 2011

Is there any way to put the status text in the url bar without using status-4-ever? I'm using Locationbar2 and those 2 addons are not compatible. Much prefer locationbar2 to status-4-ever so if it can be done this way.. Locationbar2 used to have a feature that did that but it was removed for some reason. :wacko:

March 27, 2011

How do I move the text on the firefox button slightly to the left?

March 27, 2011

How can I remove the drop down arrow from the Firefox button? Thanks :)

How did you get the fox icon in there?

1,812 · March 27, 2011

Two questions for the CSS pros here^^

How can I remove the red middle line in the menu?

And is it possible to remove the dropdown marker in the URL bar entirely? If yes, could I also place the bookmarks star where the marker was before?

Thanks in advance!^^

1,483 · March 27, 2011

.autocomplete-history-dropmarker.urlbar-history-dropmarker{
display:none;}

- dropmarker

I don't know about the red line.

March 27, 2011

Two questions for the CSS pros here^^

How can I remove the red middle line in the menu?

And is it possible to remove the dropdown marker in the URL bar entirely? If yes, could I also place the bookmarks star where the marker was before?

Thanks in advance!^^

#appmenuSecondaryPane { box-shadow: none !important; }

.autocomplete-history-dropmarker.urlbar-history-dropmarker{ display:none !important;}

#star-button { -moz-box-ordinal-group: 2 !important; }

3,098 · March 27, 2011

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

Thanks! The Firefox menu button looks much better without it.

1,812 · March 27, 2011

#appmenuSecondaryPane { box-shadow: none !important; }

.autocomplete-history-dropmarker.urlbar-history-dropmarker{ display:none !important;}

#star-button { -moz-box-ordinal-group: 2 !important; }

Thanks to both of you, the bookmark and dropmarker switch works like a charm and looks wonderful! :D

Just the red line in the menu is still present, the shadow is gone but not the line :(

I had these red lines everywhere in my UI because I use a non default Windows object color, I remember most of the time it was linked to a threeshadow property in Firefox if that helps :pinch:

4,982 · March 27, 2011

Noob(ish) question, I enable the Firefox menu instead of the regular menubar on Linux, bookmark icon gets placed next to the home button. That's nice and all, but the icon looks like total crap, and unlike home/back/forward button, it doesn't follow the system icon theme (I've included the text editor in the pic just so you can see how much the bookmark icon feels out of place).

Any way of manually changing the icon, or if not, anyone know of a good monochrome icon theme?

March 27, 2011

Thanks to both of you, the bookmark and dropmarker switch works like a charm and looks wonderful! :D

Just the red line in the menu is still present, the shadow is gone but not the line :(

I had these red lines everywhere in my UI because I use a non default Windows object color, I remember most of the time it was linked to a threeshadow property in Firefox if that helps :pinch:

Do either of these have any effect?

#appmenuPrimaryPane { border-right: 0 !important; }

or

#appmenuSecondaryPane { border-left: 0 !important; }

1,351 · March 28, 2011

how to put stop reload button inside the urlbar?

Sign In

Share your custom Firefox/Minefield 4 stylish scripts

Recommended Posts

SoapyHamHocks Member

Link to comment

Share on other sites

foxxyn8

Link to comment

Share on other sites

Karl-Johan

Link to comment

Share on other sites

vasa1

Link to comment

Share on other sites

foxxyn8

Link to comment

Share on other sites

Frylock86

Link to comment

Share on other sites

vasa1

Link to comment

Share on other sites

Quillz

Link to comment

Share on other sites

vasa1

Link to comment

Share on other sites

foxxyn8

Link to comment

Share on other sites

vasa1

Link to comment

Share on other sites

+Audioboxer Subscriber²

Link to comment

Share on other sites

luving

Link to comment

Share on other sites

foxxyn8

Link to comment

Share on other sites

trag3dy

Link to comment

Share on other sites

parry

Link to comment

Share on other sites

apathy

Link to comment

Share on other sites

SkyDX

Link to comment

Share on other sites

grayscale

Link to comment

Share on other sites

foxxyn8

Link to comment

Share on other sites

protocol7

Link to comment

Share on other sites

SkyDX

Link to comment

Share on other sites

Syanide

Link to comment

Share on other sites

foxxyn8

Link to comment

Share on other sites

anarkhy

Link to comment

Share on other sites

Recently Browsing 0 members