22. March 2013 22:33
I put together the first template (besides the Muse example) that has a separate display for small screen devices and uploaded it today. Check it out Team Clueless Rally
I used a scooter rally for “Team Clueless” which is a bit of an inside joke related to the Scooter Cannonball held bi-annually where folks are challenged to ride scooters coast to coast with vintage scoots being ride of choice by the organizers. Because of the handicap system new and particularly larger displacement scoots would have an extremely difficult time winning so an alternate no handicap, no winner alternative had been playfully suggested.
The result was “Team Clueless” so I thought I’d use that premise for the latest template. It was also inspired by the distances some folks travel to events like Amerivespa and other rallys whether they are a scooter, motorcycle or car rally.
By swapping out the images and text you can use this template for any event whether it is a one day or multi-day activity.
@fontface with Google web fonts provides the display font for the masthead in order to allow for a fancier type without having to worry about what fonts are installed on the visitor’s system.
CSS 3 rounded corner and box shadows are used in various places which will give a bit more life the site in modern browsers while still displaying with square corners and no shadows in older browser.
A CSS class was used to make the images scalable on small screen.
Media queries serve an additional stylesheet to phones and other small screen devices. Higher resolution/larger screen tablets get the same experience as a desktop user. To accomplish this with the registration form a little extra trickery had to be in the head section of the page which is documented on the register.html page in the site itself.
Let us know what you think of this new template. Available for download from our Template page.