cmu-lib / dhlg

The Digital Humanities Literacy Guidebook
https://cmu-lib.github.io/dhlg
MIT License
59 stars 27 forks source link

Sticky header hides top part of page when clicking anchor links #101

Closed scottbot closed 5 years ago

scottbot commented 5 years ago

See, e.g., https://cmu-lib.github.io/dhlg/global-resources/educational-resources/ma-phd-programs/#graduate-specializations-or-certificates

Any way to fix this?

milnerm commented 5 years ago

using a :target pseudo element with a top-margin. It will persist if the element is in the url, FYI

scottbot commented 5 years ago

is there a way to fix this globally so that we don't have to this for literally every link? (See, eg, https://cmu-lib.github.io/dhlg/global-resources/dh-community/journals/#j)

milnerm commented 5 years ago

Yes, just committed, pushed, and merged fixes. This now uses padding-top on the :target element, which transitions onload, and when the user scrolls, unsets so the original page layout is reestablished. It works on both urls noted above.

scottbot commented 5 years ago

This works on direct URL entry, but not on link click, so opening the ticket again - sorry @milnerm!

milnerm commented 5 years ago

resolved. added a smooth slide from Bill, and tweaked it so the asterisk now appears on direct url entry, and internal links, and the item is sunk on the page. PR and merge coming up in a moment.