Docs: Add top/bottom margin to highlighted code samples (#31706)

Backport of #31036 to v4

diff --git a/site/docs/4.5/assets/scss/_clipboard-js.scss b/site/docs/4.5/assets/scss/_clipboard-js.scss
index 760a806bb2c5f00dd9fa7dd060624be92fc87083..b8c6a9e8f5031d1f30fa15e76c549d628b449d6e 100644 (file)
--- a/site/docs/4.5/assets/scss/_clipboard-js.scss
+++ b/site/docs/4.5/assets/scss/_clipboard-js.scss
@@ -18,19 +18,19 @@
 
 .btn-clipboard {
   position: absolute;
-  top: .5rem;
-  right: .5rem;
+  top: .65rem;
+  right: .65rem;
   z-index: 10;
   display: block;
   padding: .25rem .5rem;
-  @include font-size(75%);
-  color: #818a91;
-  background-color: transparent;
-  border: 0;
+  @include font-size(65%);
+  color: $primary;
+  background-color: $white;
+  border: 1px solid;
   @include border-radius();
 
   &:hover {
     color: $white;
-    background-color: #027de7;
+    background-color: $primary;
   }
 }

diff --git a/site/docs/4.5/assets/scss/_component-examples.scss b/site/docs/4.5/assets/scss/_component-examples.scss
index 41360d6c459083677f46f58d54a021b93d61523e..a296718976c640a81ea593e73a313a7964fdd069 100644 (file)
--- a/site/docs/4.5/assets/scss/_component-examples.scss
+++ b/site/docs/4.5/assets/scss/_component-examples.scss
@@ -366,8 +366,8 @@
 .highlight {
   pre {
     padding: 0;
-    margin-top: 0;
-    margin-bottom: 0;
+    margin-top: .65rem;
+    margin-bottom: .65rem;
     background-color: transparent;
     border: 0;
   }