Update index.html

Author: simonvreeman

meditations/index.html

@@ -199,6 +199,21 @@
   animation: progress linear;
   animation-timeline: scroll();
 }
+.skip-to-main-content-link {
+  position: absolute;
+  left: -9999px;
+  z-index: 999;
+  padding: 1em;
+  background-color: black;
+  color: white;
+  opacity: 0;
+}
+.skip-to-main-content-link:focus {
+  left: 50%;
+  transform: translateX(-50%);
+  color: white;
+  opacity: 1;
+}
 @keyframes progress {
   from { transform: scaleX(0); }
 }
@@ -1187,6 +1202,7 @@
     <noscript><iframe src="https://gtm.vreeman.com/ns.html?id=GTM-WKSDWK" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
     <div id="progress" role="progressbar" aria-label="progress"></div>
     <header id="header">
+      <a href="#introduction" class="skip-to-main-content-link">Skip to main content</a>
       <h1>Meditations &middot; <em><abbr title="Things to one's self">Ta eis heauton</abbr></em> &middot; by Marcus Aurelius</h1>
       <h2>A new translation, with an introduction, by Gregory Hays</h2>
     </header>