-
Couldn't load subscription status.
- Fork 6
Labels
accessibilitydevelopmentdocumentationImprovements or additions to documentationImprovements or additions to documentationfigmaThis task is related to figmaThis task is related to figma
Milestone
Description
Provide a general summary of the issue here
Description:
The indent lines in the Tree component currently have a contrast ratio of 1.4:1 (light mode) and 1.5:1 (dark mode). This is below the recommended 3:1 contrast ratio for non-text elements.
Proposed fix:
- turn indent lines off by default in code and figma
- create guidelines based on best practices: when to show the indent lines, what is the purpose? and add to tree documentation on documentation website
- Replace
border.plainwithborder.boldfor the indent lines in figma and code
UX Guidelines:
1. Only Show Guides When They Add Value
- Show indent lines only for nodes that have visible children (i.e., expandable/collapsible folders or groups).
- Do not show guides for single-level items or leaf nodes unless they are within a visible nested structure.
2. Show Guides for Nested Levels
- Start showing guides from the second level (i.e., when a node is a child of another node).
- Do not show guides for top-level nodes, these are already visually distinct.
Impact:
- Improves accessibility and compliance with WCAG contrast guidelines.
- Ensures indent lines remain visible and usable for all users.
👤 Your name
DR
🧢 Your Product/Team
SLDS
Metadata
Metadata
Assignees
Labels
accessibilitydevelopmentdocumentationImprovements or additions to documentationImprovements or additions to documentationfigmaThis task is related to figmaThis task is related to figma
Type
Projects
Status
✈️ Released