Specifically, I'm looking for a "best practices" way to make an Phone and a Tablet in portrait mode use a panel, and an iPad in landscape use the documentation's "side nav" secondary-content layout.

I can hack something together that renames hte div attributes when an orientation change is detected, but that's not very RWD.  While I've gotten each working independently, I haven't seen a good way (possibly all CSS?) that I could make a responsive site for the side-nav.

I also think it would make an awesome doc/example.  :)