consul/nairobi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add a link to skip to the main content

Browse Source 
While people using screen readers already have keyboard shortcuts to
jump to the <main> tag, there are people who navigate the page with the
keyboard using just the tab key, and for them, this link provides a way
to save time and start reading the main content instead of having to
manually go through all the navigation links every time a new page is
loaded.

Note that we had to add an additional `width: 0` rule because
Foundation's `element-invisible` would apply `1px` and the test checking
for `visible: :hidden` would faile.
This commit is contained in:
Javi Martín
2023-09-29 22:30:34 +02:00
parent 2b962f2789
commit 45c1f93562
16 changed files with 61 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/views/layouts/application.html.erb
View File

@@ -13,12 +13,13 @@
<%= raw setting["html.per_page_code_head"] %>
</head>
<body class="<%= yield(:body_class) %> public">
<%= render Layout::SkipToMainContentComponent.new %>
<%= raw setting["html.per_page_code_body"] %>
<div class="wrapper <%= yield(:wrapper_class) %>">
<%= render "layouts/header", with_subnavigation: true %>
<main class="public-content <%= yield(:main_class) %>">
<main id="main" class="public-content <%= yield(:main_class) %>">
<%= render "layouts/flash" %>
<%= yield %>
</main>