feat: add copy code button

apps/course/static/global.css

@@ -130,3 +130,21 @@ code.hljs {
     font-weight: 700;
   }
 }
+
+.copy-code {
+  padding: 3px 5px 3px 5px;
+  color: #ffffff;
+  margin-top: 4px;
+  background: #37919b;
+  border-radius: 5px;
+  float:right;
+}
+
+.copy-code:hover {
+  background: #73b2b9;
+}
+
+.prose :where(pre):not(:where([class~="not-prose"] *)) {
+  margin-top: 0px !important;
+  margin-bottom: 0px !important;
+}

packages/tutors-reader-lib/package.json

@@ -13,21 +13,22 @@
     "url": "https://github.com/tutors-sdk/tutors-kit.git"
   },
   "devDependencies": {
+    "@iconify/svelte": "^3.0.1",
     "@types/remove-markdown": "^0.3.1",
     "@types/showdown": "2.0.0",
-    "@iconify/svelte": "^3.0.1",
     "auth0-js": "^9.20.0",
     "crypto-es": "^1.2.7",
+    "eslint-config-custom": "*",
+    "firebase": "^9.15.0",
+    "path-browserify": "^1.0.1",
+    "remove-markdown": "^0.5.0",
     "showdown": "2.1.0",
-    "svelte-spa-router": "^3.3.0",
+    "showdown-copy-code": "^1.0.2",
     "showdown-custom-class": "^1.0.0",
     "showdown-emoji": "^3.0.0",
     "showdown-highlight": "3.1.0",
     "showdown-katex": "^0.8.0",
-    "remove-markdown": "^0.5.0",
-    "firebase": "^9.15.0",
-    "path-browserify": "^1.0.1",
-    "eslint-config-custom": "*",
+    "svelte-spa-router": "^3.3.0",
     "typescript": "^4.9.4"
   }
 }

packages/tutors-reader-lib/src/utils/markdown-utils.ts

@@ -1,5 +1,6 @@
 import showdown from "showdown";
 import showdownHighlight from "showdown-highlight";
+import { showdownCopyCode } from "showdown-copy-code";
 //import showdownKatex from "showdown-katex";
 import customClassExt from "showdown-custom-class";
 
@@ -9,7 +10,8 @@ const converter = new showdown.Converter({
   openLinksInNewWindow: true,
   extensions: [
     showdownHighlight,
-    customClassExt
+    customClassExt,
+    showdownCopyCode
     // showdownKatex({
     //   // maybe you want katex to throwOnError
     //   throwOnError: false,