amass/md
1
0
Fork 0
mirror of https://github.com/doocs/md.git synced 2024-11-24 19:10:34 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: update code style

Browse Source 
* 统一代码风格
* 修复超链接问题
* 新增待办列表
This commit is contained in:
yanglbme 2020-06-25 17:20:37 +08:00
parent 1f07dd39c6
commit cecd7dde55
17 changed files with 1010 additions and 969 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
README.md
View File

@ -43,6 +43,9 @@ Markdown 文档自动即时渲染为微信图文，让你不再为微信文章
- [x] 支持自定义 CSS 样式并实时渲染 - [x] 支持自定义 CSS 样式并实时渲染
- [x] 支持一键恢复至默认内容及样式 - [x] 支持一键恢复至默认内容及样式
- [x] 支持打开或关闭引用链接的选项 - [x] 支持打开或关闭引用链接的选项
- [ ] 新建右键点击菜单栏
- [ ] 插入表格功能优化
![select-and-change-color-theme](https://imgkr.cn-bj.ufileos.com/32c05c23-6309-491f-bd0d-f22a62c944b4.gif) ![select-and-change-color-theme](https://imgkr.cn-bj.ufileos.com/32c05c23-6309-491f-bd0d-f22a62c944b4.gif)

21
public/assets/css/app.css
View File

@ -4,11 +4,18 @@
padding: 0; padding: 0;
} }
input, button, textarea { input,
button,
textarea {
font-family: inherit; font-family: inherit;
} }
h1, h2, h3, h4, h5, h6 { h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: normal; font-weight: normal;
} }
@ -16,7 +23,8 @@ em {
font-style: normal !important; font-style: normal !important;
} }
html, body { html,
body {
height: 100%; height: 100%;
font-family: 'PingFang SC', BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif; font-family: 'PingFang SC', BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif;
} }
@ -112,6 +120,7 @@ section {
display: table; display: table;
width: 100% !important; width: 100% !important;
} }
/* /*
.preview table tr:nth-child(even){ .preview table tr:nth-child(even){
background: rgb(250, 250, 250); background: rgb(250, 250, 250);
@ -146,7 +155,8 @@ section {
} }
/*wechat code block*/ /*wechat code block*/
.rich_media_content .code-snippet *, .rich_media_content .code-snippet__fix * { .rich_media_content .code-snippet *,
.rich_media_content .code-snippet__fix * {
max-width: 1000% !important; max-width: 1000% !important;
} }
@ -228,7 +238,8 @@ section {
outline: none; outline: none;
} }
.CodeMirror-scroll, .preview-wrapper { .CodeMirror-scroll,
.preview-wrapper {
overflow: unset; overflow: unset;
overflow-y: scroll; overflow-y: scroll;
} }

22
public/assets/css/style-mirror.css
View File

@ -15,32 +15,40 @@
padding: 20px; padding: 20px;
line-height: 25px; line-height: 25px;
} }
.cm-s-style-mirror div.CodeMirror-selected { .cm-s-style-mirror div.CodeMirror-selected {
background: #e0e0e0; background: #e0e0e0;
} }
.cm-s-style-mirror .CodeMirror-line::selection, .cm-s-style-mirror .CodeMirror-line::selection,
.cm-s-style-mirror .CodeMirror-line>span::selection, .cm-s-style-mirror .CodeMirror-line>span::selection,
.cm-s-style-mirror .CodeMirror-line>span>span::selection { .cm-s-style-mirror .CodeMirror-line>span>span::selection {
background: #e0e0e0; background: #e0e0e0;
} }
.cm-s-style-mirror .CodeMirror-line::-moz-selection, .cm-s-style-mirror .CodeMirror-line::-moz-selection,
.cm-s-style-mirror .CodeMirror-line>span::-moz-selection, .cm-s-style-mirror .CodeMirror-line>span::-moz-selection,
.cm-s-style-mirror .CodeMirror-line>span>span::-moz-selection { .cm-s-style-mirror .CodeMirror-line>span>span::-moz-selection {
background: #e0e0e0; background: #e0e0e0;
} }
.cm-s-style-mirror .CodeMirror-gutters { .cm-s-style-mirror .CodeMirror-gutters {
background: #f5f5f5; background: #f5f5f5;
border-right: 0px; border-right: 0px;
} }
.cm-s-style-mirror .CodeMirror-guttermarker { .cm-s-style-mirror .CodeMirror-guttermarker {
color: #ac4142; color: #ac4142;
} }
.cm-s-style-mirror .CodeMirror-guttermarker-subtle { .cm-s-style-mirror .CodeMirror-guttermarker-subtle {
color: #b0b0b0; color: #b0b0b0;
} }
.cm-s-style-mirror .CodeMirror-linenumber { .cm-s-style-mirror .CodeMirror-linenumber {
color: #b0b0b0; color: #b0b0b0;
} }
.cm-s-style-mirror .CodeMirror-cursor { .cm-s-style-mirror .CodeMirror-cursor {
border-left: 1px solid #505050; border-left: 1px solid #505050;
} }
@ -48,9 +56,11 @@
.cm-s-style-mirror span.cm-comment { .cm-s-style-mirror span.cm-comment {
color: green; color: green;
} }
.cm-s-style-mirror span.cm-atom { .cm-s-style-mirror span.cm-atom {
color: #aa759f; color: #aa759f;
} }
.cm-s-style-mirror span.cm-number { .cm-s-style-mirror span.cm-number {
color: #aa759f; color: #aa759f;
} }
@ -59,9 +69,11 @@
.cm-s-style-mirror span.cm-attribute { .cm-s-style-mirror span.cm-attribute {
color: #90a959; color: #90a959;
} }
.cm-s-style-mirror span.cm-keyword { .cm-s-style-mirror span.cm-keyword {
color: #023a52; color: #023a52;
} }
.cm-s-style-mirror span.cm-string { .cm-s-style-mirror span.cm-string {
color: #e46918; color: #e46918;
} }
@ -69,24 +81,31 @@
.cm-s-style-mirror span.cm-variable { .cm-s-style-mirror span.cm-variable {
color: #90a959; color: #90a959;
} }
.cm-s-style-mirror span.cm-variable-2 { .cm-s-style-mirror span.cm-variable-2 {
color: #00695f; color: #00695f;
} }
.cm-s-style-mirror span.cm-variable-3 { .cm-s-style-mirror span.cm-variable-3 {
color: #2e6e8a; color: #2e6e8a;
} }
.cm-s-style-mirror span.cm-def { .cm-s-style-mirror span.cm-def {
color: #d28445; color: #d28445;
} }
.cm-s-style-mirror span.cm-bracket { .cm-s-style-mirror span.cm-bracket {
color: #202020; color: #202020;
} }
.cm-s-style-mirror span.cm-tag { .cm-s-style-mirror span.cm-tag {
color: #000; color: #000;
} }
.cm-s-style-mirror span.cm-link { .cm-s-style-mirror span.cm-link {
color: #b26a00; color: #b26a00;
} }
.cm-s-style-mirror span.cm-error { .cm-s-style-mirror span.cm-error {
/* background: #ac4142; /* background: #ac4142;
color: #f5f5f5; */ color: #f5f5f5; */
@ -94,11 +113,12 @@
text-decoration-style: wavy; text-decoration-style: wavy;
text-decoration-color: #df8d8e; text-decoration-color: #df8d8e;
} }
.cm-s-style-mirror .CodeMirror-activeline-background { .cm-s-style-mirror .CodeMirror-activeline-background {
background: #dddcdc; background: #dddcdc;
} }
.cm-s-style-mirror .CodeMirror-matchingbracket { .cm-s-style-mirror .CodeMirror-matchingbracket {
color: rgb(32, 32, 32) !important; color: rgb(32, 32, 32) !important;
background-color: rgba(0, 0, 0, 0.1) !important; background-color: rgba(0, 0, 0, 0.1) !important;
} }

BIN
public/favicon.ico
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 4.2 KiB

31
public/index.html
View File

@ -1,32 +1,4 @@
<!DOCTYPE html> <!DOCTYPE html>
<!--
_.._ ,------------.
,' `. ( 你终于发现我啦 )
/ __) __` \ `-,----------'
( (`-`(-') ) _.-'
/) \ = / (
/' |--' . \
( ,---| `-.)__`
)( `-.,--' _`-.
'/,' ( Uu",
(_ , `/,-' )
`.__, : `-'/ /`--'
| `--' |
` `-._ /
\ (
/\ . \.
/ |` \ ,-\
/ \| .) / \
( ,'|\ ,' :
| \,`.`--"/ }
`,' \ |,' /
/ "-._ `-/ |
"-. "-.,'| ;
/ _/["---'""]
: / |"- '
' | /
` |
-->
<html lang="en"> <html lang="en">
<head> <head>
@ -38,7 +10,8 @@
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>微信 Markdown 编辑器</title> <title>微信 Markdown 编辑器</title>
<link rel="shortcut icon" href="https://imgkr.cn-bj.ufileos.com/f3accc83-b854-4e99-afb5-8a6465e1d84f.png"> <link rel="shortcut icon" href="https://imgkr.cn-bj.ufileos.com/f3accc83-b854-4e99-afb5-8a6465e1d84f.png">
<link rel="apple-touch-icon-precomposed" href="https://imgkr.cn-bj.ufileos.com/f3accc83-b854-4e99-afb5-8a6465e1d84f.png"> <link rel="apple-touch-icon-precomposed"
href="https://imgkr.cn-bj.ufileos.com/f3accc83-b854-4e99-afb5-8a6465e1d84f.png">
<link rel="stylesheet" href="assets/css/loading.css"> <link rel="stylesheet" href="assets/css/loading.css">
<link rel="stylesheet" href="libs/css/index.css"> <link rel="stylesheet" href="libs/css/index.css">
<link rel="stylesheet" href="libs/css/code-themes/github-v2.min.css"> <link rel="stylesheet" href="libs/css/code-themes/github-v2.min.css">

22
public/libs/css/style-mirror.css
View File

@ -15,32 +15,40 @@
padding: 20px; padding: 20px;
line-height: 25px; line-height: 25px;
} }
.cm-s-style-mirror div.CodeMirror-selected { .cm-s-style-mirror div.CodeMirror-selected {
background: #e0e0e0; background: #e0e0e0;
} }
.cm-s-style-mirror .CodeMirror-line::selection, .cm-s-style-mirror .CodeMirror-line::selection,
.cm-s-style-mirror .CodeMirror-line>span::selection, .cm-s-style-mirror .CodeMirror-line>span::selection,
.cm-s-style-mirror .CodeMirror-line>span>span::selection { .cm-s-style-mirror .CodeMirror-line>span>span::selection {
background: #e0e0e0; background: #e0e0e0;
} }
.cm-s-style-mirror .CodeMirror-line::-moz-selection, .cm-s-style-mirror .CodeMirror-line::-moz-selection,
.cm-s-style-mirror .CodeMirror-line>span::-moz-selection, .cm-s-style-mirror .CodeMirror-line>span::-moz-selection,
.cm-s-style-mirror .CodeMirror-line>span>span::-moz-selection { .cm-s-style-mirror .CodeMirror-line>span>span::-moz-selection {
background: #e0e0e0; background: #e0e0e0;
} }
.cm-s-style-mirror .CodeMirror-gutters { .cm-s-style-mirror .CodeMirror-gutters {
background: #f5f5f5; background: #f5f5f5;
border-right: 0px; border-right: 0px;
} }
.cm-s-style-mirror .CodeMirror-guttermarker { .cm-s-style-mirror .CodeMirror-guttermarker {
color: #ac4142; color: #ac4142;
} }
.cm-s-style-mirror .CodeMirror-guttermarker-subtle { .cm-s-style-mirror .CodeMirror-guttermarker-subtle {
color: #b0b0b0; color: #b0b0b0;
} }
.cm-s-style-mirror .CodeMirror-linenumber { .cm-s-style-mirror .CodeMirror-linenumber {
color: #b0b0b0; color: #b0b0b0;
} }
.cm-s-style-mirror .CodeMirror-cursor { .cm-s-style-mirror .CodeMirror-cursor {
border-left: 1px solid #505050; border-left: 1px solid #505050;
} }
@ -48,9 +56,11 @@
.cm-s-style-mirror span.cm-comment { .cm-s-style-mirror span.cm-comment {
color: green; color: green;
} }
.cm-s-style-mirror span.cm-atom { .cm-s-style-mirror span.cm-atom {
color: #aa759f; color: #aa759f;
} }
.cm-s-style-mirror span.cm-number { .cm-s-style-mirror span.cm-number {
color: #aa759f; color: #aa759f;
} }
@ -59,9 +69,11 @@
.cm-s-style-mirror span.cm-attribute { .cm-s-style-mirror span.cm-attribute {
color: #90a959; color: #90a959;
} }
.cm-s-style-mirror span.cm-keyword { .cm-s-style-mirror span.cm-keyword {
color: #023a52; color: #023a52;
} }
.cm-s-style-mirror span.cm-string { .cm-s-style-mirror span.cm-string {
color: #e46918; color: #e46918;
} }
@ -69,24 +81,31 @@
.cm-s-style-mirror span.cm-variable { .cm-s-style-mirror span.cm-variable {
color: #90a959; color: #90a959;
} }
.cm-s-style-mirror span.cm-variable-2 { .cm-s-style-mirror span.cm-variable-2 {
color: #00695f; color: #00695f;
} }
.cm-s-style-mirror span.cm-variable-3 { .cm-s-style-mirror span.cm-variable-3 {
color: #2e6e8a; color: #2e6e8a;
} }
.cm-s-style-mirror span.cm-def { .cm-s-style-mirror span.cm-def {
color: #d28445; color: #d28445;
} }
.cm-s-style-mirror span.cm-bracket { .cm-s-style-mirror span.cm-bracket {
color: #202020; color: #202020;
} }
.cm-s-style-mirror span.cm-tag { .cm-s-style-mirror span.cm-tag {
color: #000; color: #000;
} }
.cm-s-style-mirror span.cm-link { .cm-s-style-mirror span.cm-link {
color: #b26a00; color: #b26a00;
} }
.cm-s-style-mirror span.cm-error { .cm-s-style-mirror span.cm-error {
/* background: #ac4142; /* background: #ac4142;
color: #f5f5f5; */ color: #f5f5f5; */
@ -94,11 +113,12 @@
text-decoration-style: wavy; text-decoration-style: wavy;
text-decoration-color: #df8d8e; text-decoration-color: #df8d8e;
} }
.cm-s-style-mirror .CodeMirror-activeline-background { .cm-s-style-mirror .CodeMirror-activeline-background {
background: #dddcdc; background: #dddcdc;
} }
.cm-s-style-mirror .CodeMirror-matchingbracket { .cm-s-style-mirror .CodeMirror-matchingbracket {
color: rgb(32, 32, 32) !important; color: rgb(32, 32, 32) !important;
background-color: rgba(0, 0, 0, 0.1) !important; background-color: rgba(0, 0, 0, 0.1) !important;
} }

1
src/components/Loading.vue
View File

@ -11,6 +11,7 @@
export default { export default {
} }
</script> </script>
<style scoped> <style scoped>

6
src/scripts/closebrackets.js
View File

@ -29,7 +29,11 @@ import CodeMirror from "codemirror/lib/codemirror";
return defaults[name]; return defaults[name];
} }
var keyMap = { Backspace: handleBackspace, Enter: handleEnter }; var keyMap = {
Backspace: handleBackspace,
Enter: handleEnter
};
function ensureBound(chars) { function ensureBound(chars) {
for (var i = 0; i < chars.length; i++) { for (var i = 0; i < chars.length; i++) {
var ch = chars.charAt(i), var ch = chars.charAt(i),

9
src/scripts/config.js
View File

@ -1,6 +1,5 @@
export default { export default {
builtinFonts: [ builtinFonts: [{
{
label: '无衬线', label: '无衬线',
value: '-apple-system-font,BlinkMacSystemFont, Helvetica Neue, PingFang SC, Hiragino Sans GB , Microsoft YaHei UI , Microsoft YaHei ,Arial,sans-serif' value: '-apple-system-font,BlinkMacSystemFont, Helvetica Neue, PingFang SC, Hiragino Sans GB , Microsoft YaHei UI , Microsoft YaHei ,Arial,sans-serif'
}, },
@ -9,8 +8,7 @@ export default {
value: "Optima-Regular, Optima, PingFangSC-light, PingFangTC-light, 'PingFang SC', Cambria, Cochin, Georgia, Times, 'Times New Roman', serif" value: "Optima-Regular, Optima, PingFangSC-light, PingFangTC-light, 'PingFang SC', Cambria, Cochin, Georgia, Times, 'Times New Roman', serif"
} }
], ],
sizeOption: [ sizeOption: [{
{
label: '12px', label: '12px',
value: '12px', value: '12px',
desc: '更小' desc: '更小'
@ -36,8 +34,7 @@ export default {
desc: '更大' desc: '更大'
} }
], ],
colorOption: [ colorOption: [{
{
label: '经典蓝', label: '经典蓝',
value: 'rgba(15, 76, 129, 1)', value: 'rgba(15, 76, 129, 1)',
hex: '最新流行' hex: '最新流行'

3
src/scripts/converter.js
View File

@ -18,8 +18,7 @@ export function solveHtml(nightMode = false) {
let html = element.innerHTML let html = element.innerHTML
let res = ""; let res = "";
res = juice.inlineContent( res = juice.inlineContent(
html, html, {
{
inlinePseudoElements: true, inlinePseudoElements: true,
preserveImportant: true preserveImportant: true
} }

26
src/scripts/format.js
View File

@ -10,13 +10,16 @@ import CodeMirror from "codemirror/lib/codemirror";
// Comment/uncomment the specified range // Comment/uncomment the specified range
CodeMirror.defineExtension('commentRange', function (isComment, from, to) { CodeMirror.defineExtension('commentRange', function (isComment, from, to) {
var cm = this; var curMode = CodeMirror.innerMode(cm.getMode(), cm.getTokenAt(from).state).mode var cm = this;
var curMode = CodeMirror.innerMode(cm.getMode(), cm.getTokenAt(from).state).mode
cm.operation(function () { cm.operation(function () {
if (isComment) { // Comment range if (isComment) { // Comment range
cm.replaceRange(curMode.commentEnd, to) cm.replaceRange(curMode.commentEnd, to)
cm.replaceRange(curMode.commentStart, from) cm.replaceRange(curMode.commentStart, from)
if (from.line == to.line && from.ch == to.ch) // An empty comment inserted - put cursor inside if (from.line == to.line && from.ch == to.ch) // An empty comment inserted - put cursor inside
{ cm.setCursor(from.line, from.ch + curMode.commentStart.length) } {
cm.setCursor(from.line, from.ch + curMode.commentStart.length)
}
} else { // Uncomment range } else { // Uncomment range
var selText = cm.getRange(from, to) var selText = cm.getRange(from, to)
var startIndex = selText.indexOf(curMode.commentStart) var startIndex = selText.indexOf(curMode.commentStart)
@ -47,11 +50,15 @@ import CodeMirror from "codemirror/lib/codemirror";
// Applies automatic formatting to the specified range // Applies automatic formatting to the specified range
CodeMirror.defineExtension('autoFormatRange', function (from, to) { CodeMirror.defineExtension('autoFormatRange', function (from, to) {
var cm = this var cm = this
var outer = cm.getMode(); var text = cm.getRange(from, to).split('\n') var outer = cm.getMode();
var text = cm.getRange(from, to).split('\n')
var state = CodeMirror.copyState(outer, cm.getTokenAt(from).state) var state = CodeMirror.copyState(outer, cm.getTokenAt(from).state)
var tabSize = cm.getOption('tabSize') var tabSize = cm.getOption('tabSize')
var out = ''; var lines = 0; var atSol = from.ch == 0 var out = '';
var lines = 0;
var atSol = from.ch == 0
function newline() { function newline() {
out += '\n' out += '\n'
atSol = true atSol = true
@ -62,14 +69,17 @@ import CodeMirror from "codemirror/lib/codemirror";
var stream = new CodeMirror.StringStream(text[i], tabSize) var stream = new CodeMirror.StringStream(text[i], tabSize)
while (!stream.eol()) { while (!stream.eol()) {
var inner = CodeMirror.innerMode(outer, state) var inner = CodeMirror.innerMode(outer, state)
var style = outer.token(stream, state); var cur = stream.current() var style = outer.token(stream, state);
var cur = stream.current()
stream.start = stream.pos stream.start = stream.pos
if (!atSol || /\S/.test(cur)) { if (!atSol || /\S/.test(cur)) {
out += cur out += cur
atSol = false atSol = false
} }
if (!atSol && inner.mode.newlineAfterToken && if (!atSol && inner.mode.newlineAfterToken &&
inner.mode.newlineAfterToken(style, cur, stream.string.slice(stream.pos) || text[i + 1] || '', inner.state)) { newline() } inner.mode.newlineAfterToken(style, cur, stream.string.slice(stream.pos) || text[i + 1] || '', inner.state)) {
newline()
}
} }
if (!stream.pos && outer.blankLine) outer.blankLine(state) if (!stream.pos && outer.blankLine) outer.blankLine(state)
if (!atSol) newline() if (!atSol) newline()
@ -77,7 +87,9 @@ import CodeMirror from "codemirror/lib/codemirror";
cm.operation(function () { cm.operation(function () {
cm.replaceRange(out, from, to) cm.replaceRange(out, from, to)
for (var cur = from.line + 1, end = from.line + lines; cur <= end; ++cur) { cm.indentLine(cur, 'smart') } for (var cur = from.line + 1, end = from.line + lines; cur <= end; ++cur) {
cm.indentLine(cur, 'smart')
}
cm.setSelection(from, cm.getCursor(false)) cm.setSelection(from, cm.getCursor(false))
}) })
}) })

1
src/scripts/util.js
View File

@ -99,6 +99,7 @@ export function customCssWithTemplate (jsonString, color, theme) {
*/ */
export function css2json(css) { export function css2json(css) {
// 移除CSS所有注释 // 移除CSS所有注释
let open, close;
while ( while (
(open = css.indexOf('/*')) !== -1 && (open = css.indexOf('/*')) !== -1 &&
(close = css.indexOf('*/')) !== -1 (close = css.indexOf('*/')) !== -1