Rename everything to skippy and center skippy (#27420)

site/docs/4.1/assets/scss/_skiplink.scss

@@ -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;
-  }
-}

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;
+}

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";