A11Y: adds support for aria-current through d-navigation-item (#12079)

This commit is contained in:
Joffrey JAFFEUX 2021-02-15 15:34:25 +01:00 committed by GitHub
parent f71ff2c34b
commit c5d0a33cc5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 52 additions and 34 deletions

View File

@ -0,0 +1,17 @@
import Component from "@ember/component";
import { computed } from "@ember/object";
import { inject as service } from "@ember/service";
export default Component.extend({
tagName: "li",
route: null,
router: service(),
attributeBindings: ["ariaCurrent:aria-current", "title"],
ariaCurrent: computed("router.currentRouteName", "route", function () {
return this.router.currentRouteName === this.route ? "page" : null;
}),
});

View File

@ -0,0 +1,3 @@
{{#link-to route}}
{{yield}}
{{/link-to}}

View File

@ -1,44 +1,42 @@
{{#d-section pageClass="user-activity" class="user-secondary-navigation" scrollTop="false"}}
{{#mobile-nav class="activity-nav" desktopClass="action-list activity-list nav-stacked" currentPath=router._router.currentPath}}
<li>
{{#link-to "userActivity.index"}}{{i18n "user.filters.all"}}{{/link-to}}
</li>
<li>
{{#link-to "userActivity.topics"}}{{i18n "user_action_groups.4"}}{{/link-to}}
</li>
<li>
{{#link-to "userActivity.replies"}}{{i18n "user_action_groups.5"}}{{/link-to}}
</li>
{{#if user.showRead}}
<li>
{{#link-to "userActivity.read" title=(i18n "user.read_help")}}{{i18n "user.read"}}{{/link-to}}
</li>
{{/if}}
{{#if user.showDrafts}}
<li>
{{#link-to "userActivity.drafts"}}{{i18n "user_action_groups.15"}}{{/link-to}}
</li>
{{/if}}
<li>
{{#link-to "userActivity.likesGiven"}}{{i18n "user_action_groups.1"}}{{/link-to}}
</li>
{{#if user.showBookmarks}}
<li>
{{#link-to "userActivity.bookmarks"}}{{i18n "user_action_groups.3"}}{{/link-to}}
</li>
{{/if}}
{{plugin-outlet
name="user-activity-bottom"
connectorTagName="li"
args=(hash model=model)
}}
{{/mobile-nav}}
<nav role="navigation">
{{#mobile-nav class="activity-nav" desktopClass="action-list activity-list nav-stacked" currentPath=router._router.currentPath}}
{{#d-navigation-item route="userActivity.index"}}{{i18n "user.filters.all"}}{{/d-navigation-item}}
{{#d-navigation-item route="userActivity.topics"}}{{i18n "user_action_groups.4"}}{{/d-navigation-item}}
{{#d-navigation-item route="userActivity.replies"}}{{i18n "user_action_groups.5"}}{{/d-navigation-item}}
{{#if user.showRead}}
{{#d-navigation-item route="userActivity.read" title=(i18n "user.read_help")}}
{{i18n "user.read"}}
{{/d-navigation-item}}
{{/if}}
{{#if user.showDrafts}}
{{#d-navigation-item route="userActivity.drafts"}}
{{i18n "user_action_groups.15"}}
{{/d-navigation-item}}
{{/if}}
{{#d-navigation-item route="userActivity.likesGiven"}}{{i18n "user_action_groups.1"}}{{/d-navigation-item}}
{{#if user.showBookmarks}}
{{#d-navigation-item route="userActivity.bookmarks"}}{{i18n "user_action_groups.3"}}{{/d-navigation-item}}
{{/if}}
{{plugin-outlet
name="user-activity-bottom"
connectorTagName="li"
args=(hash model=model)
}}
{{/mobile-nav}}
</nav>
{{/d-section}}
{{#if canDownloadPosts}}
<section class="user-additional-controls">
{{d-button action=(action "exportUserArchive") class="btn-default" label="user.download_archive.button_text" icon="download"}}
</section>
{{/if}}
<section class="user-content">
{{outlet}}
</section>