paulcpederson
commented
5 months ago Want to add a plus one to the item spacing considerations here. Currently tree items have a minimum height, but no padding. So if the item title is short, there is a good amount of space between items, but for longer titles that wrap, they run together. Makes it very difficult to read and understand. I think using padding rather than min height would be better (ie. allow the item to grow and still have space around it.
Here is a codepen demonstrating the use case:
Check existing issues
Description
Context:
The Hub Discovery team is hoping to make our facets on the new search page more consistent and legible. Some facet labels are longer than others and words wrap to the next line (sometimes even twice). We are looking to consistently format our facets like so:
This is possible for our facet-options in list form, but not for tree facet items. I was able to create the ideal result in Chrome's inspect tool and locate the CSS class we'd like to be able to flexibly alter:
https://github.com/Esri/calcite-design-system/assets/60486980/d03e2647-8fda-48d1-a867-02e23dfa97e4
Other ideas already investigated include:
Here is the class we are hoping to alter: https://github.com/Esri/calcite-design-system/blob/aedd4f35445c43543e3713fc9cb719bb12859f39/packages/calcite-components/src/components/tree-item/tree-item.scss#L135
Acceptance Criteria
items-centerRelevant Info
No response
Which Component
Tree Item (https://github.com/Esri/calcite-design-system/blob/aedd4f35445c43543e3713fc9cb719bb12859f39/packages/calcite-components/src/components/tree-item/tree-item.scss#L135)
Example Use Case
No response
Priority impact
p2 - want for current milestone
Calcite package
Esri team
ArcGIS Hub