Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

A11Y: Add aria label to composer messages `Esc` button (#18372)

This commit is contained in:
Penar Musaraj 2022-09-27 08:52:09 -04:00 committed by GitHub
parent 049f8569d8
commit 250c0bccbd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 32 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/javascripts/discourse/app/components/composer-messages.js
View File

@ -128,7 +128,7 @@ export default Component.extend({
this._yourselfConfirm ||
composer.store.createRecord("composer-message", {
id: "yourself_confirm",
templateName: "custom-body",
templateName: "education",
title: I18n.t("composer.yourself_confirm.title"),
body: I18n.t("composer.yourself_confirm.body"),
});

3
app/assets/javascripts/discourse/app/templates/composer/custom-body.hbs
View File

@ -1,3 +0,0 @@
<a href {{action this.closeMessage this.message}} class="close">{{d-icon "times"}}</a>
{{#if this.message.title}}<h3>{{this.message.title}}</h3>{{/if}}
<p>{{html-safe this.message.body}}</p>

4
app/assets/javascripts/discourse/app/templates/composer/dominating-topic.hbs
View File

@ -1,4 +1,6 @@
<a href {{action this.closeMessage this.message}} class="close">{{d-icon "times"}}</a>
<a href {{action this.closeMessage this.message}} class="close" aria-label={{i18n "composer.esc_label"}}>
{{i18n "composer.esc"}} {{d-icon "times"}}
</a>
{{html-safe this.message.body}}

9
app/assets/javascripts/discourse/app/templates/composer/education.hbs
View File

@ -1,2 +1,9 @@
<a href {{action this.closeMessage this.message}} class="close">{{d-icon "times"}}</a>
<a href {{action this.closeMessage this.message}} class="close" aria-label={{i18n "composer.esc_label"}}>
{{i18n "composer.esc"}} {{d-icon "times"}}
</a>
{{#if this.message.title}}
<h3>{{this.message.title}}</h3>
{{/if}}
{{html-safe this.message.body}}

4
app/assets/javascripts/discourse/app/templates/composer/get-a-room.hbs
View File

@ -1,4 +1,6 @@
<a href {{action this.closeMessage this.message}} class="close">{{d-icon "times"}}</a>
<a href {{action this.closeMessage this.message}} class="close" aria-label={{i18n "composer.esc_label"}}>
{{i18n "composer.esc"}} {{d-icon "times"}}
</a>
{{html-safe this.message.body}}

5
app/assets/javascripts/discourse/app/templates/composer/group-mentioned.hbs
View File

@ -1,2 +1,5 @@
<a href {{action this.closeMessage this.message}} class="close">{{d-icon "times"}}</a>
<a href {{action this.closeMessage this.message}} class="close" aria-label={{i18n "composer.esc_label"}}>
{{i18n "composer.esc"}} {{d-icon "times"}}
</a>
{{html-safe this.message.body}}

5
app/assets/javascripts/discourse/app/templates/composer/similar-topics.hbs
View File

@ -1,4 +1,7 @@
<a href {{action this.closeMessage this.message}} class="close">{{d-icon "times"}}</a>
<a href {{action this.closeMessage this.message}} class="close" aria-label={{i18n "composer.esc_label"}}>
{{i18n "composer.esc"}} {{d-icon "times"}}
</a>
<h3>{{i18n "composer.similar_topics"}}</h3>
<ul class="topics">

14
app/assets/stylesheets/desktop/compose.scss
View File

@ -126,17 +126,15 @@
top: 10px;
color: var(--primary);
opacity: 0.5;
font-size: $font-up-1;
&:before {
content: "esc";
font-size: $font-down-1;
margin-right: 0.5em;
font-size: var(--font-0);
.d-icon {
font-size: var(--font-up-1);
margin-left: 0.25em;
}
}
a.close:hover {
&:hover {
opacity: 1;
}
}
ul {
margin: 0;

2
config/locales/client.en.yml
View File

@ -2166,6 +2166,8 @@ en:
similar_topics: "Your topic is similar to..."
drafts_offline: "drafts offline"
edit_conflict: "edit conflict"
esc: "esc"
esc_label: "Click or press Esc to dismiss"
group_mentioned_limit:
one: "<b>Warning!</b> You mentioned <a href='%{group_link}'>%{group}</a>, however this group has more members than the administrator configured mention limit of %{count} user. Nobody will be notified."