freedomofpress / securethenews

An automated scanner and web dashboard for tracking TLS deployment across news organizations
https://securethe.news
GNU Affero General Public License v3.0
102 stars 25 forks source link

Mobile friendly header #35

Closed GabeIsman closed 7 years ago

GabeIsman commented 8 years ago

Took a pass through all the pages with an eye for making everything work well on mobile. Made a lot of small tweaks and a couple major changes:

  1. The header/nav now works on mobile. I'm not totally happy with how it looks though, perhaps @sinak would like to weigh in on the design.
screenshot 2016-11-06 15 26 16 screenshot 2016-11-06 15 26 23
  1. I hid the score "teaser" at mobile widths. There might be a way to make this look good, but it wasn't immediately obvious to me. The basic idea of a rotating teaser feels somewhat odd on mobile, IMO. And it's hard to make it look good with such limited space.

This PR has all of @garrettr's work merged in, which makes it a little messy (sorry!), but I wanted to make sure I was incorporating all of the latest.

garrettr commented 8 years ago

Changed the base branch to master and merged master into this branch to make this ready for merge. Still reviewing.

garrettr commented 8 years ago

@GabeIsman I think this looks great! The design is simple and functional and I don't think it needs to be much more than this for the initial release. I agree that it's fine to hide the teaser on mobile; if we want to support the teaser on mobile, that could be a potential post-1.0 project.

The only problem I found while QA testing this is an issue with resizing the browser window. As you reduce the width of the browser window, there is a moment where the mobile menu "flashes" - it appears and then disappears again quickly. Here's a video that demonstrates the issue: https://www.youtube.com/watch?v=oili-bSZjQQ.

If that issue is fixed, then I think this is ready to merge. @sinak If you have additional feedback, feel free to weigh in!

GabeIsman commented 7 years ago

@garrettr The window resize issue should be fixed now.

garrettr commented 7 years ago

d904835 is perfect, thanks a lot @GabeIsman!!