fu: Close-up of Fu, bringing a scoop of water to her mouth (Default)
fu ([personal profile] fu) wrote in [site community profile] dw_design2010-12-23 12:41 am

List of Classes

I've been working on cleaning up the design of Dreamwidth. Long term, the goal is to make the design coherent. On this first pass, I only aim to consolidate (most of) the existing classes and elements, collapsing to one class and styling instead of a couple dozen similar-but-different ones on each page, where appropriate.

Side effect, each of the site skin stylesheets is now lighter by something like 10kb *g*


I've thrown up a static page with a list of classes and styling for each class.


The design is not final. But assuming there are no huge glaring issues, I'd like to go ahead and commit this version or this version with some tweaks. (There shouldn't be a huge difference from the current appearance yet).

This doesn't mean that we shouldn't talk about what the design should look like! Just that I think the current code is a good balance of cleanup and not breaking existing appearance, and that I'd like to be able to commit at this stage rather than holding it up forever while we work on a polished design (so let's discuss right here, right now, but I want the overarching design changes to go in the next patch please, and not hold up the commit on this patch)


We need to work on cleaning up the HTML so that the styling / new classes look good when applied to the HTML. As we clean up our HTML, some of the existing classes will go away; that's good, we want that. There's quite a few ridiculous CSS classes in there that are meant to be temporary (say, for example, action-bar and action-box ;-))


For coders/frontend designers:

Use the current global classes listed on /dev/classes as much as possible, instead of defining new ones.

If you're adding a new class to any page, add a sample usage demo on /dev/classes (unless it makes no sense to, but you should try to have it make sense to)



For the dev-oriented among you, I have uploaded patches to Bug 3243 - Need consistent styling across the site

If you apply the patch, and restart your servers, you will find the live page for my static HTML mockups in /dev/classes.