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 (#985)

This commit is contained in:
Robert Kaussow 2025-03-01 23:00:36 +01:00 committed by GitHub
parent 3d695d85a0
commit b6d6abe239
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 35 additions and 1 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> </head>
<body itemscope itemtype="https://schema.org/WebPage"> <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" . }} {{ partial "svg-icon-symbols" . }}

1
layouts/_default/list.html
View File

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

1
layouts/_default/single.html
View File

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

2
layouts/_default/taxonomy.html
View File

@ -1,4 +1,5 @@
{{ define "main" }} {{ define "main" }}
<div id="main-content" tabindex="-1">
{{ range .Paginator.Pages }} {{ range .Paginator.Pages }}
<article class="gdoc-post"> <article class="gdoc-post">
<header class="gdoc-post__header"> <header class="gdoc-post__header">
@ -31,6 +32,7 @@
</footer> </footer>
</article> </article>
{{ end }} {{ end }}
</div>
{{ partial "pagination.html" . }} {{ partial "pagination.html" . }}
{{ end }} {{ end }}

2
layouts/_default/terms.html
View File

@ -1,4 +1,5 @@
{{ define "main" }} {{ define "main" }}
<div id="main-content" tabindex="-1">
{{ range .Paginator.Pages.ByTitle }} {{ range .Paginator.Pages.ByTitle }}
<article class="gdoc-post"> <article class="gdoc-post">
<header class="gdoc-post__header"> <header class="gdoc-post__header">
@ -28,5 +29,6 @@
</footer> </footer>
</article> </article>
{{ end }} {{ end }}
</div>
{{ partial "pagination.html" . }} {{ partial "pagination.html" . }}
{{ end }} {{ end }}

2
layouts/posts/list.html
View File

@ -1,4 +1,5 @@
{{ define "main" }} {{ define "main" }}
<div id="main-content" tabindex="-1">
{{ range .Paginator.Pages }} {{ range .Paginator.Pages }}
<article class="gdoc-markdown gdoc-post"> <article class="gdoc-markdown gdoc-post">
<header class="gdoc-post__header"> <header class="gdoc-post__header">
@ -29,6 +30,7 @@
</footer> </footer>
</article> </article>
{{ end }} {{ end }}
</div>
{{ partial "pagination.html" . }} {{ partial "pagination.html" . }}
{{ end }} {{ end }}

2
layouts/posts/single.html
View File

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

4
src/sass/_utils.scss
View File

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