@adobe/spectrum-css
Version:
The Spectrum CSS top-level backwards compatible package
110 lines (97 loc) • 2.09 kB
CSS
.spectrum-TreeView {
display: block;
list-style: none;
position: relative;
padding: 0;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
outline: none;
}
.spectrum-TreeView-item {
overflow: hidden;
}
.spectrum-TreeView-item.is-open > .spectrum-TreeView-itemLink > .spectrum-TreeView-indicator {
transform: rotate(90deg);
}
.spectrum-TreeView-item.is-open > .spectrum-TreeView {
height: auto;
visibility: visible;
}
.spectrum-TreeView-itemLink {
display: block;
box-sizing: border-box;
cursor: pointer;
padding: 12px 30px;
text-decoration: none;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.spectrum-TreeView-itemLink:focus {
outline: none;
}
.spectrum-TreeView-itemLink .spectrum-Icon {
vertical-align: top;
margin-right: 8px;
}
.spectrum-TreeView-itemLink::before {
content: '';
position: absolute;
left: 2px;
right: 0;
z-index: -1;
margin-top: -8px;
height: 36px;
background-color: transparent;
border-radius: 4px;
}
.spectrum-TreeView-indicator {
display: block;
float: left;
position: relative;
left: 10px;
top: -5px;
margin-left: -34px;
margin-bottom: -10px;
padding: 10px;
transition: transform ease 130ms;
pointer-events: all ;
}
.spectrum-TreeView .spectrum-TreeView {
position: static;
padding-left: 28px;
height: 0;
visibility: hidden;
}
.spectrum-TreeView-item--indent1 {
padding-left: 28px;
}
.spectrum-TreeView-item--indent2 {
padding-left: 56px;
}
.spectrum-TreeView-item--indent3 {
padding-left: 84px;
}
.spectrum-TreeView-item--indent4 {
padding-left: 112px;
}
.spectrum-TreeView-item--indent5 {
padding-left: 140px;
}
.spectrum-TreeView-item--indent6 {
padding-left: 168px;
}
.spectrum-TreeView-item--indent7 {
padding-left: 196px;
}
.spectrum-TreeView-item--indent8 {
padding-left: 224px;
}
.spectrum-TreeView-item--indent9 {
padding-left: 252px;
}
.spectrum-TreeView-item--indent10 {
padding-left: 280px;
}