change copy button

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 {

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 {

layouts/docs/single.html

@@ -248,12 +248,6 @@
         })
     }
 
-    var bindClickContributor = function() {
-        $('.contributor-avatar').click(function() {
-
-        })
-    }
-
     var __main = function() {
         getFileContributors()
         bindClickMenu()

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);