There are still a number of Facebook graphical elements that need to be styled correctly, but apart from those graphical elements, I think that the code is now pretty close to being 100% complete.

If you find any Facebook elements that are not being styled correctly, please report them, and I’ll add the elements to the code.

Bookmark It

Hide Sites

I have also started styling some of the graphical elements. Most of the Facebook graphical elements (Little plus signs, arrows, etc.) have a solid white background. Of course they look perfectly fine with the default Facebook colour scheme, but when you change the Facebook background colour with Style Facebook, they look a bit silly. I’m a long way from styling all of the graphical elements, but those I have done are all drawn, on the fly, with a transparent background and pen colours to match whatever colours have been selected in Style Facebook.

Bookmark It

Hide Sites

Here is how to stop the flicker: -

Firefox uses a file called userContent.css to apply user specified styling to HTML pages in any domain. In the case of Style Facebook, we are only interested in HTML pages in the facebook.com domain. If you don’t already have a userContent.css file (You’ll find it in the chrome folder in your Firefox profile folder), use a text editor to create it.

Into your newly created userContent.css file (Make 100% that you have created it in the correct place. It must be in the chrome folder inside your Firefox profile folder), paste the following: -

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain("facebook.com")
{
body {display: none;}
}

If you already have a userContent.css file, paste the code listed above into the existing file and save it.

After you have created or edited your userContent.css file, restart Firefox!

The userContent.css file will now cause Firefox to hide (The display: none; line) all HTML pages it finds in the facebook.com domain. Style Facebook will display (display: block;) the page after it has applied the styling. Even if Style Facebook is disabled on the Style Facebook configuration page, it will still cause Facebook pages to be displayed.

Note: - There is a BIG difference between disabling Style Facebook on the Style Facebook configuration page, and disabling the Style Facebook add-on in Firefox. If you have created or edited userContent.css as shown on this page, disabling or uninstalling the Style Facebook add-on means that no HTML pages in the facebook.com domain will be displayed by Firefox, because Style Facebook won’t be there to display them. So if you disable or uninstall the Style Facebook add-on, make sure that you remove the lines that you added to userContent.css, or remove the userContent.css altogether.

Bookmark It

Hide Sites

Style Facebook is still in beta. I guess it is currently styling about 95% of the various Facebook elements, and over the next few days, I’ll continue to add more Facebook elements to the code.

This is the Style Facebook default colour scheme

Using the Blue preset color scheme

If you use Firefox and would like to give Style Facebook a spin, you can install it here: - Install Style Facebook

Bookmark It

Hide Sites