osr-plastic/osr-discourse-src
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

A11Y: Improve accessibility for saved status message (#18950)

Browse Source 
Toggling channel settings shows a status message when saved. This status message is not accessible to screen readers. This commit ensures that the status message is made accessible.
This commit is contained in:
Keegan George
2022-11-09 10:12:35 -08:00
committed by GitHub
parent b122298428
commit 3d376c71b6
3 changed files with 17 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/chat/assets/javascripts/discourse/templates/components/chat-channel-settings-view.hbs
+9 -3
View File
@@ -6,7 +6,9 @@
<div class="chat-form__control">
<ComboBox @content={{this.mutedOptions}} @value={{this.channel.current_user_membership.muted}} @valueProperty="value" @class="channel-settings-view__muted-selector" @onChange={{action (fn this.saveNotificationSettings "muted")}} />
{{#if this.savedMuted}}
<span class="channel-settings-view__saved">✓ {{i18n "saved"}}</span>
<span class="channel-settings-view__saved" role="status" aria-label={{i18n "chat.channel_settings.save_label.mute_channel"}}>
{{d-icon "check"}} {{i18n "saved"}}
</span>
{{/if}}
</div>
</div>
@@ -19,7 +21,9 @@
<div class="chat-form__control">
<ComboBox @content={{this.notificationLevels}} @value={{this.channel.current_user_membership.desktop_notification_level}} @valueProperty="value" @class="channel-settings-view__desktop-notification-level-selector" @onChange={{action (fn this.saveNotificationSettings "desktop_notification_level")}} />
{{#if this.savedDesktopNotificationLevel}}
<span class="channel-settings-view__saved">✓ {{i18n "saved"}}</span>
<span class="channel-settings-view__saved" role="status" aria-label={{i18n "chat.channel_settings.save_label.desktop_notification"}}>
{{d-icon "check"}} {{i18n "saved"}}
</span>
{{/if}}
</div>
</div>
@@ -31,7 +35,9 @@
<div class="chat-form__control">
<ComboBox @content={{this.notificationLevels}} @value={{this.channel.current_user_membership.mobile_notification_level}} @valueProperty="value" @class="channel-settings-view__mobile-notification-level-selector" @onChange={{action (fn this.saveNotificationSettings "mobile_notification_level")}} />
{{#if this.savedMobileNotificationLevel}}
<span class="channel-settings-view__saved">✓ {{i18n "saved"}}</span>
<span class="channel-settings-view__saved" role="status" aria-label={{i18n "chat.channel_settings.save_label.mobile_notification"}}>
{{d-icon "check"}} {{i18n "saved"}}
</span>
{{/if}}
</div>
</div>