From c4e242bdb170be26e64e859c5636f3cb0285f679 Mon Sep 17 00:00:00 2001
From: Chris Rebert <code@rebertia.com>
Date: Mon, 10 Feb 2014 10:34:38 -0800
Subject: [PATCH] add .sr-only-focusable; fixes #12259

---
 dist/css/bootstrap.css |  9 +++++++++
 less/scaffolding.less  | 16 ++++++++++++++++
 2 files changed, 25 insertions(+)

diff --git a/dist/css/bootstrap.css b/dist/css/bootstrap.css
index 329b4fa2ed..a0689a31d7 100644
--- a/dist/css/bootstrap.css
+++ b/dist/css/bootstrap.css
@@ -346,6 +346,15 @@ hr {
   clip: rect(0, 0, 0, 0);
   border: 0;
 }
+.sr-only-focusable:active,
+.sr-only-focusable:focus {
+  position: static;
+  width: auto;
+  height: auto;
+  margin: 0;
+  overflow: visible;
+  clip: auto;
+}
 h1,
 h2,
 h3,
diff --git a/less/scaffolding.less b/less/scaffolding.less
index fe29f2d62c..c658d7bf5b 100644
--- a/less/scaffolding.less
+++ b/less/scaffolding.less
@@ -132,3 +132,19 @@ hr {
   clip: rect(0,0,0,0);
   border: 0;
 }
+
+// Use in conjunction with .sr-only to only display content when it's focused.
+// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
+// Credit: HTML5 Boilerplate
+
+.sr-only-focusable {
+  &:active,
+  &:focus {
+    position: static;
+    width: auto;
+    height: auto;
+    margin: 0;
+    overflow: visible;
+    clip: auto;
+  }
+}