Cleanup copy button CSS and add a hover-over explanation.

docs/_static/copy.js

@@ -21,6 +21,8 @@ document.addEventListener("DOMContentLoaded", () => {
       let copyEl = document.createElement("span");
       copyEl.addEventListener('click', () => copy(codeblock));
       copyEl.className = "copy";
+      copyEl.setAttribute("aria-label", "Copy Code");
+      copyEl.setAttribute("title", "Copy Code");
 
       let copyIcon = document.createElement("i");
       copyIcon.className = "fas " + COPY;

docs/_static/style.css

@@ -262,25 +262,17 @@ div.modal-content > span.close:focus {
 .copy {
   cursor: pointer;
   position: absolute;
-  width: 16px;
-  height: 16px;
   top: 0px;
   right: 0px;
   border: 1px solid var(--codeblock-border);
   line-height: 0.8em;
   font-size: 0.9em;
-  font-family: monospace;
   padding-left: 0.2em;
   padding-right: 0.2em;
-  border-radius: 0px 3px 0px 0px;
+  border-bottom-left-radius: 4px;
   text-align: center;
 }
 
-.copy i {
-  display: inline;
-  vertical-align: middle;
-}
-
 /* -- body styles --------------------------------------------------------- */
 
 hr {