Outcome3 has a New Drupal Theme

After some hard work, the new Outcome3 Drupal theme is up!

How We Did it...

jQuery, CCK and Views

The new design's landing page highlights a jQuery Carousel, and some shiny new icons! This was implemented in combination with views, each sliding section as a separate custom node with CCK fields. The form section is from the module WebForm.

jQuery is also used to hide and show the browse section, the dropdown on the primary navigation on mouse hover, an expandable section on the landing page, and on the searchbox.

I'm pretty new with using javascript and jquery, but it was fun to finally have a project to be able to play around with it.

Twitter Integration

Using the Drupal's feed Aggregator, we imported our Twitter feed, and then themed the block, this required some php to override the default minimum number of feeds outputted, two- to our desired one post.

Imagecache

Imagecache was used in both generating profile images for blog posts, but also for Our Clients page and block.

CSS3 and Battling with IE

I decided to play around with some new supported CSS3 features for this design, mainly RGBA (alpha transparency) colours and border radius. This, is currently supported by Safari and Firefox, the downgraded version of this site will see non-rounded corners and regular backgrounds for most elements. In some cases, a transparent background was pretty essential, so transparent PNGs were used in place of.

This theme also utilizes PNG fixes to enable support for ie6, (PS. thank you Google, maybe we can all follow in your example soon too!). Big Thank-Yous to: DillerDesign and TwinHelix

Like it?

Like the new design? Notice a bug? Want to learn more about us? Contact us!