New themes: Sands and Sands_CSS

By Samat Jain on 8 Apr 2006 at 03:40 UTC

I've made two new Drupal themes available: Sands and Sands_CSS.

Sands had been available for a while but I never really announced it; I've made a lot of changes to it since then, and split into two versions. My motivations for creating this theme I've voiced in another thread: Creating a new Bluemarine-like generic theme.

The “normal” version (“Sands”) uses tables for layout, similar to Bluemarine, Fancy, etc. It works great in 4.6 and 4.6 across many browsers.

The CSS version (“Sands_CSS”) uses a fairly advanced “holy grail” 3 column CSS layout, with all the nice tidbits: it's fluid/elastic (scales with font size changes), has source-ordered columns (main column appears first in the HTML) for better SEO. It works well in Firefox, KHTML (Konqueror and Safari), but unfortunately not too well in Internet Explorer, especially in 4.6, because of weird CSS problems triggered by the use of <base href=”...”>

They both use Mark James' Silk CMS icons to emphasize certain links, like the author, node date/time, read more, add comment, etc links. This is common in Wordpress themes but hasn't been popular with Drupal themes.

One of my major goals with this theme was to make it easily modifiable: I'd want to use this theme to develop other, more-custom themes. CSS rules are well-laid out and separated, for example colors.css solely styles colors and is meant to be modified. Layout.css contains things such as paddings and margins, which most people do not need to modify. The column layout code (in case you want to use your own) is also segregated, which makes the difference between Sands and Sands_CSS only two files. Removal of icons.css removes the use of the Silk icons in case you did not like them. So on and so forth.

There are some bugs/issues with the 4.7 version, but I plan to commit any fixes as I come across them. I also plan to write a customization guide, including how to add sIFR fonts for headings, changing colors, and making the theme fixed-width.

Quick links:

I appreciate any feedback!