Allow Tree Item Text to Wrap
To make tree item text wrap, you can use these styles (some may not be strictly needed…):
/**********************************************************************/
/* edits to the Tree component to display long text on multiple lines */
.tree-item {
height: fit-content !important;
padding: 1px 0px; /*added this*/
}
.tree-item-label {
flex: unset !important;
flex-wrap: nowrap; /*added this*/
}
.text-scroll{
padding-top:2px;
overflow-wrap: anywhere !important; /* forces the text to wrap to fit the width */
white-space:pre-wrap !important;
}
.label-wrapper-icon {
display: block !important;
padding-top: 4px;
}
.terminal-alignment.last-child{
height: 16px !important;
}
.terminal-alignment .cross-alignment{
height: 16px !important;
}
.tree .tree-item-label .label-wrapper{
align-items: start;
}
/*------------------------------------------------------------------------*/
Example:
