IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-25 02:11:08 -06:00
Code Issues Packages Projects Releases Wiki Activity

A11Y: composer tip close link should be a button (#23731)

Browse Source
This commit is contained in:
Kris 2023-10-03 09:09:54 -04:00 committed by GitHub
parent 70be873b9c
commit c9db9e9319
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 40 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/assets/javascripts/discourse/app/components/composer-tip-close-button.hbs Normal file
View File

@ -0,0 +1,7 @@
<DButton
@action={{@action}}
@icon="times"
@label="composer.esc"
@ariaLabel="composer.esc_label"
class="btn-flat close"
/>

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

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

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

@ -1,12 +1,4 @@
<a
href
{{on "click" (fn this.closeMessage this.message)}}
class="close"
aria-label={{i18n "composer.esc_label"}}
>
{{i18n "composer.esc"}}
{{d-icon "times"}}
</a>
<ComposerTipCloseButton @action={{fn this.closeMessage this.message}} />
{{#if this.message.title}}
<h3>{{this.message.title}}</h3>

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

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

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

@ -1,11 +1,5 @@
<a
href
{{on "click" (fn this.closeMessage this.message)}}
class="close"
aria-label={{i18n "composer.esc_label"}}
>
{{i18n "composer.esc"}}
{{d-icon "times"}}
</a>
<ComposerTipCloseButton @action={{fn this.closeMessage this.message}} />
{{html-safe this.message.body}}
<p>
{{html-safe this.message.body}}
</p>

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

@ -1,12 +1,4 @@
<a
href
{{on "click" (fn this.closeMessage this.message)}}
class="close"
aria-label={{i18n "composer.esc_label"}}
>
{{i18n "composer.esc"}}
{{d-icon "times"}}
</a>
<ComposerTipCloseButton @action={{fn this.closeMessage this.message}} />
<h3>{{i18n "composer.similar_topics"}}</h3>

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

@ -92,6 +92,14 @@
box-shadow: var(--shadow-dropdown);
background: var(--highlight-bg);
> p,
h3 {
&:first-of-type {
margin-top: 0;
margin-right: 3em;
}
}
&.urgent {
background: var(--danger-low);
}
@ -105,10 +113,9 @@
bottom: unset;
padding: 2.25em 6em 2.5em 2.25em;
p {
margin-top: 0;
font-size: var(--font-up-1);
}
button {
button:not(.close) {
margin-top: 0.5em;
}
}
@ -117,21 +124,27 @@
margin-bottom: 10px;
}
a.close {
display: flex;
.btn.close {
flex-direction: row-reverse;
align-items: center;
position: absolute;
right: 10px;
top: 10px;
color: var(--primary);
opacity: 0.5;
right: 0.67em;
top: 0.67em;
color: var(--primary-medium);
font-size: var(--font-0);
.d-icon {
color: currentColor;
font-size: var(--font-up-1);
margin-left: 0.25em;
margin: 0 0 0 0.25em;
}
&:hover {
opacity: 1;
.discourse-no-touch & {
&:active,
&:focus {
background: transparent;
.d-icon {
color: var(--primary);
}
}
}
}

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

@ -2353,7 +2353,7 @@ en:
drafts_offline: "drafts offline"
edit_conflict: "edit conflict"
esc: "esc"
esc_label: "Click or press Esc to dismiss"
esc_label: "dismiss message"
ok_proceed: "Ok, proceed"
group_mentioned_limit: