add mobile CSS
Idea
+status
+priority
+issues
Layout for iPod/iPhone, Android and other smartphone screen sizes.
+solution
Okay, this approach is probably wrong. Better to have all the changes be via a CSS card called instead of *css when a mobile browser is detected. Starting again with http://en.dwagn.org/*cssmobile
When we think it's good enough:
- auto-detect and redirect mobile users to, say, m.wagn.org (m.sandbox.wagn.org, etc.)
(document or at least point to how to do that for people installing Wagn) - have m. addresses use *cssmobile
- migrate *cssmobile
What to accomplish in *cssmobile:
- fixed #menu
(http://test.dwagn.org/wagn/fixed_top_bar not working - not a WebKit issue since it does work in Safari. see keep top bar always on-screen) - #menu - put span#logging on a second line (can that be done without making it a div?)
- √960px width
(Test on iPhone 4, maybe okay as is - tried 960pt but didn't look right. What about mobile devices wider than 960px?) - √primary/secondary full-width
- (ideally you wouldn't even download it, but that's not possible w CSS-only, right?) √drop logo
- √footer and tabs and "page" icon always visible
- bump up card menu (in header) and watch link (in footer) font size (why are they smaller than left-side text anyway?)
- detect orientation and adjust width?
- ??
An older approach, leaving as is for now: http://www.wagn.org/wagn/add_mobile_layout?layout=mobile
+discussed in support tickets
+relevant user stories