The Bolt Design System provides robust Twig and Web Component-powered UI components, reusable visual styles, and powerful tooling to help developers, designers, and content authors build, maintain, and scale best of class digital experiences.
Close the Page Header after clicking an anchor link.
Details
After clicking an anchor link to an item listed on the same page, it is expected that the menu would close and reveal the related content. This was especially visible on mobile. I added an event listener to handle this action.
How to test
Add an ID to a header tag on the doc site
a. I did it on the Most Popular heading in _patterns/50-pages/65-best-of-content/_boc-gallery.twig
Add a link to that ID.
a. I did it here: _patterns/40-components/page-header/_demo-main-site-page-header.twig
Start your local server and click the demo link.
Confirm the menu closes as expected.
Release notes
Resolved expected behavior for page header menu to close when clinking an on-page anchor link.
Jira
https://pegadigitalit.atlassian.net/browse/DS-498
Summary
Close the Page Header after clicking an anchor link.
Details
After clicking an anchor link to an item listed on the same page, it is expected that the menu would close and reveal the related content. This was especially visible on mobile. I added an event listener to handle this action.
How to test
IDto a header tag on the doc site a. I did it on the Most Popular heading in_patterns/50-pages/65-best-of-content/_boc-gallery.twigID. a. I did it here:_patterns/40-components/page-header/_demo-main-site-page-header.twigRelease notes
Resolved expected behavior for page header menu to close when clinking an on-page anchor link.