From: Patrick H. Lauke <redux@splintered.co.uk>
Date: Wed, 2 Sep 2020 06:17:53 +0000 (+0100)
Subject: Docs: Add top/bottom margin to highlighted code samples (#31036)
X-Git-Tag: v5.0.0-alpha2~103
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=0e007e697e15c1016de1c7761ea69dcf53852457;p=thirdparty%2Fbootstrap.git

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

* Add top/bottom margin to highlighted code samples

provide more space to avoid having the "Copy" button overlap code sample content

* Modify clipboard button style

Per https://github.com/twbs/bootstrap/pull/31036#issuecomment-661322566 and https://github.com/twbs/bootstrap/pull/31036#issuecomment-668162630

* Tweak margin, clipboard button size and position

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
---

diff --git a/site/assets/scss/_clipboard-js.scss b/site/assets/scss/_clipboard-js.scss
index c893533973..12be4037c3 100644
--- a/site/assets/scss/_clipboard-js.scss
+++ b/site/assets/scss/_clipboard-js.scss
@@ -18,15 +18,15 @@
 
 .btn-clipboard {
   position: absolute;
-  top: .5rem;
-  right: .5rem;
+  top: .65rem;
+  right: .65rem;
   z-index: 10;
   display: block;
   padding: .25rem .5rem;
-  @include font-size(.75em);
-  color: $gray-800;
-  background-color: transparent;
-  border: 0;
+  @include font-size(.65em);
+  color: $primary;
+  background-color: $white;
+  border: 1px solid;
   @include border-radius();
 
   &:hover {
diff --git a/site/assets/scss/_component-examples.scss b/site/assets/scss/_component-examples.scss
index df735a41b7..4b7aa43552 100644
--- a/site/assets/scss/_component-examples.scss
+++ b/site/assets/scss/_component-examples.scss
@@ -233,8 +233,8 @@
 
   pre {
     padding: 0;
-    margin-top: 0;
-    margin-bottom: 0;
+    margin-top: .65rem;
+    margin-bottom: .65rem;
     background-color: transparent;
     border: 0;
   }