diff --git a/.Jules/palette.md b/.Jules/palette.md index 3723067..ba61b7a 100644 --- a/.Jules/palette.md +++ b/.Jules/palette.md @@ -5,3 +5,7 @@ ## 2024-06-21 - Added skip-to-content link **Learning:** Found a missing skip-to-content link, which is a key accessibility feature to help keyboard and screen reader users bypass navigation. Additionally learned that giving `
` `tabindex="-1"` and removing its outline when `:focus-visible` ensures proper focus handling after clicking the skip link without disruptive visual outlines. **Action:** Always include a skip-to-content link near the start of the `body` and manage target focus appropriately. + +## 2024-05-24 - [Anchor Scroll Alignment with Sticky Header] +**Learning:** Sticky headers (81px height) obscure anchor targets when navigating via jump links, hiding the start of the section and causing confusion. +**Action:** Always maintain `scroll-padding-top` on the `html` element equal to the sticky header's height to ensure anchor links scroll to a position just below the header. diff --git a/.gitignore b/.gitignore index 3c3629e..fafe757 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ node_modules +venv/ diff --git a/styles.css b/styles.css index dfc509c..aada0d5 100644 --- a/styles.css +++ b/styles.css @@ -23,6 +23,7 @@ html { scroll-behavior: smooth; + scroll-padding-top: 81px; } body {