diff --git a/README.md b/README.md index 29a9dc4..d643673 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,9 @@ # 微信 Markdown 编辑器 [![github](https://badgen.net/badge/⭐/GitHub/cyan)](https://github.com/doocs/md) [![gitee](https://badgen.net/badge/⭐/Gitee/cyan)](https://gitee.com/doocs/md) [![license](https://badgen.net/github/license/doocs/md)](./LICENSE) [![release](https://img.shields.io/github/v/release/doocs/md.svg)](https://github.com/doocs/md/releases/tag/v1.0.0) [![PRs Welcome](https://badgen.net/badge/PRs/welcome/green)](http://makeapullrequest.com) -> Markdown 文档自动即时渲染为微信图文,让你不再为微信文章排版而发愁! +> 本项目基于 [wechat-format](https://github.com/lyricat/wechat-format) 进行二次开发,感谢 [lyricat](https://github.com/lyricat) 的创意和贡献! -本项目基于 [wechat-format](https://github.com/lyricat/wechat-format) 进行二次开发,感谢 [lyricat](https://github.com/lyricat) 的创意和贡献! +Markdown 文档自动即时渲染为微信图文,让你不再为微信文章排版而发愁! ## 编辑器地址 欢迎使用本微信 Markdown 编辑器进行排版。只要你会基本的 Markdown 语法,就能做出一篇排版美观、大方的微信图文。 @@ -25,7 +25,7 @@ - [x] 支持链接微信图文,外链自动转为文末索引 - [x] 支持一键复制并粘贴到公众号后台 - [x] 支持图片上传并将 URL 插入编辑器光标定位处 -- [ ] 实现自定义 CSS 并实时渲染(待开发) +- [ ] 支持自定义 CSS 并实时渲染([开发中](https://github.com/doocs/md/tree/feat/custom-css)) ![select-and-replace-color-theme](./assets/images/select-and-replace-color-theme.gif) @@ -41,7 +41,7 @@ 注:如果你使用了本 Markdown 编辑器进行文章排版,并且希望将你的文章加入示例列表,欢迎随时提交 PR。 ## 我的公众号 -GitHub 技术社区 Doocs 旗下唯一公众号“Doocs 开源社区”,欢迎关注,专注于分享有价值的文章;当然,也可以加我个人微信(备注:GitHub)。 +GitHub 技术社区 Doocs 旗下唯一公众号“**Doocs 开源社区**”,欢迎关注,专注于分享有价值的文章;当然,也可以加我个人微信(备注:GitHub)。 diff --git a/assets/scripts/editor.js b/assets/scripts/editor.js index d541652..f4b427b 100644 --- a/assets/scripts/editor.js +++ b/assets/scripts/editor.js @@ -7,7 +7,7 @@ let app = new Vue({ source: '', editorThemes: [ { label: '淡雅', value: 'xq-light' }, - { label: '精美', value: 'eclipse' }, + { label: '精致', value: 'eclipse' }, { label: '暗绿', value: 'oceanic-next' } ], editor: null, @@ -28,9 +28,9 @@ let app = new Vue({ { label: '15px', value: '15px', desc: '稍大' } ], colorOption: [ - { label: '橘红', value: 'rgba(255, 95, 46, 0.9)', hex: '#FF5F2E' }, - { label: '淡绿', value: 'rgba(66, 185, 131, 0.9)', hex: '#42B983' }, - { label: '暗青', value: 'rgba(0, 139, 139, 0.9)', hex: '#008B8B' } + { label: '经典蓝', value: 'rgba(15, 76, 129, 0.9)', hex: '最新流行色' }, + { label: '翡翠绿', value: 'rgba(0, 152, 116, 0.9)', hex: '清新且优雅' }, + { label: '辣椒红', value: 'rgba(155, 35, 53, 0.9)', hex: '自信且迷人' } ], aboutDialogVisible: false }; @@ -194,11 +194,6 @@ let app = new Vue({ } }, customStyle() { - // this.showBox ? - // this.saveEditorContent(this.cssEditor, '__css_content') : - // this.cssEditor.setValue(localStorage.getItem('__css_content')); - // this.showBox = !this.showBox; - this.saveEditorContent(this.cssEditor, '__css_content'); this.showBox = !this.showBox; diff --git a/assets/scripts/themes/default-theme.js b/assets/scripts/themes/default-theme.js index 94c9e0e..b75e560 100644 --- a/assets/scripts/themes/default-theme.js +++ b/assets/scripts/themes/default-theme.js @@ -16,7 +16,7 @@ let default_theme = { 'display': 'table', 'margin': '2em auto 1em', 'padding': '0 1em', - 'border-bottom': '2px solid rgba(255, 95, 46, 0.9)' + 'border-bottom': '2px solid rgba(15, 76, 129, 0.9)' }, // 二级标题样式 @@ -27,7 +27,7 @@ let default_theme = { 'display': 'table', 'margin': '4em auto 2em', 'padding': '0 0.2em', - 'background': 'rgba(255, 95, 46, 0.9)', + 'background': 'rgba(15, 76, 129, 0.9)', 'color': '#fff' }, @@ -38,7 +38,7 @@ let default_theme = { 'margin': '2em 8px 0.75em 0', 'line-height': '1.2', 'padding-left': '8px', - 'border-left': '3px solid rgba(255, 95, 46, 0.9)' + 'border-left': '3px solid rgba(15, 76, 129, 0.9)' }, // 四级标题样式 @@ -144,7 +144,7 @@ let default_theme = { // 字体加粗样式 strong: { - 'color': 'rgba(255, 95, 46, 0.9)', + 'color': 'rgba(15, 76, 129, 0.9)', 'font-weight': 'bold', }, diff --git a/assets/scripts/util.js b/assets/scripts/util.js index 04bdd0d..e157fc3 100644 --- a/assets/scripts/util.js +++ b/assets/scripts/util.js @@ -7,7 +7,7 @@ function setColorWithTemplate(template) { 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; }; } @@ -98,7 +98,7 @@ function css2json(css) { }); // 继续下个声明块 - css = css.slice(rbracket + 1).trim() + css = css.slice(rbracket + 1).trim(); } // 返回JSON形式的结果串