commercialhaskell/stackage-server

"Contents" sidebar starts overlapping content at 1,280 pixels wide

jkachmar opened this issue · 4 comments

Originally from commercialhaskell/stackage#4911 (cc @tfausak)

I hope this is the right place to open this issue! Please let me know if it isn't and I'll move it where it belongs.

I recently noticed that the Haddock output on Stackage looks different. In general I like it, but I've noticed a problem at a certain break point. The "Contents" sidebar starts overlapping the content when the viewport is 1,280 pixels wide (or wider). Here's an example from Scotty's documentation:

Screen Shot 2019-10-13 at 20 09 59

At 1,279 (and narrower) pixels wide, the "Contents" sidebar goes to the right and nudges content out of the way. Here's another example from Scotty's documentation:

Screen Shot 2019-10-13 at 20 11 05

I don't have a suggestion for a solution here, but I do feel that all content should be visible at all breakpoints. Thanks!

If we append ?style=plain to the URL, this problem seems to disappear. Can you confirm? If so, it looks like a mismatch between the Stackage custom CSS and the new Haddocks. Options I see are:

  1. Turn the custom styling off by default
  2. Fix the CSS for the new CSS style
  3. Try to do something conditional based on the Haddock version (harder)

I lean towards (1), with (2) open to anybody interested in taking a stab at it. I'll push a commit to do so. In the meanwhile, pinging @chrisdone as well.

Yup, adding ?style=plain fixes it.

The commit above deployed to production, so in theory that query string is no longer necessary.

Looks like that must have fixed it. Can't reproduce now.