add skip to main content link

govtrack · Jun 11, 2017 · e4d448b · e4d448b
1 parent 0c1b6b4
commit e4d448b
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 2 deletions.
diff --git a/static/css/all.css b/static/css/all.css
@@ -1107,3 +1107,31 @@ ul.singlesignon {
 		.sidebar-events h2:first-child {
 			margin-top: -10px;
 		}
+
+/* A11y Changes, merge? */
+
+/* skiptocontent from http://webaim.org/techniques/skipnav/ */
+#skiptocontent a {
+	padding:6px;
+	position: absolute;
+	top:-40px;
+	left:0px;
+	color:white;
+	border-right:1px solid white;
+	border-bottom:1px solid white;
+	border-bottom-right-radius:8px;
+	background:transparent;
+	-webkit-transition: top 1s ease-out, background 1s linear;
+    transition: top 1s ease-out, background 1s linear;
+    z-index: 100;
+}
+
+#skiptocontent a:focus {
+	position:absolute;
+	left:0px;
+	top:0px;
+	background:#BF1722;
+	outline:0;	
+	-webkit-transition: top .1s ease-in, background .5s linear;
+    transition: top .1s ease-in, background .5s linear;
+}
diff --git a/templates/master.html b/templates/master.html
@@ -57,6 +57,8 @@
 
 	<div id="bodybody">
 
+	<div id="skiptocontent"><a href="#maincontent">skip to main content</a></div>
+
 	<div id="masthead">
 	<nav class="navbar">
 	  <div class="container">
@@ -194,7 +196,7 @@
 	{% endblock %}
 
 	{% block body_with_container %}
-		<div class="container">
+		<div id="maincontent" class="container">
 			<div id="content">
 				{% block body %}
 				{% endblock %}

diff --git a/templates/master_a.html b/templates/master_a.html
@@ -5,7 +5,7 @@
 	<div class="row">
 
 
-		<div class="col-sm-8">
+		<div id="maincontent" class="col-sm-8">
 			{% block summary %}
 			{% endblock %}