You are not logged in.

#1 2008-06-23 04:45:04

Allan
Pacman
From: Brisbane, AU
Registered: 2007-06-09
Posts: 11,365
Website

firefox userChrome.css tweaks

With firefox3 out I had to update all my tweaks, so I thought I'd share.

/* Remove throbber */
#throbber-box { display: none !important; }

/* Remove go button */
#go-button { display: none !important; }

/* Remove the bookmark star */
#star-button { display: none !important; }

/* Remove magnifying glass button from search box */
.search-go-button { display: none !important; } 

/* Merge reload and stop buttons. NOTE: Stop button must be placed before reload button */
#stop-button[disabled] { display: none; }
#stop-button:not([disabled]) + #reload-button { display: none; } 

/* Remove the history menu */
#history-menu { display: none !important; }

/* Remove forward button drop down arrow */
#back-forward-dropmarker { display: none !important; }

/* Hide the dropmarker in the Address url toolbar */
.autocomplete-history-dropmarker { display: none !important; }

What I still can't get working is some rounding on the address bar.  Here is my current attempt...

/* Slightly rounded address and search bar corners */
#urlbar {
  -moz-appearance: none !important;
  -moz-border-radius: 3px !important;
  padding-right: 1px !important;
}
#search-bar {
-moz-appearance: none !important;
-moz-border-radius: 3px !important;
}

What do you tweak?

Edit: added a few more

Offline

#2 2008-06-23 10:09:09

Ramses de Norre
Member
From: Leuven - Belgium
Registered: 2007-03-27
Posts: 1,289

Re: firefox userChrome.css tweaks

Nice, I didn't really know that you could do such things smile I've stolen a couple of yours wink
I don't like the abrupt border of the urlbar when the dropdown menu is removed though, but I don't really know css either... Maybe it's time to learn it, I'll keep an eye on this thread too smile

Offline

#3 2008-06-23 10:58:55

Allan
Pacman
From: Brisbane, AU
Registered: 2007-06-09
Posts: 11,365
Website

Re: firefox userChrome.css tweaks

Ramses de Norre wrote:

I don't like the abrupt border of the urlbar when the dropdown menu is removed though

That is what the rounded edges on the address bar is supposed to fix but I still can't get it working...

Offline

#4 2008-06-23 11:58:20

Mr Green
Forum Fellow
From: U.K.
Registered: 2003-12-21
Posts: 5,893
Website

Re: firefox userChrome.css tweaks

Got rid of History.... Help one next :-) maybe a wiki page of Firefox tweaks?

http://lifehacker.com/396741/functional … ser-styles

http://lifehacker.com/396863/how-to-con … e#loggedin

Last edited by Mr Green (2008-06-24 16:49:49)


Mr Green

Offline

#5 2008-06-24 21:42:22

sm4tik
Member
From: Finland, Jyväskylä
Registered: 2006-11-05
Posts: 248
Website

Re: firefox userChrome.css tweaks

This is the closest I've come so far with the rounded corners.

/* Remove background of urlbar buttons */
#urlbar > #urlbar-icons { background: none !important; }

/* Get rid of dropdown indicator */
#urlbar > dropmarker { display: none !important; }

/* A little gap between urlbar and window border */
#urlbar-container { margin-right: 3px !important; }

/* Round the corners */
#urlbar :not(dropmarker) {
    background: -moz-Field !important;
    border-width: 0px !important;
    -moz-appearance: none !important;
    -moz-border-radius: 15px !important;
    }

A few notes on that one. The dropdown button from urlbar removed in a different way (I just noticed that). I removed background from all the urlbar buttons (icons), didn't find a way to fix collapsed RSS-button indicator annoyance otherwise. To make your urbar "transparent", remove

background: -moz-Field !important;

from the "#urlbar :not(dropmarker)" section.
Just on a side note, I'm not using this myself since I don't like rounded stuff thet much, but I just had to check it out and see how it'll come up wink And also, I'm not using searchbox myself, so it won't be affected with roundness. Anyways, hope this gives a little something to get things rolling on. Happy hunting!

@Allan: btw, the throbber can be treated as a toolbar button, so you can just rightclick > customize > drag it away, instead of using userChrome.css to get rid of it!

Offline

#6 2008-06-25 01:49:27

Allan
Pacman
From: Brisbane, AU
Registered: 2007-06-09
Posts: 11,365
Website

Re: firefox userChrome.css tweaks

Oooh... thanks!

I have settled on

#urlbar :not(dropmarker) {
    background: -moz-Field !important;
    border-width: 0px !important;
    -moz-appearance: none !important;
    -moz-border-radius: 3px !important;
    padding-right: 1px !important;
}

I just want a little roundedness.  And this also makes the border disappear which I like.

Offline

#7 2008-06-25 21:53:29

fifafrazer
Member
Registered: 2008-02-18
Posts: 81

Re: firefox userChrome.css tweaks

Hey.. I have a problem with my usercontent.css after upgrading to firefox 3. I'm using a dark gtk theme, thus input forms have dark backgrounds with black text, which is very hard to read. My usercontent.css worked fine in the old version. Here it is:

input {
    border: 2px inset white ! important;
    background-color: white ! important;
    color: black;
}

textarea {
    border: 2px inset white ! important;
    background-color: white ! important;
    color: black ! important;
}

select {
    border: 2px inset white ! important;
    background-color: white ! important;
    color: black ! important;
}
 
input[type="radio"],
input[type="checkbox"] {
    border: 2px inset white ! important;
    background-color: white ! important;
    color: ThreeDFace ! important;
}

*|*::-moz-radio {
    background-color: white;
}

button, 
input[type="reset"],
input[type="button"],
input[type="submit"] { 
    border: 2px outset white;
    background-color: #eeeeee;
    color: black;
}

body {
    background-color: white;
    color: black;
    display: block;
    margin: 8px;
}

EDIT:
Nevermind, I'm just using another gtk theme when launching firefox with my keyboard shortcut. like this:
GTK2_RC_FILES="/usr/share/themes/Xfce-dawn/gtk-2.0/gtkrc" firefox

Last edited by fifafrazer (2008-06-25 22:20:02)

Offline

#8 2008-06-26 04:08:54

broch
Banned
From: L.A. California
Registered: 2006-11-13
Posts: 975

Re: firefox userChrome.css tweaks

best rounded effect:
https://addons.mozilla.org/en-US/firefox/addon/933
not compatible with FF3

my userChrome.css

/* Hide the searchbar in Bookmark Sidebar */
#bookmarksPanel > hbox { display:none; }
/* Remove the vertical separator on the sidebar */
/#sidebar-splitter { display: none !important; }
/*"linux user type" scrollbar
#scrollbarbutton[sbattr="scrollbar-up-bottom"]{
display: -moz-box !important;
}



/* Eliminate the throbber and its annoying movement.  */
#throbber-box
{
    display: none !important;
}

iframe[name=google_ads_frame] {display: none !important;}

scrollbarbutton[sbattr="scrollbar-up-bottom"]{
display: -moz-box !important;
}

/* Force the label to be visible, even in no text */
toolbar:not([mode=full]) #back-button .toolbarbutton-text {
  display: -moz-box !important;
  padding-bottom: 2px;
  padding-right: 10px;
  padding-left: 2px;
}

/* put some spacing around the button icon */
toolbar:not([mode=full]) #back-button .toolbarbutton-icon {
  padding-left: 8px;
  padding-right: 6px;
}

/* Put the label to the right of the button */
toolbar:not([mode=full]) #back-button .toolbarbutton-menubutton-button {
  -moz-box-orient: horizontal !important;
}

/* Remove the Go, Bookmarks, History and Help menus
(These are just examples. Try changing "Go" to "Edit" or "Bookmarks") */
menu[label="Go"], menu[label="Help"], menu[label="History"], menu[label="Bookmarks"]{
display: none !important;
}

/* Make menus XP style */
menupopup, popup {
   border: 1px solid ThreeDShadow !important;
   -moz-border-left-colors: ThreeDShadow !important;
   -moz-border-top-colors: ThreeDShadow !important;
   -moz-border-right-colors: ThreeDShadow !important;
   -moz-border-bottom-colors: ThreeDShadow !important;
   padding: 2px !important;
   background-color: Menu !important;
}
menubar > menu {
   border: 1px solid transparent !important;
   padding: 2px 5px 2px 7px !important;
   margin: 0 !important;
}
menubar > menu[_moz-menuactive="true"] {
   background-color : Highlight !important;
   color: HighlightText !important;
}

/* Change color of active tab */
tab{
   -moz-appearance: none !important;
}
tab[selected="true"] {
   background-color: rgb(222,218,210) !important;
   color: black !important;
}

/* Change color of normal tabs */
tab:not([selected="true"]) {
   background-color: rgb(200,196,188) !important;
   color: gray !important;
}

/* Change cursor for JavaScript links */
a[href^="javascript:"] {
   cursor: move;
}
/*Additionally if you want the the "list all tabs" button shown only when the tabs overflow, use this instead: */
/*.tabs-alltabs-stack {
display: none !important;
}
.tabbrowser-tabs:not([overflow="true"]) > .tabs-alltabs-stack {
display: none !important;
} */
/* Remove extra padding from the Navigation Bar */
.toolbarbutton-1, .toolbarbutton-menubutton-button {
   padding: 2px 3px !important;
}
.toolbarbutton-1[checked="true"], .toolbarbutton-1[open="true"],
.toolbarbutton-menubutton-button[checked="true"],
.toolbarbutton-menubutton-button[open="true"] {
   padding: 4px 1px 1px 4px !important;
}

/* Remove Stop button when there's nothing to Stop */
#stop-button[disabled="true"] { display: none; }

/* Remove Back button when there's nothing to go Back to */
#back-button[disabled="true"] { display: none; }

/* Remove Forward button when there's nothing to go Forward to */
#forward-button[disabled="true"] { display: none; }

/*Remove magnifying glass button from search box*/
.search-go-button-stack { display: none !important; }

/* Make inactive tabs hardly visible */
#content tab:not([selected="true"]) {
    -moz-opacity: 0.5 !important; }

/* Slightly rounded address and search bar corners with FF2 use Wellrounded add-on*/
#urlbar {
-moz-appearance: none !important;
-moz-border-radius: 3px !important;
  padding-right: 1px !important; }


/* Less bookmark button spacing */
.bookmark-item > .toolbarbutton-text {
  margin: 0 1px !important;
}

/* hide seperators between toolbars, better results with some themes */
#toolbar-menubar {
min-height: 11px !important;
padding: 0px !important;
margin: 0px !important;
border: none !important;
}
#nav-bar {
border: none !important;
padding: 0px !important;
}
#PersonalToolbar {
border: none !important;
}

/* Change the progress bar color */
.progress-bar {
-moz-appearance: none !important;
background-color: #E8E8E8 !important;
}

/* Bookmarks Font */
.bookmark-item > .toolbarbutton-text {
  margin-top: 4px !important;
  }
/* The following four lines were added by KDE */
scrollbarbutton[sbattr="scrollbar-up-top"] { display: -moz-box !important; }
scrollbarbutton[sbattr="scrollbar-down-top"] { display: none !important; }
scrollbarbutton[sbattr="scrollbar-up-bottom"] { display: -moz-box !important; }
scrollbarbutton[sbattr="scrollbar-down-bottom"] { display: -moz-box !important; }

Last edited by broch (2008-06-26 04:14:55)

Offline

Board footer

Powered by FluxBB