@difizen/mana-app
Version:
207 lines (171 loc) • 4.7 kB
text/less
/* stylelint-disable declaration-block-no-redundant-longhand-properties */
.mana-tree {
position: relative;
height: calc(100% - var(--mana-border-width));
overflow: hidden;
font-size: var(--mana-ui-font-size1);
color: var(--mana-foreground);
}
.mana-tree:focus .mana-tree-container.empty {
outline-width: 1px;
outline-style: solid;
outline-color: var(--mana-focusBorder);
outline-offset: -1px;
opacity: 1 ;
}
.mana-tree:focus,
.mana-tree-container .ReactVirtualized__List:focus {
border: none;
outline: 0;
box-shadow: none;
}
.mana-tree-container {
height: 100%;
}
.mana-tree-node {
display: flex;
line-height: var(--mana-content-line-height);
}
.mana-tree-node:hover {
color: var(--mana-list-hoverForeground);
background: var(--mana-list-hoverBackground);
cursor: pointer;
}
.mana-tree-node-content {
display: flex;
align-items: center;
width: calc(100% - var(--mana-scrollbar-rail-width));
* {
box-sizing: border-box;
}
}
.mana-expansion-toggle {
display: flex;
justify-content: center;
align-items: center;
min-width: var(--mana-icon-size);
min-height: var(--mana-icon-size);
padding-right: calc(var(--mana-ui-padding) / 2);
padding-left: calc(var(--mana-ui-padding) / 2);
}
.mana-expansion-toggle .tree-switcher {
display: flex;
align-items: center;
justify-content: center;
width: 12px;
height: 12px;
}
.mana-expansion-toggle.mana-mod-busy {
animation: mana-spin 1.25s linear infinite;
}
.mana-expansion-toggle:not(.mana-mod-busy):hover {
cursor: pointer;
}
.mana-expansion-toggle.mana-mod-collapsed:not(.mana-mod-busy) {
transform: rotate(-90deg);
}
.mana-tree:focus .mana-tree-node.mana-mod-selected,
.mana-tree .ReactVirtualized__List:focus .mana-tree-node.mana-mod-selected {
color: var(--mana-list-activeSelectionForeground) ;
background: var(--mana-list-activeSelectionBackground);
}
.mana-tree:focus .mana-tree-node.mana-mod-selected .mana-tree-node-tail,
.mana-tree
.ReactVirtualized__List:focus
.mana-tree-node.mana-mod-selected
.mana-tree-node-tail,
.mana-tree:focus .mana-tree-node.mana-mod-selected .mana-caption-suffix,
.mana-tree
.ReactVirtualized__List:focus
.mana-tree-node.mana-mod-selected
.mana-caption-suffix,
.mana-tree:focus .mana-tree-node.mana-mod-selected .mana-tree-nodeInfo,
.mana-tree
.ReactVirtualized__List:focus
.mana-tree-node.mana-mod-selected
.mana-tree-nodeInfo {
color: var(--mana-list-activeSelectionForeground) ;
}
.mana-tree-nodeInfo {
color: var(--mana-foreground);
opacity: 0.7;
}
.mana-tree .mana-tree-node.mana-mod-selected {
color: var(--mana-list-inactiveSelectionForeground);
background: var(--mana-list-inactiveSelectionBackground);
}
.mana-tree-node.mana-mod-not-selectable {
color: var(--mana-descriptionForeground);
}
.mana-tree-node.mana-mod-not-selectable:hover {
background: none;
cursor: default;
}
.mana-tree-node-segment {
flex-grow: 0;
white-space: nowrap;
user-select: none;
}
.mana-tree-node-segment-grow {
flex-grow: 1 ;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.mana-tree-node-tail {
min-width: 1rem;
text-align: center;
}
.mana-tree-node-segment mark {
color: var(--mana-list-inactiveSelectionForeground);
background-color: var(--mana-list-filterMatchBackground);
}
.mana-tree-source-node-placeholder {
font-style: italic;
text-align: center;
opacity: var(--mana-mod-disabled-opacity);
}
.mana-tree-element-node {
width: 100%;
}
.mana-tree-node-indent {
position: absolute;
height: var(--mana-content-line-height);
border-right: var(--mana-border-width) solid transparent;
}
.mana-tree-node-indent.always,
.mana-tree-container:hover .mana-tree-node-indent.hover {
border-color: var(--mana-tree-inactiveIndentGuidesStroke);
}
.mana-tree-node-indent.active {
border-color: var(--mana-tree-indentGuidesStroke);
}
.mana-tree-container .mana-WelcomeView {
padding-top: var(--mana-ui-padding);
padding-right: 20px;
padding-left: 20px;
}
.mana-tree-container .mana-WelcomeView > * {
margin: 13px 0;
}
.mana-tree-container .mana-WelcomeView .mana-WelcomeViewButtonWrapper {
display: flex;
padding: 0 var(--mana-ui-padding);
}
.mana-tree-container .mana-WelcomeView .mana-WelcomeViewButton {
width: 100%;
max-width: 260px;
margin: auto;
}
.mana-tree-container .mana-WelcomeView .mana-WelcomeViewCommandLink {
cursor: pointer;
}
.mana-tree-container .mana-WelcomeView .mana-WelcomeViewCommandLink.disabled {
cursor: default;
opacity: var(--mana-mod-disabled-opacity);
pointer-events: none;
}
.default-folder-icon,
.default-file-icon {
padding-right: 6px;
}