fix: update css editor

更新样式编辑器代码

.gitignore

@@ -0,0 +1,29 @@
+  
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+.vscode
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+dist
+package-lock.json
+lib

.vscode/settings.json

@@ -1,3 +0,0 @@
-{
-    "liveServer.settings.port": 5501
-}

assets/scripts/editor.js

@@ -39,7 +39,7 @@ let app = new Vue({
     d.currentCssEditorTheme = d.editorThemes[0].value;
     d.currentFont = d.builtinFonts[0].value;
     d.currentSize = d.sizeOption[1].value;
-    d.currentColor = d.colorOption[1].value;
+    d.currentColor = d.colorOption[0].value;
     return d;
   },
   mounted() {
@@ -82,7 +82,7 @@ let app = new Vue({
       this.saveEditorContent(this.editor, '__editor_content');
     });
     this.cssEditor.on('update', (instance) => {
-        this.cssChanged()
+      this.cssChanged();
       this.saveEditorContent(this.cssEditor, '__css_content');
     });
     this.wxRenderer = new WxRenderer({
@@ -143,7 +143,7 @@ let app = new Vue({
       let json = css2json(this.cssEditor.getValue(0))
       let theme = customCssWithTemplate(json, this.currentColor)
       this.wxRenderer.setOptions({
-            theme
+        theme: theme
       });
       this.refresh();
     },
@@ -215,7 +215,6 @@ let app = new Vue({
       }
     },
     customStyle() {
-        console.log(this.currentColor)
       this.showBox = !this.showBox;
     },
     setDefaultContent() {

assets/scripts/util.js

@@ -16,6 +16,13 @@ let setColor = setColorWithTemplate(default_theme);
 function customCssWithTemplate(jsonString, color) {
     let custom_theme = JSON.parse(JSON.stringify(default_theme));
     // block
+    console.log(jsonString)
+    custom_theme.block.h1['border-bottom'] = `2px solid ${color}`;
+    custom_theme.block.h2['background'] = color;
+    custom_theme.block.h3['border-left'] = `3px solid ${color}`;
+    custom_theme.block.h4['color'] = color;
+    custom_theme.inline.strong['color'] = color;
+
     custom_theme.block.h1 = Object.assign(custom_theme.block.h1, jsonString.h1);
     custom_theme.block.h2 = Object.assign(custom_theme.block.h2, jsonString.h2);
     custom_theme.block.h3 = Object.assign(custom_theme.block.h3, jsonString.h3);
@@ -38,9 +45,7 @@ function customCssWithTemplate(jsonString,color) {
     custom_theme.inline.link = Object.assign(custom_theme.inline.link, jsonString.link);
     custom_theme.inline.wx_link = Object.assign(custom_theme.inline.wx_link, jsonString.wx_link);
 
-        custom_theme.block.h2['background'] = color;
-        custom_theme.block.h3['border-left'] = `3px solid ${color}`;
-        custom_theme.inline.strong['color'] = color;
+    
     return custom_theme;
 
 }

index.html

@@ -160,7 +160,6 @@
   <script src="libs/scripts/prettify.min.js"></script>
   <script src="libs/scripts/index.js"></script>
   <script src="libs/scripts/jquery.min.js"></script>
-  <script src="libs/scripts/json5.js"></script>
 
   <script src="assets/scripts/sync-scroll.js"></script>
   <script src="assets/scripts/themes/default-theme.js"></script>