Firefox Fields

If people are anything like myself, they like to change the default theme that Ubuntu uses. As much as I appreciate the hard work that the art team does, I'm not that big a fan of the default theme. Personally I prefer darker themes, most of my electronics are black and I feel comfortable around a darker theme.

However, there has always been a "flaw," at least in mine and my wife's eyes, with using a darker theme in Ubuntu. This flaw is with Firefox. You see, by nature Firefox for Ubuntu incorporates the theme of the environment into itself. Meaning, if you change the desktop theme, Firefox will follow suit. Sometimes when a darker theme is used, Firefox will have dark entry fields to type into. For the most part the text color will be something of the lighter nature and it's ok, but once in a while I will stumble upon a website that has a dark entry field and dark colors for the entry field text. Needless to say, in my case this causes a lot of typos.

I'm getting tired of highlighting what I typed...

Here is my solution for fixing this "flaw."

Navigate to /home/username/.mozilla/firefox/~/chrome

Replace username with your computer login username.
Replace ~ with the crazy folder name that's located in your firefox directory. For example, mine was 5ts89n7i.default

Now open userContent-example.css

Replace everything in the file with this: (Note: If you already have a custom userContent.css file, this will not work for you.)

/* Smooth Scrolling Workaround: Disable Fixed Background Images on Pages */

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

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

select {
border: 2px inset white;
background-color: white;
color: black;
-moz-appearance: none !important;
}

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

**::-moz-radio {
background-color: white;
-moz-appearance: none !important;
}

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

body {
background-color: white;
color: black;
display: block;
margin: 8px;
-moz-appearance: none !important;
}

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

Now save the file as userContent.css

Restart ALL sessions of Firefox that are running.

Your entry fields should now look like this...
I am still working to tweak a few more things, but this should definitely get the ball rolling for you as it has done for me.

What I'd like to tweak still:

• Check box background color
• Upload file entry field
• Radio buttons

If anyone else has a fix for this already, I'm all eyes...