Monday, January 25, 2010

Groovy DSL for CSS (Part 2)

Now that we can assign units to numerical values (Part 1) I'll see if I can start putting things together for CSS declarations and rules.

CSS Declarations

In CSS declarations are the statements where you define properties and assign a value to them.

CSS Declaration Examples

These declaration statements are contained within a Rule block which has one or more identifiers. a.k.a. class names, ids, and element names.

CSS Rule Block Example

The Declaration class

The Declaration class is pretty basic it has a name and value. The toString() method will return the CSS declaration name:value.toString();

The Rule class

The rule class is a bit trickier so far I haven't found a way to get around defining getters and setters for all the possible declarations which may not actually be that bad except for having to write them.

The Rule is backed by a Map which stores the declaration name as the key to a declaration. The toString() method returns the CSS for the entire rule.

I have also added a method to the String's metaClass in the Bootstrap.

Now a Rule object can be created off of any String and it actually almost looks familiar.

Testing Declaration and Rule

Ive uploaded the experiment to Google Code and the sources are available at Source.

1 comment:

  1. Pitty it can't look like a normal CSS file. Imagine in Grails for example, we could read in all the CSS for the Pages and spit out 1 large file with all the rules