From 2c507a474dcf8ca9257d2375a8a696950b31363b Mon Sep 17 00:00:00 2001 From: Dessalines Date: Tue, 9 Feb 2021 11:21:24 -0500 Subject: [PATCH] Adding more aria labels based on tota11y recs. #170 --- src/shared/components/comment-node.tsx | 69 +++++++++++++++++++-- src/shared/components/communities.tsx | 4 ++ src/shared/components/community.tsx | 2 +- src/shared/components/inbox.tsx | 2 +- src/shared/components/main.tsx | 2 +- src/shared/components/markdown-textarea.tsx | 6 ++ src/shared/components/navbar.tsx | 19 +++++- src/shared/components/post-form.tsx | 4 +- src/shared/components/post-listing.tsx | 65 +++++++++++++++++-- src/shared/components/search.tsx | 6 +- src/shared/components/user.tsx | 2 +- 11 files changed, 159 insertions(+), 22 deletions(-) diff --git a/src/shared/components/comment-node.tsx b/src/shared/components/comment-node.tsx index bf57a59..33e719e 100644 --- a/src/shared/components/comment-node.tsx +++ b/src/shared/components/comment-node.tsx @@ -204,7 +204,14 @@ export class CommentNode extends Component { onClick={linkEvent(node, this.handleCommentUpvote)} data-tippy-content={this.pointsTippy} > - {this.state.score} + + {this.state.score} + • @@ -424,6 +431,7 @@ export class CommentNode extends Component { this, this.handleModRemoveShow )} + aria-label={i18n.t('remove')} > {i18n.t('remove')} @@ -434,6 +442,7 @@ export class CommentNode extends Component { this, this.handleModRemoveSubmit )} + aria-label={i18n.t('restore')} > {i18n.t('restore')} @@ -451,6 +460,7 @@ export class CommentNode extends Component { this, this.handleModBanFromCommunityShow )} + aria-label={i18n.t('ban')} > {i18n.t('ban')} @@ -461,6 +471,7 @@ export class CommentNode extends Component { this, this.handleModBanFromCommunitySubmit )} + aria-label={i18n.t('unban')} > {i18n.t('unban')} @@ -474,6 +485,11 @@ export class CommentNode extends Component { this, this.handleShowConfirmAppointAsMod )} + aria-label={ + this.isMod + ? i18n.t('remove_as_mod') + : i18n.t('appoint_as_mod') + } > {this.isMod ? i18n.t('remove_as_mod') @@ -481,7 +497,10 @@ export class CommentNode extends Component { ) : ( <> - @@ -499,6 +519,7 @@ export class CommentNode extends Component { this, this.handleCancelConfirmAppointAsMod )} + aria-label={i18n.t('no')} > {i18n.t('no')} @@ -517,12 +538,16 @@ export class CommentNode extends Component { this, this.handleShowConfirmTransferCommunity )} + aria-label={i18n.t('transfer_community')} > {i18n.t('transfer_community')} ) : ( <> - @@ -541,6 +567,7 @@ export class CommentNode extends Component { this .handleCancelShowConfirmTransferCommunity )} + aria-label={i18n.t('no')} > {i18n.t('no')} @@ -557,6 +584,7 @@ export class CommentNode extends Component { this, this.handleModBanShow )} + aria-label={i18n.t('ban_from_site')} > {i18n.t('ban_from_site')} @@ -567,6 +595,7 @@ export class CommentNode extends Component { this, this.handleModBanSubmit )} + aria-label={i18n.t('unban_from_site')} > {i18n.t('unban_from_site')} @@ -580,6 +609,11 @@ export class CommentNode extends Component { this, this.handleShowConfirmAppointAsAdmin )} + aria-label={ + this.isAdmin + ? i18n.t('remove_as_admin') + : i18n.t('appoint_as_admin') + } > {this.isAdmin ? i18n.t('remove_as_admin') @@ -596,6 +630,7 @@ export class CommentNode extends Component { this, this.handleAddAdmin )} + aria-label={i18n.t('yes')} > {i18n.t('yes')} @@ -605,6 +640,7 @@ export class CommentNode extends Component { this, this.handleCancelConfirmAppointAsAdmin )} + aria-label={i18n.t('no')} > {i18n.t('no')} @@ -623,12 +659,16 @@ export class CommentNode extends Component { this, this.handleShowConfirmTransferSite )} + aria-label={i18n.t('transfer_site')} > {i18n.t('transfer_site')} ) : ( <> - @@ -646,6 +687,7 @@ export class CommentNode extends Component { this, this.handleCancelShowConfirmTransferSite )} + aria-label={i18n.t('no')} > {i18n.t('no')} @@ -667,14 +709,25 @@ export class CommentNode extends Component { class="form-inline" onSubmit={linkEvent(this, this.handleModRemoveSubmit)} > + - @@ -717,7 +770,11 @@ export class CommentNode extends Component { {/* */} {/* */}
-
diff --git a/src/shared/components/communities.tsx b/src/shared/components/communities.tsx index e90c09d..62814b7 100644 --- a/src/shared/components/communities.tsx +++ b/src/shared/components/communities.tsx @@ -199,6 +199,7 @@ export class Communities extends Component { > { required minLength={3} /> + diff --git a/src/shared/components/community.tsx b/src/shared/components/community.tsx index 86ac243..c16b143 100644 --- a/src/shared/components/community.tsx +++ b/src/shared/components/community.tsx @@ -351,7 +351,7 @@ export class Community extends Component { rel="noopener" > - # + diff --git a/src/shared/components/inbox.tsx b/src/shared/components/inbox.tsx index ab0c312..e9f52e1 100644 --- a/src/shared/components/inbox.tsx +++ b/src/shared/components/inbox.tsx @@ -158,7 +158,7 @@ export class Inbox extends Component { rel="noopener" > - # + diff --git a/src/shared/components/main.tsx b/src/shared/components/main.tsx index 2d4b7d7..de7bc4f 100644 --- a/src/shared/components/main.tsx +++ b/src/shared/components/main.tsx @@ -602,7 +602,7 @@ export class Main extends Component { title="RSS" > - # + )} diff --git a/src/shared/components/markdown-textarea.tsx b/src/shared/components/markdown-textarea.tsx index cffc432..fe34b20 100644 --- a/src/shared/components/markdown-textarea.tsx +++ b/src/shared/components/markdown-textarea.tsx @@ -138,6 +138,9 @@ export class MarkdownTextArea extends Component< /> )} +
@@ -180,6 +183,7 @@ export class MarkdownTextArea extends Component<
- +
{ class="btn btn-link btn-animate text-muted py-0" onClick={linkEvent(this, this.handleEditClick)} data-tippy-content={i18n.t('edit')} + aria-label={i18n.t('edit')} > @@ -692,6 +693,9 @@ export class PostListing extends Component { data-tippy-content={ !post_view.post.deleted ? i18n.t('delete') : i18n.t('restore') } + aria-label={ + !post_view.post.deleted ? i18n.t('delete') : i18n.t('restore') + } > { class="btn btn-link btn-animate text-muted py-0" onClick={linkEvent(this, this.handleViewSource)} data-tippy-content={i18n.t('view_source')} + aria-label={i18n.t('view_source')} > { data-tippy-content={ post_view.post.locked ? i18n.t('unlock') : i18n.t('lock') } + aria-label={ + post_view.post.locked ? i18n.t('unlock') : i18n.t('lock') + } > { ? i18n.t('unsticky') : i18n.t('sticky') } + aria-label={ + post_view.post.stickied + ? i18n.t('unsticky') + : i18n.t('sticky') + } > { @@ -781,6 +795,7 @@ export class PostListing extends Component { @@ -795,6 +810,7 @@ export class PostListing extends Component { this, this.handleModBanFromCommunityShow )} + aria-label={i18n.t('ban')} > {i18n.t('ban')} @@ -805,6 +821,7 @@ export class PostListing extends Component { this, this.handleModBanFromCommunitySubmit )} + aria-label={i18n.t('unban')} > {i18n.t('unban')} @@ -814,6 +831,11 @@ export class PostListing extends Component { ) : ( <> -
-
*/}
-
diff --git a/src/shared/components/search.tsx b/src/shared/components/search.tsx index 1b61e3b..448b517 100644 --- a/src/shared/components/search.tsx +++ b/src/shared/components/search.tsx @@ -214,7 +214,11 @@ export class Search extends Component { required minLength={3} /> -
-- 2.44.1