summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorChristian Grothoff <grothoff@gnunet.org>2022-10-10 12:13:13 +0200
committerChristian Grothoff <grothoff@gnunet.org>2022-10-10 12:13:13 +0200
commit314ec1716a51cdeab1a4c005aa3909b77668b699 (patch)
treefd5e3175309f408c7b5ed98a33179097f6db949a
parentf252552c7560fd71171089c93221fd7f17a47694 (diff)
downloadtaler-merchant-demos-314ec1716a51cdeab1a4c005aa3909b77668b699.tar.gz
taler-merchant-demos-314ec1716a51cdeab1a4c005aa3909b77668b699.tar.bz2
taler-merchant-demos-314ec1716a51cdeab1a4c005aa3909b77668b699.zip
add accessibility skip link to demo pages
-rw-r--r--talermerchantdemos/static/demo.css16
-rw-r--r--talermerchantdemos/templates/common-base.html.j21
2 files changed, 17 insertions, 0 deletions
diff --git a/talermerchantdemos/static/demo.css b/talermerchantdemos/static/demo.css
index ed4f4ca..e0982d1 100644
--- a/talermerchantdemos/static/demo.css
+++ b/talermerchantdemos/static/demo.css
@@ -1,6 +1,22 @@
@charset "UTF-8";
@import url(/static/theme.css);
+
+.skip {
+ position: absolute;
+ left: -10000px;
+ top: auto;
+ width: 1px;
+ height: 1px;
+ overflow: hidden;
+}
+
+.skip:focus {
+ position: static;
+ width: auto;
+ height: auto;
+}
+
.demobar h1 {
text-align: center;
}
diff --git a/talermerchantdemos/templates/common-base.html.j2 b/talermerchantdemos/templates/common-base.html.j2
index 5fc07cb..e2a5585 100644
--- a/talermerchantdemos/templates/common-base.html.j2
+++ b/talermerchantdemos/templates/common-base.html.j2
@@ -26,6 +26,7 @@
<body>
<header class="demobar" style="display: flex; flex-direction: row; justify-content: space-between;">
+ <a href="#main" class="skip">Skip to main content</a>
<div style="max-width: 50em; margin-left: 2em;">
{% block header_content %}
<p>This is the header content.</p>