feat(header): update header spacing and sizing
๐ Description
Update header styles to match the Figma design.
This PR focuses on the post-header, the post-mainnavigation and post-megadropdown will be finalized in another PR.
๐ Demo
Updated version:
- Header docs
- Portal header: user logged out | user logged in
- Microsite header: user logged out | user logged in
- Jobs header
- One-Pager header
Current version to compare to:
- Header docs
- Portal header: user logged out | user logged in
- Microsite header: user logged out | user logged in
- Jobs header
- One-Pager header
๐ฎ Design review
- [ ] Design review done
- [x] No design review needed
๐ Checklist
- โ My code follows the style guidelines of this project
- ๐ ๏ธ I have performed a self-review of my own code
- ๐ I have made corresponding changes to the documentation
- โ ๏ธ My changes generate no new warnings or errors
- ๐งช I have added tests that prove my fix is effective or that my feature works
- โ๏ธ New and existing unit tests pass locally with my changes
๐ฆ Changeset detected
Latest commit: 533c2a298ffa4acf1f6f4f1e41153544f8c0f419
The changes in this PR will be included in the next version bump.
This PR includes changesets to release 14 packages
| Name | Type |
|---|---|
| @swisspost/design-system-styles | Major |
| @swisspost/design-system-documentation | Patch |
| @swisspost/design-system-components-angular-workspace | Major |
| @swisspost/design-system-components | Major |
| @swisspost/internet-header | Major |
| @swisspost/design-system-nextjs-integration | Major |
| @swisspost/design-system-styles-primeng-workspace | Major |
| @swisspost/design-system-styles-primeng | Major |
| @swisspost/design-system-components-react | Major |
| @swisspost/design-system-components-angular | Major |
| @swisspost/design-system-changelog-github | Major |
| @swisspost/design-system-eslint | Major |
| @swisspost/design-system-icons | Major |
| @swisspost/design-system-tokens | Major |
Not sure what this means? Click here to learn what changesets are.
Click here if you're a maintainer who wants to add another changeset to this PR
Related Previews
- https://preview-6661--swisspost-design-system-next.netlify.app?devModeEnabled=true
Quality Gate passed
Issues
0 New issues
0 Accepted issues
Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code
If you can ensure this is not the case, I'm fine with it. I think it looks better already, than when I checked it on the preview link the first time, but I'm not sure if it may leak to an element like the one I showed above.
Tell me if you're sure, then I will accept the PR ;)
I checked the output and these styles are now only applied to links and buttons that are direct children of the post-header (either standalone or in a list):
They should therefore not leak into menus or drop-downs anymore.