diff --git a/package.json b/package.json index 6fffd7e..79ed7a4 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,10 @@ "scripts": { "build-sass": "sass --style compressed src/main.scss public/css/main.css", "build-js": "parcel build src/main.js --dist-dir public/js", + "build-sass-dev": "sass src/main.scss public/css/main.css", + "build-js-dev": "parcel build src/main.js --dist-dir public/js --no-optimize", "start":"npm run build-sass && npm run build-js", + "serve":"npm run build-sass-dev && npm run build-js-dev", "test": "echo \"Error: no test specified\" && exit 1" }, "repository": { diff --git a/src/main.js b/src/main.js index 4598152..d357c46 100644 --- a/src/main.js +++ b/src/main.js @@ -1,5 +1 @@ -import Prism from "prismjs"; -import "prismjs/plugins/custom-class/prism-custom-class"; - - -Prism.plugins.customClass.map({ number: "prism-number", tag: "prism-tag" }); \ No newline at end of file +import "./editor" \ No newline at end of file diff --git a/src/main.scss b/src/main.scss index ee2ef86..dcaf5a0 100644 --- a/src/main.scss +++ b/src/main.scss @@ -1,2 +1,5 @@ @charset "utf-8"; -@import "../node_modules/bulma/bulma.sass"; \ No newline at end of file +@import "../node_modules/bulma/bulma.sass"; + +@import "./scss/prism.scss"; +@import "./scss/editor.scss"; \ No newline at end of file diff --git a/src/tmp.js b/src/tmp.js deleted file mode 100644 index ce6092d..0000000 --- a/src/tmp.js +++ /dev/null @@ -1,39 +0,0 @@ -// codeInput -// by WebCoder49 -// Based on a CSS-Tricks Post -// Needs Prism.js -function update(text) { - let result_element = document.querySelector("#highlighting-content"); - // Handle final newlines (see article) - if(text[text.length-1] == "\n") { - text += " "; - } - // Update code - result_element.innerHTML = text.replace(new RegExp("&", "g"), "&").replace(new RegExp("<", "g"), "<"); /* Global RegExp */ - // Syntax Highlight - Prism.highlightElement(result_element); - } - - function sync_scroll(element) { - /* Scroll result to scroll coords of event - sync with textarea */ - let result_element = document.querySelector("#highlighting"); - // Get and set x and y - result_element.scrollTop = element.scrollTop; - result_element.scrollLeft = element.scrollLeft; - } - - function check_tab(element, event) { - let code = element.value; - if(event.key == "Tab") { - /* Tab key pressed */ - event.preventDefault(); // stop normal - let before_tab = code.slice(0, element.selectionStart); // text before tab - let after_tab = code.slice(element.selectionEnd, element.value.length); // text after tab - let cursor_pos = element.selectionEnd + 1; // where cursor moves after tab - moving forward by 1 char to after tab - element.value = before_tab + "\t" + after_tab; // add tab char - // move cursor - element.selectionStart = cursor_pos; - element.selectionEnd = cursor_pos; - update(element.value); // Update text to include indent - } - } \ No newline at end of file diff --git a/templates/base/footer.tmpl b/templates/base/footer.tmpl index 62f471c..bd02b40 100644 --- a/templates/base/footer.tmpl +++ b/templates/base/footer.tmpl @@ -2,7 +2,7 @@ - + diff --git a/templates/base/header.tmpl b/templates/base/header.tmpl index 832c144..75cbc71 100644 --- a/templates/base/header.tmpl +++ b/templates/base/header.tmpl @@ -5,7 +5,6 @@ ConfigUI - diff --git a/templates/components/editor.tmpl b/templates/components/editor.tmpl new file mode 100644 index 0000000..0246520 --- /dev/null +++ b/templates/components/editor.tmpl @@ -0,0 +1,5 @@ +{{define "components/editor"}} + +{{.Content}} + +{{end}} \ No newline at end of file diff --git a/templates/components/menu.tmpl b/templates/components/menu.tmpl new file mode 100644 index 0000000..3ff41d9 --- /dev/null +++ b/templates/components/menu.tmpl @@ -0,0 +1,20 @@ +{{define "components/menu"}} +
+ +
+{{end}} \ No newline at end of file diff --git a/templates/home.tmpl b/templates/home.tmpl index b6fa25c..0898673 100644 --- a/templates/home.tmpl +++ b/templates/home.tmpl @@ -14,24 +14,7 @@
-
- -
+ {{template "components/menu" .}}

Two

@@ -40,12 +23,7 @@

Three

- - - - + {{template "components/editor" .}}