linode
feat: [M3-7366] - Improved Primary Navigation UX
Description 📝
Overall improvements to primary nav, which includes changes to accommodate longer Cloud Manager feature names.
Changes 🔄
- Increased nav width to 232px
- Added transition to nav links and adjusted logo transition to match
- Tightened spacing around logos, links, and beta chip according to mocks
- Reduced link font size to .875rem/14px
Screenshot
| Before | After |
|---|---|
How to test 🧪
- Checkout branch or preview link
- Verify that opening / closing menu works as intended
- Verify that changing breakpoints works as intended
- Verify changes in different browsers
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
@abailly-akamai Got the green light from Product/UX. So opening this for review
@bnussman-akamai that's a great suggestion - let's go blue! @jaalah-akamai?
@bnussman-akamai that's a great suggestion - let's go blue! @jaalah-akamai?
As an alum, I couldn't resist this one opportunity. 😆
@bnussman-akamai @abailly-akamai @mjac0bs UX wants to hold on the color change especially since we'll be introducing design tokens soon and the colors will shift slightly. It's on our radar though!
I feel like the divider spacing between the logo and the items are a bit cramped in comparison to the other dividers in the nav. Can we increase the spacing? LGTM otherwise!
That's by design so that the border lines up with the top menu