Rename everything to skippy and center skippy (#27420)

diff --git a/site/_includes/skippy.html b/site/_includes/skippy.html
index 2c73089bc37bc50a54a2413ed1887d770de7205c..ec7507d53273ddb893da0ad7c5ef94bb506f65a5 100644 (file)
--- a/site/_includes/skippy.html
+++ b/site/_includes/skippy.html
@@ -1,5 +1,3 @@
-<a id="skippy" class="sr-only sr-only-focusable" href="#content">
-  <div class="container">
-    <span class="skiplink-text">Skip to main content</span>
-  </div>
+<a class="skippy sr-only sr-only-focusable" href="#content">
+  <span class="skippy-text">Skip to main content</span>
 </a>

diff --git a/site/docs/4.1/assets/scss/_skiplink.scss b/site/docs/4.1/assets/scss/_skiplink.scss
deleted file mode 100644 (file)
index 7ca3074..0000000
--- a/site/docs/4.1/assets/scss/_skiplink.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-// stylelint-disable selector-max-id
-
-#skippy {
-  display: block;
-  padding: 1em;
-  color: #fff;
-  background-color: $bd-purple;
-  outline: 0;
-
-  .skiplink-text {
-    padding: .5em;
-    outline: 1px dotted;
-  }
-}

diff --git a/site/docs/4.1/assets/scss/_skippy.scss b/site/docs/4.1/assets/scss/_skippy.scss
new file mode 100644 (file)
index 0000000..db971d1
--- /dev/null
+++ b/site/docs/4.1/assets/scss/_skippy.scss
@@ -0,0 +1,17 @@
+.skippy {
+  display: block;
+  padding: 1em;
+  color: $white;
+  text-align: center;
+  background-color: $bd-purple;
+  outline: 0;
+
+  @include hover {
+    color: $white;
+  }
+}
+
+.skippy-text {
+  padding: .5em;
+  outline: 1px dotted;
+}

diff --git a/site/docs/4.1/assets/scss/docs.scss b/site/docs/4.1/assets/scss/docs.scss
index 706bde44e656677f56cf046e8d4d5a309ed8fc5d..0f779710343aa814246eb05f46472813eba4ab68 100644 (file)
--- a/site/docs/4.1/assets/scss/docs.scss
+++ b/site/docs/4.1/assets/scss/docs.scss
@@ -34,7 +34,7 @@
 @import "masthead";
 @import "ads";
 @import "content";
-@import "skiplink";
+@import "skippy";
 @import "sidebar";
 @import "footer";
 @import "component-examples";