diff --git a/assets/scss/common.scss b/assets/scss/common.scss index 84d69f513..fda86e853 100644 --- a/assets/scss/common.scss +++ b/assets/scss/common.scss @@ -338,29 +338,20 @@ section { // copy button .copy-code-button { display: none; - position: relative; + position: absolute; + top: 5px; + right: 5px; z-index: 2; - width: 0; - height: 0; - margin-left: auto; - margin-right: 25px; - transform: translateY(5px); + width: 20px; + height: 20px; + background-image: url('/images/docs/copy-code.svg'); + background-repeat: no-repeat; + background-size: cover; cursor: pointer; - - div { - position: absolute; - top: 0; - left: 0; - width: 20px; - height: 20px; - background-image: url('/images/docs/copy-code.svg'); - background-repeat: no-repeat; - background-size: cover; - } } .copy-code-button:hover { - top: -2px; + top: 3px; } .highlight pre { diff --git a/assets/scss/markdown.scss b/assets/scss/markdown.scss index 850d9b4ac..1482d19bf 100644 --- a/assets/scss/markdown.scss +++ b/assets/scss/markdown.scss @@ -408,7 +408,14 @@ } .md-body pre { + position: relative; word-wrap: normal; + + &:hover { + .copy-code-button { + display: block; + } + } } .md-body pre > code { diff --git a/layouts/docs/single.html b/layouts/docs/single.html index aaf7fb265..28e4b5ccb 100644 --- a/layouts/docs/single.html +++ b/layouts/docs/single.html @@ -248,12 +248,6 @@ }) } - var bindClickContributor = function() { - $('.contributor-avatar').click(function() { - - }) - } - var __main = function() { getFileContributors() bindClickMenu() diff --git a/static/js/markdown-tab.js b/static/js/markdown-tab.js index ef7c9ce3b..c818b49fe 100644 --- a/static/js/markdown-tab.js +++ b/static/js/markdown-tab.js @@ -29,9 +29,7 @@ function addCopyButtons(clipboard) { document.querySelectorAll('pre > code').forEach(function (codeBlock) { var button = document.createElement('div'); button.className = 'copy-code-button'; - button.type = 'button'; - var inner = document.createElement('div'); - button.appendChild(inner) + button.title = "Copy Code" button.addEventListener('click', function () { clipboard.writeText(codeBlock.innerText).then(function () { /* Chrome doesn't seem to blur automatically, @@ -40,15 +38,7 @@ function addCopyButtons(clipboard) { }, function (error) { }); }); - var pre = codeBlock.parentNode - - pre.addEventListener('mouseenter', function() { - button.style.display = 'block' - }) - - pre.addEventListener('mouseleave', function() { - button.style.display = 'none' - }) + var pre = codeBlock.parentNode; pre.insertBefore(button, codeBlock);