Highlight code

editor/package-lock.json

@@ -1153,6 +1153,17 @@
         "del": "^4.1.1"
       }
     },
+    "clipboard": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/clipboard/-/clipboard-2.0.6.tgz",
+      "integrity": "sha512-g5zbiixBRk/wyKakSwCKd7vQXDjFnAMGHoEyBogG/bw9kTD9GvdAvaoRR1ALcEzt3pVKxZR0pViekPMIS0QyGg==",
+      "optional": true,
+      "requires": {
+        "good-listener": "^1.2.2",
+        "select": "^1.1.2",
+        "tiny-emitter": "^2.0.0"
+      }
+    },
     "cliui": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
@@ -1637,6 +1648,12 @@
       "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
       "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
     },
+    "delegate": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz",
+      "integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw==",
+      "optional": true
+    },
     "delegates": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
@@ -3346,6 +3363,15 @@
         "minimatch": "~3.0.2"
       }
     },
+    "good-listener": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz",
+      "integrity": "sha1-1TswzfkxPf+33JoNR3CWqm0UXFA=",
+      "optional": true,
+      "requires": {
+        "delegate": "^3.1.2"
+      }
+    },
     "graceful-fs": {
       "version": "4.2.2",
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.2.tgz",
@@ -6115,6 +6141,14 @@
         "utila": "~0.4"
       }
     },
+    "prismjs": {
+      "version": "1.20.0",
+      "resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.20.0.tgz",
+      "integrity": "sha512-AEDjSrVNkynnw6A+B1DsFkd6AVdTnp+/WoUixFRULlCLZVRZlVQMVWio/16jv7G1FscUxQxOQhWwApgbnxr6kQ==",
+      "requires": {
+        "clipboard": "^2.0.0"
+      }
+    },
     "process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -6779,6 +6813,12 @@
         }
       }
     },
+    "select": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",
+      "integrity": "sha1-DnNQrN7ICxEIUoeG7B1EGNEbOW0=",
+      "optional": true
+    },
     "select-hose": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
@@ -7814,6 +7854,12 @@
         "setimmediate": "^1.0.4"
       }
     },
+    "tiny-emitter": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
+      "integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==",
+      "optional": true
+    },
     "to-arraybuffer": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",

editor/package.json

@@ -24,6 +24,7 @@
     "moment": "^2.26.0",
     "mustache": "^4.0.1",
     "node-sass": "^4.14.1",
+    "prismjs": "^1.20.0",
     "sass-loader": "^7.3.1",
     "style-loader": "^1.0.0",
     "wiki-list-editor": "^0.7.3"

editor/src/index.js

@@ -12,6 +12,9 @@ import Mustache from 'mustache';
 import 'jquery-contextmenu';
 import getCaretCoordinates from './caret-position'
 import moment from 'moment'
+import PrismJS from 'prismjs'
+import 'prismjs/components/prism-php'
+import 'prismjs/components/prism-markup-templating'
 import './styles.scss';
 import '../node_modules/jquery-contextmenu/dist/jquery.contextMenu.css';
 
@@ -183,6 +186,7 @@ if (holder) {
             class: 'wiki-link'
         }
     })).use(MarkdownItMark)
+
     const options = {
         transform(text, callback) {
             let converted = (text.startsWith("```", 0)) ? MD.render(text) : MD.renderInline(text)
@@ -334,6 +338,7 @@ if (holder) {
 
         editor.on('stop-editing', function (input) {
             $('#link-complete').off()
+            PrismJS.highlightAll()
         })
     })
     $.contextMenu({

editor/src/styles.scss

@@ -1,4 +1,22 @@
-@import "~bulma";
+@charset "utf-8";
+//@import "~bulma";
+/*! bulma.io v0.7.5 | MIT License | github.com/jgthms/bulma */
+@import "~bulma/sass/utilities/_all";
+@import "~bulma/sass/base/_all";
+@import "~bulma/sass/elements/box.sass";
+@import "~bulma/sass/elements/button.sass";
+@import "~bulma/sass/elements/container.sass";
+@import "~bulma/sass/elements/content.sass";
+@import "~bulma/sass/elements/icon.sass";
+@import "~bulma/sass/elements/image.sass";
+@import "~bulma/sass/elements/notification.sass";
+@import "~bulma/sass/elements/progress.sass";
+@import "~bulma/sass/elements/table.sass";
+@import "~bulma/sass/elements/tag.sass";
+@import "~bulma/sass/elements/title.sass";
+@import "~bulma/sass/components/_all";
+@import "~bulma/sass/grid/_all";
+@import "~bulma/sass/layout/_all";
 
 html {
   font-family: 'Inter', sans-serif;
@@ -120,41 +138,3 @@ textarea {
   min-height: 19px;
   word-break: break-word;
 }
-
-.codex-editor .icon {
-  align-items: initial;
-  display: initial;
-  justify-content: initial;
-  height: initial;
-  width: initial;
-}
-
-.codex-editor h1.ce-header {
-  @extend .title;
-  @extend .title.is-1;
-}
-
-.codex-editor h2.ce-header {
-  @extend .title;
-  @extend .is-2;
-}
-
-.codex-editor h3.ce-header {
-  @extend .title;
-  @extend .is-3;
-}
-
-.codex-editor h4.ce-header {
-  @extend .title;
-  @extend .is-4;
-}
-
-.codex-editor h5.ce-header {
-  @extend .title;
-  @extend .is-5;
-}
-
-.codex-editor h6.ce-header {
-  @extend .title;
-  @extend .is-6;
-}