Fix caret CSS in collapse, Menu and Tree items - #1333
Conversation
🚀 Storybook PreviewPreview is available at: https://trimble-oss.github.io/modus-wc-2.0/pr-preview/pr-1333/ |
There was a problem hiding this comment.
Pull request overview
This PR updates caret/chevron styling across Collapse, Menu Item, and Tree Item to replace DaisyUI’s box-shadow-based caret with a consistent equal-stroke chevron, and adjusts Side Navigation behavior so the submenu caret is hidden when the rail is collapsed (where submenu expansion is blocked).
Changes:
- Replace DaisyUI box-shadow caret rendering with border-based “equal-stroke” chevrons for menu and tree item dropdown toggles.
- Refactor Collapse chevron styling via a shared SCSS mixin and ensure open/closed rotation states remain correct for left/right chevrons.
- Hide submenu caret in collapsed side navigation rail to avoid clipping and reflect the non-expandable state.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| src/components/modus-wc-tree-item/modus-wc-tree-item.scss | Overrides dropdown caret styling to use border strokes (no box-shadow) while preserving DaisyUI sizing/rotation behavior. |
| src/components/modus-wc-side-navigation/modus-wc-side-navigation.scss | Hides submenu caret when side nav is collapsed to prevent clipping and match blocked expansion behavior. |
| src/components/modus-wc-menu-item/modus-wc-menu-item.scss | Updates dropdown toggle caret styling to border-based chevron for consistent appearance. |
| src/components/modus-wc-collapse/modus-wc-collapse.scss | Introduces a mixin to standardize chevron stroke rendering and applies it to left/right collapse arrows with correct open-state rotation. |
🚀 Blazor Story PreviewPreview is available at: https://trimble-oss.github.io/modus-wc-2.0/pr-preview/pr-1333/blazor/ |
@ElishaSamPeterPrabhu |
As discussed and decided offline, let's go with the png approach. |


📄 Summary of Changes
Fix caret CSS in collapse, Menu and Tree items
Fix side nav visiblity of caret
💭 Type of Change
📋 Test Plan
✅ Self Code Review Checklist
PR authors and reviewers, please verify that all of these items have been completed.
🔗 Work Item
Issue #1309