Freecodecamp: Menu doesn't drop down correctly on video pages

[RayBB]

Challenge Name

This happens on all of the videos pages https://www.freecodecamp.com/videos/*

Issue Description

When you click the menu button instead of dropping down like normal it is squished and unreadable.
See screenshot.

Browser Information

• Browser Name, Version: Chrome 49
• Operating System: Android M
• Mobile, Desktop, or Tablet: Mobile
  

  Screenshot

[texas2010]

@hallaathrad

[caravinci]

oh wow. that's sexy :) @BerkeleyTrue what do you think? bootstrap fail?

[texas2010]

@hallaathrad @BerkeleyTrue https://gyazo.com/b5e1083ea58c48aa40aff812f5b889a2

[caravinci]

That's very helpful, @dwd2010! let's see how we get this one sorted out

[augmt]

One solution could be to wrap the NavbarBrand and Navbar.Toggle in a Navbar.Header, though that would throw off the navbar's margins and would require some messing around with the styling.

Or a Clearfix could be added right after the Navbar.Toggle for small and extra-small devices, but some media queries in client/less/main.less would have to be amended.

I / anyone can submit a PR for whichever option seems best.

[caravinci]

Personally, I'd rather we sort issues for specific (i.e. small) devices rather than modifying the whole thing for everyone, unforeseeably risking breaking it for all.

[texas2010]

@hallaathrad, Odd, I test that page on Chrome and Safari on my iPhone 6. it is fine to me.
probably you are right about specific devices.

[charlottetan]

I can repro this on the live site, but am unable to repro when building on localhost, looks like it has been fixed?

[ghost]

This has been solved in staging. Thanks for the heads up @charlottetan 😜