kyfx
/
hugo-geekdoc
mirror of https://github.com/thegeeklab/hugo-geekdoc.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: add skip-to-content link to improve accessability

This commit is contained in:
Robert Kaussow 2025-03-01 22:10:57 +01:00
parent 3d695d85a0
commit ad5afb0f7d
No known key found for this signature in database
GPG Key ID: 4E692A2EAECC03C0
9 changed files with 32 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
layouts/_default/baseof.html
View File

@ -22,6 +22,10 @@
</head>
<body itemscope itemtype="https://schema.org/WebPage">
<div class="w-full flex justify-center">
<a href="#main-content" id="gdoc-to-main" class="gdoc-markdown__link">Skip to main content</a>
</div>
{{ partial "svg-icon-symbols" . }}

1
layouts/_default/list.html
View File

@ -4,6 +4,7 @@
<article
class="gdoc-markdown gdoc-markdown__align--{{ default "left" (.Page.Params.geekdocAlign | lower) }}"
id="main-content" tabindex="-1"
>
<h1>{{ partial "utils/title" . }}</h1>
{{ partial "utils/content" . }}

1
layouts/_default/single.html
View File

@ -4,6 +4,7 @@
<article
class="gdoc-markdown gdoc-markdown__align--{{ default "left" (.Page.Params.geekdocAlign | lower) }}"
id="main-content" tabindex="-1"
>
<h1>{{ partial "utils/title" . }}</h1>
{{ partial "page-metadata" . }}

2
layouts/_default/taxonomy.html
View File

@ -1,6 +1,6 @@
{{ define "main" }}
{{ range .Paginator.Pages }}
<article class="gdoc-post">
<article class="gdoc-post" id="main-content" tabindex="-1">
<header class="gdoc-post__header">
<h1 class="gdoc-post__title">
<a href="{{ .RelPermalink }}">{{ partial "utils/title" . }}</a>

2
layouts/_default/terms.html
View File

@ -1,6 +1,6 @@
{{ define "main" }}
{{ range .Paginator.Pages.ByTitle }}
<article class="gdoc-post">
<article class="gdoc-post" id="main-content" tabindex="-1">
<header class="gdoc-post__header">
<h1 class="gdoc-post__title">
<a href="{{ .RelPermalink }}">{{ partial "utils/title" . }}</a>

2
layouts/posts/list.html
View File

@ -1,6 +1,6 @@
{{ define "main" }}
{{ range .Paginator.Pages }}
<article class="gdoc-markdown gdoc-post">
<article class="gdoc-markdown gdoc-post" id="main-content" tabindex="-1">
<header class="gdoc-post__header">
<h1 class="gdoc-post__title">
<a href="{{ .RelPermalink }}">{{ partial "utils/title" . }}</a>

2
layouts/posts/single.html
View File

@ -1,5 +1,5 @@
{{ define "main" }}
<article class="gdoc-post">
<article class="gdoc-post" id="main-content" tabindex="-1">
<header class="gdoc-post__header">
<h1 class="gdoc-post__title">{{ partial "utils/title" . }}</h1>
<div class="flex flex-wrap align-center gdoc-post__meta gdoc-post__meta--head">

18
src/sass/_base.scss
View File

@ -105,6 +105,24 @@ body {
* {
box-sizing: inherit;
}
#gdoc-to-main {
position: absolute;
margin: defaults.$padding-8 0;
padding: defaults.$padding-8;
display: inline-block;
background-color: var(--accent-color-lite);
border-radius: defaults.$border-radius;
border: defaults.$border-1 solid var(--accent-color);
transform: translateY(0);
transition: transform 250ms ease-in;
&:not(:focus) {
transform: translateY(-#{defaults.$padding-64});
}
}
}
h1,

4
src/sass/_utils.scss
View File

@ -101,3 +101,7 @@
display: inline-block;
min-width: 4rem;
}
.w-full {
width: 100%;
}