[hop-website] branch master updated: fix copy image

[ha...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

hansva pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/hop-website.git


The following commit(s) were added to refs/heads/master by this push:
     new 5df5563  fix copy image
     new f07faa4  Merge pull request #126 from hansva/master
5df5563 is described below

commit 5df5563f0ed8ed338345ab21f6f8c5f59c15eb86
Author: Hans Van Akelyen <ha...@gmail.com>
AuthorDate: Mon Feb 7 12:16:30 2022 +0100

    fix copy image
---
 antora-ui-hop/src/css/doc.css                | 90 ++++++++++++++++++++++++++++
 antora-ui-hop/src/js/06-copy-to-clipboard.js |  4 +-
 2 files changed, 92 insertions(+), 2 deletions(-)

diff --git a/antora-ui-hop/src/css/doc.css b/antora-ui-hop/src/css/doc.css
index 78eeb38..bbc6b08 100644
--- a/antora-ui-hop/src/css/doc.css
+++ b/antora-ui-hop/src/css/doc.css
@@ -724,6 +724,96 @@
   hyphens: none;
 }
 
+.doc .source-toolbox {
+  display: flex;
+  visibility: hidden;
+  position: absolute;
+  top: 0.25rem;
+  right: 0.5rem;
+  color: var(--pre-annotation-font-color);
+  font-family: var(--body-font-family);
+  font-size: calc(13.5 / var(--rem-base) * 1rem);
+  line-height: 1;
+}
+
+.doc .listingblock:hover .source-toolbox {
+  visibility: visible;
+}
+
+.doc .source-toolbox .source-lang {
+  text-transform: uppercase;
+  letter-spacing: 0.075em;
+  font-size: 0.96em;
+  line-height: 1.0425;
+}
+
+.doc .source-toolbox > :not(:last-child)::after {
+  content: "|";
+  letter-spacing: 0;
+  padding: 0 1ch;
+}
+
+.doc .source-toolbox .copy-button {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  background: transparent;
+  border: none;
+  color: inherit;
+  outline: none;
+  padding: 0;
+  font-size: inherit;
+  line-height: inherit;
+  width: 1em;
+  height: 1em;
+}
+
+.doc .source-toolbox .copy-icon {
+  flex: none;
+  width: inherit;
+  height: inherit;
+}
+
+.doc .source-toolbox img.copy-icon {
+  filter: invert(50.2%);
+}
+
+.doc .source-toolbox svg.copy-icon {
+  fill: currentColor;
+}
+
+.doc .source-toolbox .copy-toast {
+  flex: none;
+  position: relative;
+  display: inline-flex;
+  justify-content: center;
+  margin-top: 1em;
+  background-color: var(--doc-font-color);
+  border-radius: 0.25em;
+  padding: 0.5em;
+  color: var(--color-white);
+  cursor: auto;
+  opacity: 0;
+  transition: opacity 0.5s ease 0.75s;
+}
+
+.doc .source-toolbox .copy-toast::after {
+  content: "";
+  position: absolute;
+  top: 0;
+  width: 1em;
+  height: 1em;
+  border: 0.55em solid transparent;
+  border-left-color: var(--doc-font-color);
+  transform: rotate(-90deg) translateX(50%) translateY(50%);
+  transform-origin: left;
+}
+
+.doc .source-toolbox .copy-button.clicked .copy-toast {
+  opacity: 1;
+  transition: none;
+}
+
 /* for mobile screens */
 @media screen and (max-width: 626px) {
   #preamble + .sect1,
diff --git a/antora-ui-hop/src/js/06-copy-to-clipboard.js b/antora-ui-hop/src/js/06-copy-to-clipboard.js
index 46f2144..ea29e9a 100644
--- a/antora-ui-hop/src/js/06-copy-to-clipboard.js
+++ b/antora-ui-hop/src/js/06-copy-to-clipboard.js
@@ -35,12 +35,12 @@
         var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg')
         svg.setAttribute('class', 'copy-icon')
         var use = document.createElementNS('http://www.w3.org/2000/svg', 'use')
-        use.setAttribute('href', window.uiRootPath + '/img/octicons-16.svg#icon-clippy')
+        use.setAttribute('href', 'https://hop.apache.org/_/img/octicons-16.svg#icon-clippy')
         svg.appendChild(use)
         copy.appendChild(svg)
       } else {
         var img = document.createElement('img')
-        img.src = window.uiRootPath + '/img/octicons-16.svg#view-clippy'
+        img.src = 'https://hop.apache.org/_/img/octicons-16.svg#view-clippy'
         img.alt = 'copy icon'
         img.className = 'copy-icon'
         copy.appendChild(img)