Mobile view doesn't scale that nicely

umts / BusInfoBoard

A place to view bus arrival information from Avail's JSON feed

Apache License 2.0

16 stars 3 forks source link

Mobile view doesn't scale that nicely #8

Closed dfaulken closed 10 years ago

dfaulken commented 10 years ago

@sherson mentioned that when viewing on a phone with a small-ish display, the blocks appear very large. Perhaps it'd be worth specifying font and div sizes as percentages rather than atomic units, or maybe even using media queries.

werebus commented 10 years ago

Media queries are already in there. They're what cause the info to stack and become centered on windows narrower than 900px.

Div widths come from the grid they're in; heights are just determined by content.

You can't make fonts a percentage without fixing the size of the containers (because then what are they a percentage of?) or using some pretty experimental css.

Probably just want to pick a smaller font size for that 900px breakpoint. FWIW, we're largely dealing with a matter of opinion at this point. @bcspragu specifically checked it on his phone and liked what he saw so...

dfaulken commented 10 years ago

That's what I get for not seeing if the CSS had changed since I last looked at it. I'll let this be for now.

sherson commented 10 years ago

On an iPhone 5s, Galaxy S4, and Nexus 7 (Chrome and default browser), everything is rather large. This is a change from how it originally rendered, perhaps due to c2922579a272d76eee366ce58bf5347b02bfd89f?

screenshot_2014-10-07-09-23-18

werebus commented 10 years ago

Well, that's a merge commit; hard to see what's going on there.

That being said, The font sizes in the CSS are the same as they've been since the second commit. It used to be that you would have to zoom and scroll a bunch, but the text is the same size.

bcspragu commented 10 years ago

sherson commented 10 years ago

:+1: