.tree-box { // background-color: ; padding: 0 18px 10px 0; } .input-with-select { margin-bottom: 10px; } .br { display: none; } .loading { display: contents; .el-loading-text { display: list-item; white-space: nowrap; } } .ztree { height: calc(100vh - 290px); li a.curSelectedNode { color: var(--bs-el-color-primary); text-decoration: none; } .scroll { height: 100%; width: 100%; .el-scrollbar__wrap { margin-bottom: 0 !important; // padding-bottom: 15px; overflow-x: hidden !important; overflow-y: auto; } } } .triangle { cursor: pointer; position: absolute; z-index: 4; display: block; width: 12px; height: 12px; background: transparent; border-style: solid; transform: rotate(45deg); } .ztreeNodeMenu { z-index: 5; cursor: pointer; background-color:#ffffff; ul { border-radius: 5px; outline: none; box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05); background-color:#ffffff; } li { padding: 5px 10px 5px 10px; span { color:#36474f; font-size: 12px; } &:hover{ //background-color: $color; cursor: pointer; //border-bottom: $color; } } .node-bottom-menu { z-index: 4; padding-top: 10px; ul{ padding: 10px 0 5px 0; } .triangle { top: 4px; background-color:#ffffff; border-color: transparent ; box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.06); } cursor: pointer; .triangle { z-index: 5; left: 50%; transform: translateX(-50%) rotate(45deg); } } .node-top-menu { z-index: 4; padding-bottom: 10px; ul{ padding: 5px 0 10px 0; } .triangle { bottom: 4px; background-color:#ffffff; border-color: transparent transparent transparent transparent; } cursor: pointer; .triangle { z-index: 5; left: 50%; transform: translateX(-50%) rotate(45deg); } } } .treeAddNode{ z-index: 3; margin-right: 6px; width: 10px; right: 0; top: 5px; right: 10px; font-size: 18px; padding:0 8px; font-weight: bold; position: absolute; cursor: pointer; } .ztree li span.button.chk.checkbox_false_full { width: 12px; height: 12px; border-radius: 2px; margin-bottom: 2px; border: 1px solid #999999 !important; background-image: none; } .ztree li span.button.chk.checkbox_false_full_focus { width: 12px; height: 12px; cursor: pointer; margin-bottom: 2px; border-radius: 2px; border: 1px solid #999999; background-image: none; } .ztree li span.button.chk.checkbox_true_full { width: 12px; height: 12px; border-radius: 2px; margin-bottom: 3px; border: 1px solid var(--bs-el-color-primary); background-color: var(--bs-el-color-primary); } .ztree li span.button.chk.checkbox_true_full_focus { width: 12px; height: 12px; cursor: pointer; border-radius: 2px; margin-bottom: 3px; border: 1px solid var(--bs-el-color-primary); padding: 1px; background-color: var(--bs-el-color-primary); } .ztree li span.button.chk.checkbox_true_part { width: 12px; height: 12px; border-radius: 2px; margin-bottom: 3px; border: 1px solid var(--bs-el-color-primary); padding: 1px; background-color: var(--bs-el-color-primary); } .ztree li span.button.chk.checkbox_true_part_focus { width: 12px; height: 12px; cursor: pointer; border-radius: 2px; margin-bottom: 3px; border: 1px solid var(--bs-el-color-primary); padding: 1px; background-color: var(--bs-el-color-primary); } .ztree li span.button.chk.checkbox_false_part { width: 12px; height: 12px; border-radius: 2px; margin-bottom: 3px; border: 1px solid #999999; } .ztree li span.button.chk.checkbox_false_part_focus { width: 12px; height: 12px; cursor: pointer; border-radius: 2px; margin-bottom: 3px; border: 1px solid #999999; }