DevTips / Artists-Theme

🌄 A free Jekyll Theme developed by the DevTips Community
http://devtips.github.io/Artists-Theme
The Unlicense
592 stars 498 forks source link

Client section enhancements #79

Closed NikSteel closed 9 years ago

NikSteel commented 9 years ago

There were a few issues with the client section that this pull request fixes:

  1. The client logos were not clickable because their z index was below the next/prev control's z index, so I fixed it by raising the client logos and mobile nav z index
  2. It was possible for the active client-mobile-nav button and the active client-logo button to be different from one another: if you zoomed in and clicked a mobile nav button and then zoomed out, the logo would be set to whatever the previous active one was (it wouldn't get updated). Also if you zoomed out and clicked the next arrow a bunch of times and then zoomed in, none of the mobile-nav-section buttons would be selected because the clause in the javascript about how to move past the last or first client did not alter the mobile nav buttons.
  3. The next / previous arrows collide with the client content right around the transition between desktop and mobile view, so I adjusted the media query to transition sooner and prevent the collision. I also added a new query at max-width 600px so that the arrows stay on screen for longer before disappearing. (Here's my math: the arrows are 40 + 10 px each, the content is 750 px, so the transition should occur at 850px. The mobile view quote is 400 px, so transitioning at 600 px allows space for the arrows plus 50 px margin on each side.)
  4. The min-width for the client's face was set to 300px -- if zoomed in more than that, it goes off-center, so I lowered the min-width to 180px so that it stays centered for longer.
niklasravnsborg commented 9 years ago

Awesome PR, awesome enhancements! Checked and merged, thank you.