added nested list control

master
A1Gard 20 hours ago
parent 1f79ba74b0
commit 237f069b91

@ -0,0 +1,29 @@
document.addEventListener('DOMContentLoaded', function () {
document.querySelectorAll('.nested-list')?.forEach(function (list) {
list.querySelectorAll('li').forEach(function (li) {
// Check if the <li> has a <ul> child
const ulChild = Array.from(li.children).find(child => child.tagName === 'UL');
// Check if the <ul> is not empty (has at least one <li> child)
const hasLiChildInUl = ulChild && ulChild.querySelectorAll('li').length > 0;
if (hasLiChildInUl) {
let plus = document.createElement('i');
plus.setAttribute('class','ri-arrow-down-wide-line float-end mx-2');
li.prepend(plus);
li.classList.add('nested-parent');
plus.addEventListener('click',function () {
this.parentNode.querySelector(':scope > ul').classList.toggle('active');
if (this.classList.contains('ri-arrow-down-wide-line')){
span.classList.remove('ri-arrow-down-wide-line');
span.classList.add('ri-arrow-up-wide-line');
}else{
span.classList.remove('ri-arrow-up-wide-line');
span.classList.add('ri-arrow-down-wide-line');
}
});
}
});
});
});

@ -150,3 +150,17 @@ ul.pagination {
.btn-outline-light:hover{ .btn-outline-light:hover{
color: black !important; color: black !important;
} }
.nested-list{
.ri-arrow-down-wide-line, .ri-arrow-up-wide-line{
cursor: pointer;
}
.nested-parent{
ul{
display: none;
}
}
.active{
display: block !important;
}
}

Loading…
Cancel
Save