RevelaNetwork/Revela-v4
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Close other dropdowns when a new dropdown is clicked.

Browse source
This commit is contained in:
wearrrrr 2024-02-22 13:19:06 -06:00
parent 2b4534f403
commit 2bf4c596d8
1 changed files with 16 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/components/SettingsTablist.astro
View file

@ -87,12 +87,13 @@ const t = useTranslations(lang);
let dropdown_toggles = document.getElementsByClassName("dropdown-toggle"); let dropdown_toggles = document.getElementsByClassName("dropdown-toggle");
Array.from(dropdown_toggles).forEach((toggle) => { Array.from(dropdown_toggles).forEach((toggle) => {
toggle.onclick = function() { toggle.onclick = function() {
toggleEventListener(toggle); closeOtherDropdowns(toggle.id);
toggleDropdown(toggle);
}; };
}); });
} }
function toggleEventListener(toggle) { function toggleDropdown(toggle) {
let dropdown = document.getElementById(toggle.id + "-menu"); let dropdown = document.getElementById(toggle.id + "-menu");
if (dropdown.style.maxHeight == "0px" || dropdown.style.maxHeight == "") { if (dropdown.style.maxHeight == "0px" || dropdown.style.maxHeight == "") {
dropdown.style.maxHeight = dropdown.scrollHeight + "px"; dropdown.style.maxHeight = dropdown.scrollHeight + "px";
@ -114,6 +115,19 @@ const t = useTranslations(lang);
} }
} }
function closeOtherDropdowns(dropdownIDToExclude) {
let dropdowns = document.getElementsByClassName("dropdown-menu");
Array.from(dropdowns).forEach((dropdown) => {
dropdown.style.maxHeight = "0px";
setTimeout(() => {
if (dropdown.id != dropdownIDToExclude + "-menu") {
let dropdown_toggle = document.getElementById(dropdown.id.replace("-menu", ""));
dropdown_toggle.style.borderRadius = "10px";
}
}, 300);
});
}
function closeDropdown(dropdownID) { function closeDropdown(dropdownID) {
let dropdown = document.getElementById(dropdownID); let dropdown = document.getElementById(dropdownID);
if (dropdown) { if (dropdown) {