Add alternative text to controls to allow screen readers to read them aloud (#1840)

Add alternative text to controls to allow screen readers to read them aloud.

Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>
This commit is contained in:
Florian Scholdei
2021-11-03 10:11:40 +01:00
committed by GitHub
parent b78742ed0b
commit b896df5046
49 changed files with 1274 additions and 553 deletions

View File

@@ -93,7 +93,7 @@ const Contributors: FC<{ changeset: Changeset }> = ({ changeset }) => {
<div className="is-flex is-flex-direction-column mb-4">
<div className="is-flex">
<p className="is-ellipsis-overflow is-clickable mb-2" onClick={(e) => setOpen(!open)}>
<Icon name="angle-down" /> {t("changeset.contributors.list")}
<Icon name="angle-down" alt={t("changeset.contributors.hideList")} /> {t("changeset.contributors.list")}
</p>
{signatureIcon}
</div>
@@ -106,7 +106,8 @@ const Contributors: FC<{ changeset: Changeset }> = ({ changeset }) => {
<>
<div className="is-flex is-clickable" onClick={(e) => setOpen(!open)}>
<ContributorColumn className="is-ellipsis-overflow">
<Icon name="angle-right" /> <ChangesetAuthor changeset={changeset} />
<Icon name="angle-right" alt={t("changeset.contributors.showList")} />{" "}
<ChangesetAuthor changeset={changeset} />
</ContributorColumn>
{signatureIcon}
<CountColumn className="is-hidden-mobile is-hidden-tablet-only is-hidden-desktop-only">
@@ -229,6 +230,7 @@ const ChangesetDetails: FC<Props> = ({ changeset, repository, fileControlFactory
color="default"
icon={collapsed ? "eye" : "eye-slash"}
label={t("changesets.collapseDiffs")}
title={t("changesets.collapseDiffs")}
reducedMobile={true}
/>
}