35 lines
1.2 KiB
JavaScript
35 lines
1.2 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
||
// (No per-icon setup needed here—just ensure your CSS is in place.)
|
||
});
|
||
|
||
// 1) Delegate clicks on any .toggle-icon, now or in the future:
|
||
document.addEventListener('click', function(e) {
|
||
// Find the closest .toggle-icon ancestor of the click target, if any
|
||
if (!e.target.classList.contains('toggle-icon')) return;
|
||
var icon = e.target;
|
||
|
||
// Prevent clicks on the icon from bubbling further if you want
|
||
e.stopPropagation();
|
||
|
||
// Locate its .card-body.collapsable in the same card
|
||
var card = icon.closest('.card');
|
||
if (!card) return;
|
||
var body = card.querySelector('.card-body.collapsable');
|
||
if (!body) return;
|
||
|
||
// Toggle the 'show' class and swap +/– text
|
||
if (body.classList.contains('show')) {
|
||
// Collapse: remove show, update icon, remove from set
|
||
body.classList.remove('show');
|
||
icon.textContent = '+';
|
||
icon.setAttribute('aria-expanded', 'false');
|
||
openCards.add(key);
|
||
} else {
|
||
// Expand: add show, update icon, add to set
|
||
body.classList.add('show');
|
||
icon.textContent = '–';
|
||
icon.setAttribute('aria-expanded', 'true');
|
||
openCards.add(key);
|
||
}
|
||
});
|