Dark Gnome Theme Tips

Inhuman theme

Obviously we love dark themes here at Ubuntu Satanic Edition, but they do bring with them certain issues, mainly due to applications which are not based wholly on GTK widgets. This includes important apps such as Firefox and Open Office.

There are some workarounds which can be used to make these apps useable with dark themes. We'll list as many as we can here, but if you know of any more then please get in touch.

Firefox 3

Ubuntu Hardy 8.04 ships with Firefox 3 beta as the default browser. The default theme automatically inherits much of the look of the Gnome desktop. It does this much better than it used to on Firefox 2 and leads to quite a consistent look when paired with Ubuntu SE's Inhuman theme. However, the default look is quite plain and we'll work on providing an official satanic theme to improve things.

For Firefox 3, our recommendation is to remove any ~/.mozilla/firefox/*/chrome/userChrome.css files which you might have and stick with the default theme.

There are still problems with dark textboxes and buttons which look strange on light web pages. The userContent.css files which we used to use on Firefox 2 don't seem to work correctly on version 3. We're looking into this. Any help would be appreciated.

Firefox 2

Firefox 2 does not inherit the look of the GTK theme so well; it selects some of the colours from the theme to render parts of web pages, such as buttons and text boxes. This can look pretty bad as it's not usually what the web designer intended. It also uses some of the colours to draw its own interface, which can make thing unreadable when used with a light Firefox theme. Sometimes it helps to use a dark Firefox theme.

Luckily, Firefox 2 allows both its interface and web content to be configured by means of CSS files located in the user's profile. So, here are a couple of files which will make Firefox and its web pages more useable with dark themes...

Note that these files live in a directory which has a unique name for each user. The following command should get you there:

cd ~/.mozilla/firefox/*/chrome

Note: the example files in that directory are called userContent-example.css and userChrome-example.css. Make sure you rename them to userContent.css and userChrome.css or they won't be picked up.

If you have any additions or fixes to the above files please let us know.


Leave a comment in the news section.