Merge pull request #4109 from nextcloud/nextcloud/server/37136/add-ar…

…ia-expanded-to-settings-button Add aria-expanded to settings accordion button
nextcloud-libraries · May 17, 2023 · a93cd0d · a93cd0d
2 parents b8e7742 + 12ee9d4
commit a93cd0d
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 0 deletions.
diff --git a/l10n/messages.pot b/l10n/messages.pot
@@ -143,6 +143,9 @@ msgstr ""
 msgid "Open navigation"
 msgstr ""
 
+msgid "Open settings menu"
+msgstr ""
+
 msgid "Password is secure"
 msgstr ""
 

diff --git a/src/components/NcAppNavigationSettings/NcAppNavigationSettings.vue b/src/components/NcAppNavigationSettings/NcAppNavigationSettings.vue
@@ -27,6 +27,9 @@
 		<div id="app-settings__header">
 			<button class="settings-button"
 				type="button"
+				:aria-expanded="open ? 'true' : 'false'"
+				aria-controls="app-settings__content"
+				:aria-label="ariaLabel"
 				@click="toggleMenu">
 				<Cog class="settings-button__icon" :size="20" />
 				<span class="settings-button__label">{{ name }}</span>
@@ -77,6 +80,9 @@ export default {
 				this.clickOutsideOptions,
 			]
 		},
+		ariaLabel() {
+			return t('Open settings menu')
+		},
 	},
 	methods: {
 		toggleMenu() {