(fix): clip image path and nav folder tag

Author: kameshsampath

documentation/modules/ROOT/pages/_partials/eventing-snippets.adoc

@@ -1,5 +1,5 @@
 
-#tag:eventing-nav-folder[]
+# tag::eventing-nav-folder[]
 
 Navigate to the tutorial chapter's `knative` folder:
 
@@ -10,7 +10,7 @@ cd $TUTORIAL_HOME/{eventing-repo}/knative
 ----
 copyToClipboard::eventing-navigate-to-folder[]
 
-#end:eventing-nav-folder[]
+# end::eventing-nav-folder[]
 
 # tag::cronjob-source[]
 

lib/copy-to-clipboard.js

@@ -22,9 +22,7 @@ const BlockCopyToClipboardMacro = (() => {
     const t = target.startsWith(":") ? target.substr(1) : target;
     //console.log("target:", t);
     const createHtmlFragment = html => this.createBlock(parent, "pass", html);
-    const html = `<button class="copybtn" title="Copy to clipboard" data-clipboard-target="#${t}"> 
-      <img src="/_/img/clippy.svg" width="13">
-    </button><br/>`;
+    const html = `<button class="copybtn" title="Copy to clipboard" data-clipboard-target="#${t}"><i class="fa fa-copy"></i></button><br/>`;
     parent.blocks.push(createHtmlFragment(html));
   });
 

supplemental-ui/css/vendor/knative-tutorial-site.css

@@ -1,13 +1,17 @@
-img.clippy {
-  margin-top: -3px;
-  position: relative;
-  top: 3px;
-}
-
-button.copybtn {
-  padding: 2px 6px;
+.copybtn {
+  background-color: #cc0000;
+  border: none;
+  color: white;
+  padding: 10px 10px;
+  font-size: 12px;
+  cursor: pointer !important;
+  outline: none;
   right: 4px;
   top: 4px;
   float: right;
-  cursor: pointer !important;
+}
+
+/* Darker background on mouse-over */
+.copybtn:hover {
+  background-color: #820000;
 }

supplemental-ui/partials/head-meta.hbs

@@ -1,2 +1,3 @@
 <link rel="icon" href="{{uiRootPath}}/img/favicon.ico" type="image/x-icon">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 <link rel="stylesheet" href="{{uiRootPath}}/css/vendor/knative-tutorial-site.css">