Add visually hidden "Skip to content" link to pages

develop
Nathan Steel 3 years ago
parent 7d19bf6092
commit 8793536515

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Error 404</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>About me</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Blog Thoughts</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Hello, Burger menu!</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney's Blog</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>I've started a blog</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>My SteamDeck Arrived!</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Reducing my Homelab</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney's CV</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney's Hardware</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Link your domain name to your server</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Adding PHP to NGINX server</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Adminer Setup</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Backup MySQL/MariaDB</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Automating Backups with Cronjobs</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Backup with rdiff-backup</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Backup with rsync</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Setup SSL with Certbot</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Get a domain name</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney' guide to server hosting</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney's Guides</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Initial Server Setup</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Template for Blog</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>MySQL (actually MariaDB) Setup Guide</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>How to install an NGINX web server</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Template for Blog</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>NGINX web optimisation</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Template for Blog</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Debian Install Guide for Servers</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>How to set a static IP</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Git server setup</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Setup a bridge network for KVM</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>How to setup an NGINX website</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Setup KVM/QEMU virtualisation</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>SQL Cheatsheet</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Virsh Cheatsheet</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>VM/Server Seperation of Concerns</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Web Development 101</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Webpage to website</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Your first webpage</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney's Network</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney's Projects</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney's Recipes</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Woky Beef Stew</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney's Sitemap</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -14,6 +14,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Support Me</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

@ -15,6 +15,7 @@
<body>
<header>
<a href="#main" class="vh">Jump directly to main content</a>
<h1>Aney's Favourite Sites</h1>
<input id="burger-toggle" type="checkbox"/>
<label class="burger-container" for="burger-toggle"><div class="burger"></div><span class="sr">Burger menu</span></label>

Loading…
Cancel
Save