isaacs / github

Just a place to track issues and feature requests that I have for github
2.2k stars 129 forks source link

Responsive web design #948

Open Larivact opened 7 years ago

Larivact commented 7 years ago

When the browser window is too narrow the site doesn't adapt and you get a horizontal scroll bar.

neeklamy commented 7 years ago

What are you seeing this on? It sounds like you’re just using a desktop web browser.

GitHub does User Agent sniffing, if you change the UA of your web browser you can see the site adapts, mostly, just fine. There might be edge cases though and missing features (there’s no comment preview for one), but I never use GitHub on anything other than a desktop so I can’t say what those shortcomings are.

If you’re using Google Chrome, open the dev tools and then toggle the device toolbar (currently the second icon from left in dev tools).

In Safari for the Mac, you can go to Safari ▸ Preferences ▸ Advanced ▸ Show develop menu in the menu bar. Then in the Develop menu choose User Agent or Enter Responsive Design Mode (very nice that is too, although I noticed some problems with the submenu on an iPhone 6s). Tip: click on the device to cycle through device orientation and where available, split screen modes).

Firefox has a Responsive Design Mode (again, accessible through the dev tools screen), currently it sits on the right hand side, 4th icon from the close button. But, Firefox’s responsive tools are (as of writing) the least impressive looking of the three.

There’s other things you can do to get the mobile experience too, have a look at site-specific browsers, for Mac there’s the slightly long in the tooth Fluid.