Add govuk-template-flask-skeleton

assets/stylesheets/govuk_template/_accessibility.scss

@@ -0,0 +1,101 @@
+/* For image replacement */
+.ir {
+  display: block;
+  text-indent: -999em;
+  overflow: hidden;
+  background-repeat: no-repeat;
+  text-align: left;
+  direction: ltr;
+
+  br {
+    display: none;
+  }
+}
+
+/* Hide for both screenreaders and browsers */
+.hidden {
+  display: none;
+  visibility: hidden;
+}
+
+/* Hide only visually, but have it available for screenreaders */
+.visually-hidden,
+.visuallyhidden {
+  position: absolute;
+  left: -9999em;
+
+  /*
+   * Extends the .visuallyhidden class to allow the element to be
+   * focusable when navigated to via the keyboard
+   */
+  &.focusable:active,
+  &.focusable:focus {
+    clip: auto;
+    height: auto;
+    margin: 0;
+    overflow: visible;
+    position: static;
+    width: auto;
+  }
+}
+
+/* Hide visually and from screenreaders, but maintain layout */
+.invisible {
+  visibility: hidden;
+}
+
+/* Give a strong clear visual idea as to what is currently in focus */
+a {
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);
+}
+
+a:focus {
+  background-color: $focus-colour;
+  outline: 3px solid $focus-colour;
+}
+
+/* Make skiplinks visible when they are tabbed to */
+
+.skiplink {
+  position: absolute;
+  left: -9999em;
+}
+
+.skiplink:focus {
+  position: static;
+}
+
+#skiplink-container {
+  text-align: center;
+  background: $black;
+
+  div {
+    text-align: left;
+    margin: 0 auto;
+    max-width: 1020px;
+  }
+
+  .skiplink {
+    @include inline-block;
+    margin: 0.75em 0 0 30px;
+  }
+}
+
+input:focus,
+textarea:focus,
+select:focus,
+button:focus,
+#global-header input:focus {
+  outline: 3px solid $focus-colour;
+}
+
+#global-header {
+  h1 a:focus {
+    background-color: transparent;
+    outline: none;
+  }
+
+  a:focus {
+	  color: $black;
+  }
+}