diff --git a/assets/scss/common.scss b/assets/scss/common.scss index fda86e853..2d9dceac5 100644 --- a/assets/scss/common.scss +++ b/assets/scss/common.scss @@ -336,6 +336,10 @@ section { } // copy button +.code-over-div { + position: relative; + overflow: auto; +} .copy-code-button { display: none; position: absolute; diff --git a/assets/scss/doc.scss b/assets/scss/doc.scss index 38a1552f9..05f242e0c 100644 --- a/assets/scss/doc.scss +++ b/assets/scss/doc.scss @@ -605,7 +605,7 @@ body { .aside-fixed { position: fixed; - top: 220px; + top: 250px; left: 50%; transform: translateX(500px); } diff --git a/assets/scss/markdown.scss b/assets/scss/markdown.scss index 1482d19bf..8a32643c5 100644 --- a/assets/scss/markdown.scss +++ b/assets/scss/markdown.scss @@ -418,7 +418,7 @@ } } -.md-body pre > code { +.md-body pre code { display: inline-block; white-space: pre; font-family: Monaco; diff --git a/layouts/docs/single.html b/layouts/docs/single.html index 28e4b5ccb..6021d44d8 100644 --- a/layouts/docs/single.html +++ b/layouts/docs/single.html @@ -50,20 +50,20 @@
{{ i18n "Last updated" }}: - +
- + {{ i18n "edit" }}
- + {{ i18n "feedback" }} diff --git a/static/js/markdown-tab.js b/static/js/markdown-tab.js index c818b49fe..21d684b10 100644 --- a/static/js/markdown-tab.js +++ b/static/js/markdown-tab.js @@ -27,21 +27,21 @@ $('.nav-tabs a').click(function (e) { // copy button function addCopyButtons(clipboard) { document.querySelectorAll('pre > code').forEach(function (codeBlock) { + var div = document.createElement('div'); + div.className = 'code-over-div'; var button = document.createElement('div'); button.className = 'copy-code-button'; button.title = "Copy Code" button.addEventListener('click', function () { clipboard.writeText(codeBlock.innerText).then(function () { - /* Chrome doesn't seem to blur automatically, - leaving the button in a focused state. */ button.blur(); }, function (error) { }); }); var pre = codeBlock.parentNode; - pre.insertBefore(button, codeBlock); - + div.appendChild(codeBlock) + pre.appendChild(div) }); } if (navigator && navigator.clipboard) {