A11Y: Add "skip to main content" link (#14190)

This commit is contained in:
Penar Musaraj 2021-08-31 13:43:30 -04:00 committed by GitHub
parent 94085d0996
commit 8f06528bb2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 18 additions and 1 deletions

View File

@ -1,4 +1,5 @@
{{#discourse-root}}
<a href="#main-container" id="skip-link">{{i18n "skip_to_main_content"}}</a>
{{d-document}}
{{plugin-outlet name="above-site-header" tagName=""}}
{{site-header canSignUp=canSignUp
@ -14,7 +15,7 @@
<div id="main-outlet" class="wrap" role="main">
{{plugin-outlet name="above-main-container" tagName=""}}
<div class="container">
<div class="container" id="main-container">
{{#if showTop}}
{{custom-html name="top"}}
{{/if}}

View File

@ -880,3 +880,18 @@ table {
}
}
}
a#skip-link {
padding: 0.25em 0.5em;
position: absolute;
top: -40px;
left: 1em;
color: var(--secondary);
background: var(--tertiary);
transition: top 0.3s ease-out;
z-index: z("header") + 1;
&:focus {
top: 0px;
transition: top 0.15s ease-in;
}
}

View File

@ -175,6 +175,7 @@ en:
forwarded: "forwarded the above email"
topic_admin_menu: "topic actions"
skip_to_main_content: "Skip to main content"
wizard_required: "Welcome to your new Discourse! Lets get started with <a href='%{url}' data-auto-route='true'>the setup wizard</a> ✨"
emails_are_disabled: "All outgoing email has been globally disabled by an administrator. No email notifications of any kind will be sent."