Title photo
frugal technology, simple living and guerrilla large-appliance repair
Sat, 14 Sep 2013

This Ode site is responsive

There's still more to do, but I have enough hacks roughed in to flip the switch on the responsive version of my Ode site.

Thanks to Hans Fast who did most of the work on this here and here.

I'll detail what changes I made to my main Ode theme's HTML and CSS in a near-future post (which I'm already working on).

Responsive design is a big thing for me. It was easy to do in Ode -- and easier thanks to hints from Hans. I still have quite a few elements in Ode's main Logic theme to work on, and I'll knock them down as I get the time to do it.

Thanks once again to Hans Fast for his code, and to Rob Reed for shipping such good code to start with in Ode.

Recent changes:

I tried to code the CSS so the "desktop" layout is what you see in tablets as well. I continue to think that most web sites, including this one, look pretty good on the standard 10-inch tablet (like a full-size iPad), and having sidebars pushed to the bottom is unnecessary on those devices.

So I simplified part of the CSS to make the site stay "normal" until 400px in screen width instead of 800px.

I also made some changes in sidebar behavior. When the screen is small, the sidebar not only goes to the bottom of the page, its text goes from float: right to float: left, and the colored image overlay on the sidebar disappears.