134 lines
No EOL
2.3 KiB
SCSS
134 lines
No EOL
2.3 KiB
SCSS
.tree {
|
|
padding: var(--padding-sm);
|
|
}
|
|
|
|
.tree li {
|
|
list-style: none;
|
|
margin: 2px 0px;
|
|
}
|
|
|
|
.tree-link {
|
|
cursor: pointer;
|
|
display: inline-flex;
|
|
align-items: flex-end;
|
|
padding: var(--padding-xs);
|
|
font-size: $font-size-lg;
|
|
font-weight: 600;
|
|
color: var(--text-color);
|
|
}
|
|
|
|
.tree-label {
|
|
margin-left: var(--margin-sm);
|
|
line-height: 1.4em;
|
|
}
|
|
|
|
.tree-children {
|
|
padding-left: var(--padding-xl);
|
|
margin-bottom: 0;
|
|
|
|
.tree-link {
|
|
font-size: var(--text-md);
|
|
font-weight: normal;
|
|
}
|
|
}
|
|
|
|
.tree-link .node-parent {
|
|
color: var(--text-muted);
|
|
font-size: $font-size-base;
|
|
// width: 10px;
|
|
text-align: center;
|
|
}
|
|
|
|
.tree-link .node-leaf {
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
// .tree-link .node-parent, .tree-link .node-leaf {
|
|
// margin-right: 10px;
|
|
// }
|
|
|
|
.tree-link.active {
|
|
i {
|
|
color: var(--indicator-blue);
|
|
}
|
|
|
|
a {
|
|
color: var(--text-color);
|
|
font-weight: 600;
|
|
}
|
|
}
|
|
|
|
.tree-hover {
|
|
background-color: var(--highlight-color);
|
|
min-height: 25px;
|
|
border: 1px solid var(--border-color);
|
|
}
|
|
|
|
.tree-node-toolbar {
|
|
display: inline-flex;
|
|
padding: 0px var(--padding-xs);
|
|
margin-left: var(--margin-md);
|
|
margin-bottom: -4px;
|
|
margin-top: -8px;
|
|
}
|
|
|
|
// @media (max-width: @screen-xs) {
|
|
// .tree-children {
|
|
// padding-left: 10px;
|
|
// }
|
|
// }
|
|
|
|
// decoration
|
|
// .tree, .tree-node {
|
|
.tree.with-skeleton, .tree.with-skeleton .tree-node {
|
|
position: relative;
|
|
|
|
// &.opened::before, &:last-child::after {
|
|
// content: '';
|
|
// position: absolute;
|
|
// top: 16px;
|
|
// left: 8px;
|
|
// height: calc(100% - 26px);
|
|
// width: 1px;
|
|
// background: var(--border-color);
|
|
// }
|
|
|
|
// &:last-child::after {
|
|
// top: 11px;
|
|
// left: -13px;
|
|
// height: calc(100% - 15px);
|
|
// width: 3px;
|
|
// background: #fff;
|
|
// }
|
|
}
|
|
|
|
// .tree.with-skeleton .tree-children > .tree-node > .tree-link::before {
|
|
// content: '';
|
|
// position: absolute;
|
|
// width: 12px;
|
|
// height: 1px;
|
|
// top: 10px;
|
|
// left: -11px;
|
|
// background: var(--border-color);
|
|
// }
|
|
|
|
// .tree.with-skeleton.opened::before {
|
|
// left: 23px;
|
|
// top: 33px;
|
|
// height: calc(100% - 67px);
|
|
// }
|
|
|
|
.balance-area {
|
|
color: var(--text-color) !important;
|
|
font-size: var(--text-md);
|
|
padding: var(--padding-xs);
|
|
}
|
|
|
|
.tree-link.active ~ .balance-area {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.tree-node.hover-active {
|
|
background-color: var(--fg-hover-color);
|
|
border-radius: var(--border-radius-sm);
|
|
} |