Hey Everyone,
May I introduce you to Peroxide an in-development Drupal theme engine that uses Haml as a templating language and can use Sass stylesheets. Peroxide's goal is to make themes faster and easier to create, and to make them more maintainable over time. Haml and Sass both present nice abstractions and tools to make working with templates and stylesheets respectively much easier. Peroxide is also bundled with the compass styling framework which makes it extremely easy to import existing CSS frameworks including Blueprint, CSS resets, CSS3 compatibility tools, and more into your theme.
Alongside of Peroxide, a starter kit theme is being developed to make it easier to get up and going with this theme engine.
Examples
To give you an idea of what this looks like in practice here is a typical node template written in Haml
%div.node.clear-block(id="node-#{$node->nid}" class="#{$node_classes}")
= $picture
- if (!$page)
%h2.node-title
%a(href="#{$node_url}" title="#{$title}")= $title
-# Meta information
-if ($submitted || $terms)
.meta
- if ($submitted)
%span.submitted= $submitted
-if ($terms)
%span.terms.terms-inline= $terms
-# Content
.content.clear-block= $content
= $linksand a typical layout stylesheet written in Sass and using the Blueprint CSS framework
@import "blueprint/grid"
#page
+container()
#container
+container()
#sidebar-left, #sidebar-right
+column(6)
#sidebar-right
+last()
body.one-sidebar #main
+column(18)
body.sidebar-left #main
+last
body.two-sidebars #main
+column(12)Contribute!
Both Peroxide and the starter kit theme are still in development and working is progressing nicely. However, they are not production ready and should only be used in a development setting. With that in mind, if you're interested in making it easier and more fun to theme Drupal sites please contribute! There is plenty to do and it certainly can't be done alone. If you're not a developer providing feedback about bugs or missing features on the github issue queue of either project is also helpful!
Future and More Info
In the future, I'd like to make this a theme engine that is extendable with new CSS frameworks, more Haml filters, and more awesome tools as they become avaiable.
Haml and Sass are both originally projects from the Ruby world and the markup used here is not exactly the same so be careful of the information you read online. Peroxide uses the phamlp project for parsing and compiling Haml and Sass so there is more info on the project page. There is also a short intro (that's much more ruby centric) here. I'll be developing more documentation as time goes on as well.
Finally, if you're going to be at Drupalcon and you're interested in hearing more please consider voting for my session proposal about peroxide.