feat: redesign navigation menu and layouts#6235
Draft
Pyatakov wants to merge 5 commits into
Draft
Conversation
cfdc9df to
1c01d40
Compare
Refresh the main navigation with a token-driven brand-tinted style and add a user-selectable vertical (sidebar) or horizontal (top bar) layout. - Drive the sidebar look from --sidebar-* tokens in variables.scss (light and dark); the active accent follows the brand colour. - Replace the dual icon system with PrimeIcons and add group section labels. - Auto-expand the group of the current route; show child items as a flyout when the rail is collapsed; move the collapse toggle into the header. - Add MenuLayoutService and a horizontal top bar built on PrimeNG menubar, with a layout switch on the profile page; offset is driven by --header-width. - Make fixed bottom action bars track the live rail width so they no longer overlap content when the menu is collapsed or horizontal. Signed-off-by: Alex Piatakov <alex.piatakov@swirldslabs.com>
Signed-off-by: Alex Piatakov <alex.piatakov@swirldslabs.com>
- Unsubscribe layout subscription on destroy - Remove dead hover-state handlers left from hover-to-expand - Share getUserInitials helper between header and profile - Guard no-op layout changes in MenuLayoutService - Cache branding data instead of refetching per navigation Signed-off-by: Alex Piatakov <alex.piatakov@swirldslabs.com>
- Add a shared formatBalance helper (3 decimals + ℏ) and use it for the menu and profile balances so they no longer differ in precision/unit. - Let the branding page grow with its content so the fixed action bar no longer overlaps the last card. Signed-off-by: Alex Piatakov <alex.piatakov@swirldslabs.com>
Render a plain red dot instead of the unread count in the collapsed sidebar so it no longer overlaps the bell icon. Signed-off-by: Alex Piatakov <alex.piatakov@swirldslabs.com>
1992d69 to
990d989
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
--sidebar-*design tokens invariables.scss, for both light and dark themes; the active-item accent follows the brand colour, so it can be re-themed by changing a small set of values.p-menubar, switchable from the profile page and persisted to local storage.--header-widthvariable so they track the rail width and no longer overlap content when the menu is collapsed or horizontal.