mirror of https://github.com/miniflux/v2.git
add skip to content link
This commit is contained in:
parent
b568b1d41d
commit
f23e6a3352
|
@ -60,6 +60,10 @@
|
||||||
{{ if .user }}{{ if not .user.KeyboardShortcuts }}data-disable-keyboard-shortcuts="true"{{ end }}{{ end }}>
|
{{ if .user }}{{ if not .user.KeyboardShortcuts }}data-disable-keyboard-shortcuts="true"{{ end }}{{ end }}>
|
||||||
|
|
||||||
{{ if .user }}
|
{{ if .user }}
|
||||||
|
|
||||||
|
<a class="skip-to-content-link" href="#main">
|
||||||
|
Skip to content
|
||||||
|
</a>
|
||||||
<header class="header">
|
<header class="header">
|
||||||
<nav>
|
<nav>
|
||||||
<div class="logo">
|
<div class="logo">
|
||||||
|
@ -118,7 +122,7 @@
|
||||||
{{ if .flashErrorMessage }}
|
{{ if .flashErrorMessage }}
|
||||||
<div class="flash-error-message alert alert-error">{{ .flashErrorMessage }}</div>
|
<div class="flash-error-message alert alert-error">{{ .flashErrorMessage }}</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
<main>
|
<main id="main">
|
||||||
{{template "content" .}}
|
{{template "content" .}}
|
||||||
</main>
|
</main>
|
||||||
<template id="keyboard-shortcuts">
|
<template id="keyboard-shortcuts">
|
||||||
|
|
|
@ -64,6 +64,25 @@ a:hover {
|
||||||
white-space: nowrap !important;
|
white-space: nowrap !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.skip-to-content-link {
|
||||||
|
--padding-size: 8px;
|
||||||
|
--border-size: 1px;
|
||||||
|
|
||||||
|
background-color: var(--category-background-color);
|
||||||
|
color: var(--category-color);
|
||||||
|
border: var(--border-size) solid var(--category-border-color);
|
||||||
|
border-radius: 5px;
|
||||||
|
inset-inline-start: 50%;
|
||||||
|
padding: var(--padding-size);
|
||||||
|
position: absolute;
|
||||||
|
transition: translate 0.3s;
|
||||||
|
translate: -50% calc(-100% - calc(var(--padding-size) * 2) - calc(var(--border-size) * 2));
|
||||||
|
}
|
||||||
|
|
||||||
|
.skip-to-content-link:focus {
|
||||||
|
translate: -50% 0;
|
||||||
|
}
|
||||||
|
|
||||||
/* Header and main menu */
|
/* Header and main menu */
|
||||||
.header {
|
.header {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
|
|
Loading…
Reference in New Issue