H2O Theme

A versatile theme that starts out using Blankwork for grid positioning because Blankwork is semantic, which means it does not rely on grid specific id or class polluting the markup -- Blankwork lets us do grid positioning without altering existing markup. Instead of:

<div class="main-content grid-12">
blah blah
</div>

which Drupal does not produce on its own, but Drupal does output volumes of markup, at the top level, it has something like:

<div class="main-content">
blah blah
</div>

No grid class. Using Blankwork, we will be able to simplify our stylesheet yet keeping our markup semantic.

Before going any further, Let's describe out css generation framework. For css generation, we're using SASS/Compass. In fact, blankwork is just a plug-in of Compass.

Now, the problem of layout/positioning is solved using Blankwork like this:

.main-content
    +column(12)

We can take any Drupal generated markup and dress/paint a finished page without changing Drupal generated markup, all in css.

On the Drupal server side, we are using Panels Everywere (and its associate "techs" such as panel, page, views, ctools etc) for whole site page composition from front page to every other page in the site.

With all these combine, our theme is flexible like water but powerful like water meeting metal, wood, fire and earth. In Chinese, this is the power of love. 水 發現^會合，金，木，火，土 ：愛的源泉。