From 25d017a2eef33c59ac987d6db82d6dccde5283e9 Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Sat, 22 Sep 2018 10:53:23 +0300 Subject: Replace ZeroClipboard with clipboard.js (backported from v4). --- docs/assets/less/clipboard-js.less | 39 ++++++++++++++++++++++++++++++++++++ docs/assets/less/docs.less | 2 +- docs/assets/less/examples.less | 8 ++++++-- docs/assets/less/zero-clipboard.less | 33 ------------------------------ 4 files changed, 46 insertions(+), 36 deletions(-) create mode 100644 docs/assets/less/clipboard-js.less delete mode 100644 docs/assets/less/zero-clipboard.less (limited to 'docs/assets/less') diff --git a/docs/assets/less/clipboard-js.less b/docs/assets/less/clipboard-js.less new file mode 100644 index 0000000000..af4a75b435 --- /dev/null +++ b/docs/assets/less/clipboard-js.less @@ -0,0 +1,39 @@ +// clipboard.js +// +// JS-based `Copy` buttons for code snippets. + +.bs-clipboard { + position: relative; + display: none; + float: right; + + + .highlight { + margin-top: 0; + } +} + +.btn-clipboard { + position: absolute; + top: 0; + right: 0; + z-index: 10; + display: block; + padding: .25rem .5rem; + font-size: 12px; + color: #818a91; + cursor: pointer; + background-color: transparent; + border: 0; + border-radius: .25rem; + + &:hover { + color: #fff; + background-color: #027de7; + } +} + +@media (min-width: @screen-sm-min) { + .bs-clipboard { + display: block; + } +} diff --git a/docs/assets/less/docs.less b/docs/assets/less/docs.less index b2c106c858..b7c015f334 100644 --- a/docs/assets/less/docs.less +++ b/docs/assets/less/docs.less @@ -34,7 +34,7 @@ @import "glyphicons.less"; @import "customizer.less"; @import "brand.less"; -@import "zero-clipboard.less"; +@import "clipboard-js.less"; @import "anchor.less"; @import "algolia.less"; @import "misc.less"; diff --git a/docs/assets/less/examples.less b/docs/assets/less/examples.less index 57dc53fe8f..e8680b141c 100644 --- a/docs/assets/less/examples.less +++ b/docs/assets/less/examples.less @@ -50,7 +50,7 @@ // Tweak display of the code snippets when following an example .bs-example + .highlight, -.bs-example + .zero-clipboard + .highlight { +.bs-example + .bs-clipboard + .highlight { margin: -15px -15px 15px; border-width: 0 0 1px; border-radius: 0; @@ -68,7 +68,7 @@ box-shadow: none; } .bs-example + .highlight, - .bs-example + .zero-clipboard + .highlight { + .bs-example + .bs-clipboard + .highlight { margin-top: -16px; margin-right: 0; margin-left: 0; @@ -76,6 +76,10 @@ border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } + .bs-example + .bs-clipboard .btn-clipboard { + top: -15px; // due to padding .bs-example has + border-top-right-radius: 0; + } .bs-example-standalone { border-radius: 4px; } diff --git a/docs/assets/less/zero-clipboard.less b/docs/assets/less/zero-clipboard.less deleted file mode 100644 index 688c8de770..0000000000 --- a/docs/assets/less/zero-clipboard.less +++ /dev/null @@ -1,33 +0,0 @@ -.zero-clipboard { - position: relative; - display: none; -} -.btn-clipboard { - position: absolute; - top: 0; - right: 0; - z-index: 10; - display: block; - padding: 5px 8px; - font-size: 12px; - color: #767676; - cursor: pointer; - background-color: #fff; - border: 1px solid #e1e1e8; - border-radius: 0 4px; -} -.btn-clipboard-hover { - color: #fff; - background-color: #563d7c; - border-color: #563d7c; -} - -@media (min-width: @screen-sm-min) { - .zero-clipboard { - display: block; - } - .bs-example + .zero-clipboard .btn-clipboard { - top: -16px; - border-top-right-radius: 0; - } -} -- cgit v1.2.3