cockpit-project / cockpit-project.github.io

Cockpit Project Website
https://cockpit-project.org/
MIT License
114 stars 192 forks source link

style: Add a default scroll margin #701

Closed garrett closed 5 months ago

garrett commented 5 months ago

This adds a little space above a fragment-linked item (foo.html#bar), for in-page linking.

I've added a --scroll-margin variable which can be used to customize it per page. But we rely on the fallback for now.

garrett commented 5 months ago

Without:

image

With:

image

(There's just a little bit more space above elements with IDs that get ID targeting.)

This is especially useful for floating elements in page, like with sticky. (Which can be useful for Cockpit itself). But we're not using sticky here, so it's just a little more breathing room at the top of the page when fragment-linking inside page.