<div class="menu-bar">
<div class="menu">
<div id="menu-dashboard"></div>
<div id="theTree"></div>
</div>
<div class="bottom-content">
</div>
</div>
#theTree.wj-treeview {
color: white;
background: transparent;
overflow-x: hidden;
}
#theTree.wj-treeview .wj-node {
}
#theTree.wj-treeview .wj-node img {
width: 26px;
height: 24px;
}
#theTree.wj-treeview .wj-nodelist .wj-node:before {
display: none;
}
#theTree.wj-treeview .wj-nodelist .wj-node:not(.wj-state-collapsed) {
background: white;
border-radius: 30px 0 0 30px;
font-weight: bold;
color: #003686;
}
#theTree.wj-treeview .wj-nodelist .wj-node.wj-state-collapsed {
background: transparent;
}
#theTree.wj-treeview .wj-nodelist .wj-node.wj-state-empty {
background-color: transparent;
font-weight: normal;
color: rgba(255, 255, 255, 0.8);
}
#theTree.wj-treeview .wj-nodelist .wj-node:not(.wj-state-empty) {
padding: 15px;
}
#theTree.wj-treeview .wj-nodelist .wj-state-empty {
padding-left: 15px;
padding-right: 15px;
}
#theTree.wj-treeview .wj-node.wj-node.wj-state-empty.wj-state-selected {
font-weight: bold !important;
color: white !important;
background: rgba(255, 255, 255, 0.3);
border-radius: 30px;
}
실제로 사용되는 코드입니다. 요청드린 디자인은 부모 노드에만 적용이 되어야하며 자식노드는 위 사진과 같이 다른 디자인이 적용되어야합니다.
보내드린 코드를 기반으로 수정 부탁드립니다.