Skip to content

Commit

Permalink
Update the accessibility label of icons. (#7255)
Browse files Browse the repository at this point in the history
* Update the accessibility label of icons.

* recently created package
  • Loading branch information
isoos authored Dec 7, 2023
1 parent 06db9bd commit 3d56dd9
Show file tree
Hide file tree
Showing 55 changed files with 309 additions and 304 deletions.
2 changes: 1 addition & 1 deletion app/lib/frontend/templates/views/pkg/index.dart
Original file line number Diff line number Diff line change
Expand Up @@ -272,7 +272,7 @@ d.Node _filterSection({
image: d.Image(
src: staticUrls
.getAssetUrl('/static/img/search-form-foldable-icon.svg'),
alt: 'fold toggle icon (up/down arrow)',
alt: 'fold toggle (up/down arrow)',
width: 13,
height: 6,
),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ d.Node likedPackageListNode(List<LikeData> likes) {
},
icon: d.Image(
src: thumbUpFilledUrl,
alt: 'thumb up icon',
alt: 'thumb up',
width: 24,
height: 24,
),
Expand Down
4 changes: 2 additions & 2 deletions app/lib/frontend/templates/views/pkg/package_list.dart
Original file line number Diff line number Diff line change
Expand Up @@ -228,11 +228,11 @@ d.Node _item({
image: d.Image(
src:
staticUrls.getAssetUrl('/static/img/schedule-icon.svg'),
alt: 'icon indicating recent time',
alt: 'recently created package',
width: 10,
height: 10,
),
title: 'new package',
title: 'recently created package',
),
d.text(' Added '),
d.b(text: formatXAgo(age)),
Expand Down
8 changes: 7 additions & 1 deletion app/lib/frontend/templates/views/pkg/score_tab.dart
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@ d.Node _section(ReportSection section) {
classes: ['pkg-report-icon'],
image: d.Image(
src: _statusIconUrls[section.status]!,
alt: 'icon indicating section status',
alt: _statusIconAlts[section.status]!,
width: 18,
height: 18,
),
Expand Down Expand Up @@ -176,6 +176,12 @@ final _statusIconUrls = {
staticUrls.getAssetUrl('/static/img/report-missing-icon-red.svg'),
};

final _statusIconAlts = {
ReportStatus.passed: 'OK',
ReportStatus.partial: 'partial',
ReportStatus.failed: 'failed',
};

String _updatedSummary(String summary) {
return summary.split('\n').map((line) {
if (!line.startsWith('### ')) return line;
Expand Down
2 changes: 1 addition & 1 deletion app/lib/frontend/templates/views/pkg/title_content.dart
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ d.Node titleContentNode({
},
image: d.Image(
src: staticUrls.getAssetUrl('/static/img/content-copy-icon.svg'),
alt: 'icon indicating copy to clipboard operation',
alt: 'copy "$package: ^$version" to clipboard',
width: 18,
height: 18,
),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,14 +22,14 @@ d.Node publisherHeaderMetadataNode(Publisher publisher) {
href: websiteUri.toString(),
rel: websiteRel,
label: websiteDisplayable!,
iconAlt: 'icon indicating a website link',
iconAlt: 'link to website',
),
if (publisher.hasContactEmail)
_ref(
href: 'mailto:${publisher.contactEmail}',
label: publisher.contactEmail!,
iconPath: '/static/img/email-icon.svg',
iconAlt: 'icon indicating an email',
iconAlt: 'contact email',
),
]),
d.p(
Expand Down
4 changes: 2 additions & 2 deletions app/lib/frontend/templates/views/shared/detail/header.dart
Original file line number Diff line number Diff line change
Expand Up @@ -96,14 +96,14 @@ d.Node detailHeaderNode({
onIcon: d.Image(
src: staticUrls
.getAssetUrl('/static/img/like-active.svg'),
alt: 'icon indicating liked status (active)',
alt: 'liked status: active',
width: 18,
height: 18,
),
offIcon: d.Image(
src: staticUrls.getAssetUrl(
'/static/img/like-inactive.svg'),
alt: 'icon indicating liked status (inactive)',
alt: 'liked status: inactive',
width: 18,
height: 18,
),
Expand Down
5 changes: 2 additions & 3 deletions app/lib/frontend/templates/views/shared/images.dart
Original file line number Diff line number Diff line change
Expand Up @@ -9,17 +9,16 @@ import '../../../static_files.dart';
d.Image verifiedPublisherIconImage() {
return d.Image(
src: staticUrls.getAssetUrl('/static/img/material-icon-verified.svg'),
alt: 'verified publisher icon',
alt: 'verified publisher',
width: 14,
height: 14,
);
}

/// Returns the image object for license icon.
d.Image licenseIconImage() {
return d.Image(
return d.Image.decorative(
src: staticUrls.getAssetUrl('/static/img/material-icon-balance.svg'),
alt: 'Icon for licenses.',
width: 14,
height: 14,
);
Expand Down
4 changes: 2 additions & 2 deletions app/lib/frontend/templates/views/shared/layout.dart
Original file line number Diff line number Diff line change
Expand Up @@ -275,7 +275,7 @@ d.Node _siteFooterNode() {
['sep'],
d.Image(
src: staticUrls.getAssetUrl('/static/img/rss-feed-icon.svg'),
alt: 'RSS icon',
alt: 'RSS',
width: 20,
height: 20,
),
Expand All @@ -286,7 +286,7 @@ d.Node _siteFooterNode() {
['github_issue'],
d.Image(
src: staticUrls.getAssetUrl('/static/img/bug-report-white-96px.png'),
alt: 'bug report icon',
alt: 'bug report',
width: 20,
height: 20,
),
Expand Down
4 changes: 2 additions & 2 deletions app/test/frontend/golden/authorized_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -122,10 +122,10 @@ <h1>Pub Authorized Successfully</h1>
<a class="link sep" href="https://www.google.com/intl/en/policies/privacy/">Privacy</a>
<a class="link sep" href="/help">Help</a>
<a class="link icon sep" href="/feed.atom">
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS icon" width="20" height="20" title="RSS/atom feed"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS" width="20" height="20" title="RSS/atom feed"/>
</a>
<a class="link icon github_issue" href="https://github.com/dart-lang/pub-dev/issues/new">
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report icon" width="20" height="20" title="Report an issue with this site"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report" width="20" height="20" title="Report an issue with this site"/>
</a>
</footer>
<script src="/static/hash-%%etag%%/highlight/highlight-with-init.js" defer="defer"></script>
Expand Down
4 changes: 2 additions & 2 deletions app/test/frontend/golden/consent_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -125,10 +125,10 @@ <h1 id="-admin-consent-title">Invite for something</h1>
<a class="link sep" href="https://www.google.com/intl/en/policies/privacy/">Privacy</a>
<a class="link sep" href="/help">Help</a>
<a class="link icon sep" href="/feed.atom">
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS icon" width="20" height="20" title="RSS/atom feed"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS" width="20" height="20" title="RSS/atom feed"/>
</a>
<a class="link icon github_issue" href="https://github.com/dart-lang/pub-dev/issues/new">
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report icon" width="20" height="20" title="Report an issue with this site"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report" width="20" height="20" title="Report an issue with this site"/>
</a>
</footer>
</body>
Expand Down
4 changes: 2 additions & 2 deletions app/test/frontend/golden/create_publisher_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -189,10 +189,10 @@ <h2>Create a verified publisher</h2>
<a class="link sep" href="https://www.google.com/intl/en/policies/privacy/">Privacy</a>
<a class="link sep" href="/help">Help</a>
<a class="link icon sep" href="/feed.atom">
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS icon" width="20" height="20" title="RSS/atom feed"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS" width="20" height="20" title="RSS/atom feed"/>
</a>
<a class="link icon github_issue" href="https://github.com/dart-lang/pub-dev/issues/new">
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report icon" width="20" height="20" title="Report an issue with this site"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report" width="20" height="20" title="Report an issue with this site"/>
</a>
</footer>
</body>
Expand Down
4 changes: 2 additions & 2 deletions app/test/frontend/golden/error_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -120,10 +120,10 @@ <h2>error_title</h2>
<a class="link sep" href="https://www.google.com/intl/en/policies/privacy/">Privacy</a>
<a class="link sep" href="/help">Help</a>
<a class="link icon sep" href="/feed.atom">
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS icon" width="20" height="20" title="RSS/atom feed"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS" width="20" height="20" title="RSS/atom feed"/>
</a>
<a class="link icon github_issue" href="https://github.com/dart-lang/pub-dev/issues/new">
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report icon" width="20" height="20" title="Report an issue with this site"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report" width="20" height="20" title="Report an issue with this site"/>
</a>
</footer>
</body>
Expand Down
4 changes: 2 additions & 2 deletions app/test/frontend/golden/help_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -157,10 +157,10 @@ <h1 class="hash-header" id="help">
<a class="link sep" href="https://www.google.com/intl/en/policies/privacy/">Privacy</a>
<a class="link sep" href="/help">Help</a>
<a class="link icon sep" href="/feed.atom">
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS icon" width="20" height="20" title="RSS/atom feed"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS" width="20" height="20" title="RSS/atom feed"/>
</a>
<a class="link icon github_issue" href="https://github.com/dart-lang/pub-dev/issues/new">
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report icon" width="20" height="20" title="Report an issue with this site"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report" width="20" height="20" title="Report an issue with this site"/>
</a>
</footer>
</body>
Expand Down
6 changes: 3 additions & 3 deletions app/test/frontend/golden/landing_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -159,7 +159,7 @@ <h3>neon</h3>
</div>
<div class="mini-list-item-footer">
<div class="mini-list-item-publisher">
<img class="publisher-badge" src="/static/hash-%%etag%%/img/material-icon-verified.svg" alt="verified publisher icon" width="14" height="14" title="Published by a pub.dev verified publisher"/>
<img class="publisher-badge" src="/static/hash-%%etag%%/img/material-icon-verified.svg" alt="verified publisher" width="14" height="14" title="Published by a pub.dev verified publisher"/>
<a class="publisher-link" href="/publishers/example.com" data-ga-click-event="landing-most-popular-card-publisher">example.com</a>
</div>
</div>
Expand Down Expand Up @@ -209,10 +209,10 @@ <h1 class="home-block-title">Package of the Week</h1>
<a class="link sep" href="https://www.google.com/intl/en/policies/privacy/">Privacy</a>
<a class="link sep" href="/help">Help</a>
<a class="link icon sep" href="/feed.atom">
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS icon" width="20" height="20" title="RSS/atom feed"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS" width="20" height="20" title="RSS/atom feed"/>
</a>
<a class="link icon github_issue" href="https://github.com/dart-lang/pub-dev/issues/new">
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report icon" width="20" height="20" title="Report an issue with this site"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report" width="20" height="20" title="Report an issue with this site"/>
</a>
</footer>
<script type="application/ld+json">{"@context":"http\u003a\u002f\u002fschema.org","@type":"WebSite","url":"https\u003a\u002f\u002fpub.dev\u002f","potentialAction":{"@type":"SearchAction","target":"https\u003a\u002f\u002fpub.dev\u002fpackages\u003fq\u003d\u007bsearch\u005fterm\u005fstring\u007d","query-input":"required name\u003dsearch\u005fterm\u005fstring"}}</script>
Expand Down
4 changes: 2 additions & 2 deletions app/test/frontend/golden/my_activity_log_page.html
Original file line number Diff line number Diff line change
Expand Up @@ -341,10 +341,10 @@ <h1 class="title">admin</h1>
<a class="link sep" href="https://www.google.com/intl/en/policies/privacy/">Privacy</a>
<a class="link sep" href="/help">Help</a>
<a class="link icon sep" href="/feed.atom">
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS icon" width="20" height="20" title="RSS/atom feed"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS" width="20" height="20" title="RSS/atom feed"/>
</a>
<a class="link icon github_issue" href="https://github.com/dart-lang/pub-dev/issues/new">
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report icon" width="20" height="20" title="Report an issue with this site"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report" width="20" height="20" title="Report an issue with this site"/>
</a>
</footer>
</body>
Expand Down
8 changes: 4 additions & 4 deletions app/test/frontend/golden/my_liked_packages.html
Original file line number Diff line number Diff line change
Expand Up @@ -184,7 +184,7 @@ <h3 class="packages-title">
<div class="packages-icons">
<button class="mdc-button mdc-button--unelevated -pub-like-button" data-mdc-auto-init="MDCRipple" data-package="super_package" data-thumb_up_outlined="/static/hash-%%etag%%/img/thumb-up-24px.svg" data-thumb_up_filled="/static/hash-%%etag%%/img/thumb-up-filled-24px.svg">
<div class="mdc-button__ripple"></div>
<img class="mdc-button__icon -pub-like-button-img" src="/static/hash-%%etag%%/img/thumb-up-filled-24px.svg" alt="thumb up icon" width="24" height="24" aria-hidden="true"/>
<img class="mdc-button__icon -pub-like-button-img" src="/static/hash-%%etag%%/img/thumb-up-filled-24px.svg" alt="thumb up" width="24" height="24" aria-hidden="true"/>
<span class="mdc-button__label -pub-like-button-label">Unlike</span>
</button>
</div>
Expand All @@ -202,7 +202,7 @@ <h3 class="packages-title">
<div class="packages-icons">
<button class="mdc-button mdc-button--unelevated -pub-like-button" data-mdc-auto-init="MDCRipple" data-package="another_package" data-thumb_up_outlined="/static/hash-%%etag%%/img/thumb-up-24px.svg" data-thumb_up_filled="/static/hash-%%etag%%/img/thumb-up-filled-24px.svg">
<div class="mdc-button__ripple"></div>
<img class="mdc-button__icon -pub-like-button-img" src="/static/hash-%%etag%%/img/thumb-up-filled-24px.svg" alt="thumb up icon" width="24" height="24" aria-hidden="true"/>
<img class="mdc-button__icon -pub-like-button-img" src="/static/hash-%%etag%%/img/thumb-up-filled-24px.svg" alt="thumb up" width="24" height="24" aria-hidden="true"/>
<span class="mdc-button__label -pub-like-button-label">Unlike</span>
</button>
</div>
Expand All @@ -229,10 +229,10 @@ <h3 class="packages-title">
<a class="link sep" href="https://www.google.com/intl/en/policies/privacy/">Privacy</a>
<a class="link sep" href="/help">Help</a>
<a class="link icon sep" href="/feed.atom">
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS icon" width="20" height="20" title="RSS/atom feed"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/rss-feed-icon.svg" alt="RSS" width="20" height="20" title="RSS/atom feed"/>
</a>
<a class="link icon github_issue" href="https://github.com/dart-lang/pub-dev/issues/new">
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report icon" width="20" height="20" title="Report an issue with this site"/>
<img class="inline-icon" src="/static/hash-%%etag%%/img/bug-report-white-96px.png" alt="bug report" width="20" height="20" title="Report an issue with this site"/>
</a>
</footer>
</body>
Expand Down
Loading

0 comments on commit 3d56dd9

Please sign in to comment.