beenull/simple-note
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

change aria-describedby for settings toggle when expanded / collapsed.

Browse source
This commit is contained in:
westtle 2024-02-13 15:19:36 +07:00
parent d357eff591
commit 46e73cf978
1 changed files with 3 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
assets/scripts/settings.js
View file

@ -1,6 +1,7 @@
// HTML. // HTML.
const settings = document.querySelector(".settings"); const settings = document.querySelector(".settings");
const settingsToggle = document.querySelector(".settings__button--toggle-settings"); const settingsToggle = document.querySelector(".settings__button--toggle-settings");
const settingsToggleDescription = document.querySelector(".settings__button-description--toggle-settings");
const settingsList = document.querySelector(".settings__buttons"); const settingsList = document.querySelector(".settings__buttons");
const settingsItems = settingsList.querySelectorAll("a, button"); const settingsItems = settingsList.querySelectorAll("a, button");
@ -10,12 +11,14 @@ function toggleSettings() {
if (isExpanded) { if (isExpanded) {
settings.setAttribute("data-expanded", false); settings.setAttribute("data-expanded", false);
settingsToggle.setAttribute("aria-expanded", false); settingsToggle.setAttribute("aria-expanded", false);
settingsToggleDescription.innerText = "Press to open settings.";
settingsList.setAttribute("aria-hidden", true); settingsList.setAttribute("aria-hidden", true);
settingsList.tabIndex = -1; settingsList.tabIndex = -1;
settingsItems.forEach(item => {item.tabIndex = -1}); settingsItems.forEach(item => {item.tabIndex = -1});
} else { } else {
settings.setAttribute("data-expanded", true); settings.setAttribute("data-expanded", true);
settingsToggle.setAttribute("aria-expanded", true); settingsToggle.setAttribute("aria-expanded", true);
settingsToggleDescription.innerText = "Press to close settings.";
settingsList.setAttribute("aria-hidden", false); settingsList.setAttribute("aria-hidden", false);
settingsList.removeAttribute("tabIndex"); settingsList.removeAttribute("tabIndex");
settingsItems.forEach(item => {item.tabIndex = 0}); settingsItems.forEach(item => {item.tabIndex = 0});