Comment by g0atbutt

10 years ago

This looks (and more importantly, works) much better than before.

For those not on mobile, here is what the new layout looks like on an iPhone 6s on iOS 9.0.1. ==> http://imgur.com/5LgB1xB.jpg

Here is what the comment page looks like ==> http://i.imgur.com/ugOASR5.png

This is the viewport bug when you try to enter a comment ==> http://i.imgur.com/i0Ekiod.png and http://i.imgur.com/T0NDIFc.png

20 comments

g0atbutt

Reply
joezydeco  10 years ago

But why does horizontal mode (my standard casual reading mode) look so blown out? ==> http://imgur.com/5Z6q6wI

(iOS 9, iPhone 5, Safari)

  • hluska  10 years ago

    I use the same environment -- iPhone 5c, iOS 9 and Safari and have the exact same experience.

    Personally, I'd like the old mobile display back!!

    Edit - I noticed that the OP was logged out in the screenshot, so I tried it again. Here is an image of the screen when I am not logged in:

    http://imgur.com/xuhywK6

    Here is the image of the screen when I am logged in:

    http://imgur.com/kHjbFWz

    The only difference between the two cases is that I was too lazy to log out, so I just pulled up the page in private mode.

    I wish I had an iPhone 6 as I'd like to try this case with the OP's environment.

  • ploxiln  10 years ago

    fwiw, as of right now wide view looks fine (full-width) in firefox on android.

    • Natanael_L  10 years ago

      I'm on Firefox Mobile right now on my tablet, a Samsung Galaxy Tab Pro 8.4. The full site looks perfectly good with the only exception that "click targets" are annoyingly small.

      My suggestion is that each user should be able to set his desired text size / DPI resolution per device (tracked via cookies of course), so that I can have properly clickable comment links and upvote buttons and so on on my tablet, and keep everything as before from my laptop.

Donzo  10 years ago

I didn't even have to put my device in landscape mode and pinch to read this post title. WTG.

tillinghast  10 years ago

Viewport "bug" is a "feature" in iOS—change the textarea's font-size to 16px to override the auto-zoom.

  • gideon_b  10 years ago

    This works very well:

    @media screen and (-webkit-min-device-pixel-ratio:0) { select:focus, textarea:focus, input:focus { font-size: 16px; } }

    It uses a css selector only available on iOS devices and enables a larger font to prevent zoom.

    [Original concept] http://stackoverflow.com/a/16255670/209005

    • colinbartlett  10 years ago

      There are quite a few good code snippets and suggestions for improvements to the CSS here.

      I only wish there was some collaborative environment we could use to request changes to the code be pulled in and utilized.

Daneel_  10 years ago

This is what I see in Chrome on iOS 9.0.2 / iPhone 6s: http://i.imgur.com/idgEFon.png

While I definitely support the larger format, I'd like to see the top bar laid out in a more mobile-friendly manner. Currently it feels like I've done Ctrl + Plus on the page a few too many times, rather than the site being properly optimised. Shrink the font by one notch and I'm reasonably happy. I realise that this is a work in progress though.

Great start though! My vote goes to 'Keep'.

Serow225  10 years ago

Keep - but dang et. al. can you make the comments link target touch area slightly bigger somehow? It's way to easy to launch the article link when you're trying to tap the comments link.

kercker  10 years ago

"This is the viewport bug when you try to enter a comment."

This viewport bug appears when I just open the comment page.