amass/md
1
0
Fork 0
mirror of https://github.com/doocs/md.git synced 2024-11-28 13:36:32 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: merge params of theme

Browse Source
This commit is contained in:
JimQing 2019-12-08 21:45:33 +08:00
parent 8d1ca62bd8
commit 95dd851b3d
3 changed files with 18 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
assets/scripts/editor.js
View File

@ -66,7 +66,7 @@ let app = new Vue({
); );
this.editor.on("change", (cm, change) => { this.editor.on("change", (cm, change) => {
this.refresh(); this.refresh();
this.saveEditorContent(); this.saveEditorContent(this.editor, '__editor_content');
}); });
this.cssEditor.on('update', (instance) => { this.cssEditor.on('update', (instance) => {
this.cssChanged(); this.cssChanged();
@ -126,16 +126,18 @@ let app = new Vue({
this.refresh(); this.refresh();
}, },
colorChanged(color) { colorChanged(color) {
let theme = setColor(color) let theme = setColor(color);
this.wxRenderer.setOptions({ this.wxRenderer.setOptions({
theme: theme theme: theme
}); });
this.refresh(); this.refresh();
}, },
cssChanged() { cssChanged() {
let theme = JSON5.parse(this.cssEditor.getValue(0)); let theme = JSON.parse(this.cssEditor.getValue(0));
this.wxRenderer.setOptions({ this.wxRenderer.setOptions({
theme: customCss(theme) theme: customCss(theme, this.currentColor),
font: this.currentFont,
size: this.currentSize
}); });
this.refresh(); this.refresh();
}, },
@ -197,12 +199,12 @@ let app = new Vue({
}); });
}, },
// 将左侧编辑器内容保存到 LocalStorage // 将左侧编辑器内容保存到 LocalStorage
saveEditorContent() { saveEditorContent(editor, name) {
let content = this.editor.getValue(0); const content = editor.getValue(0);
if (content) { if (content) {
localStorage.setItem("__editor_content", content); localStorage.setItem(name, content);
} else { } else {
localStorage.removeItem("__editor_content"); localStorage.removeItem(name);
} }
}, },
customStyle() { customStyle() {

8
assets/scripts/util.js
View File

@ -13,7 +13,7 @@ function setColorWithTemplate(template) {
let setColor = setColorWithTemplate(default_theme); let setColor = setColorWithTemplate(default_theme);
function customCssWithTemplate(template) { function customCssWithTemplate(template, color) {
return function (jsonString) { return function (jsonString) {
let custom_theme = JSON.parse(JSON.stringify(template)); let custom_theme = JSON.parse(JSON.stringify(template));
custom_theme.block.h1 = jsonString.h1; custom_theme.block.h1 = jsonString.h1;
@ -21,6 +21,12 @@ function customCssWithTemplate(template) {
custom_theme.block.h3 = jsonString.h3; custom_theme.block.h3 = jsonString.h3;
custom_theme.block.h4 = jsonString.h4; custom_theme.block.h4 = jsonString.h4;
custom_theme.block.p = jsonString.p; custom_theme.block.p = jsonString.p;
// color
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;
return custom_theme; return custom_theme;
}; };
} }

2
index.html
View File

@ -104,7 +104,7 @@
</section> </section>
</el-col> </el-col>
<el-col id="cssBox" :span="8" v-show="showBox"> <el-col id="cssBox" :span="8" v-show="showBox">
<textarea id="cssEditor" type="textarea" placeholder="Custom css here." v-model="source"> <textarea id="cssEditor" type="textarea" @change="cssChanged" placeholder="Custom css here." v-model="source">
</textarea> </textarea>
</el-col> </el-col>
</el-row> </el-row>