diff options
author | Felix NĂ¼sse <felix.nuesse@t-online.de> | 2022-10-03 21:25:41 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-10-03 21:25:41 +0300 |
commit | 99421aab78731ce2473c7bf10d470d889008fb47 (patch) | |
tree | 24e8fe639216521da12a8135ccdfe2054188bde6 /src/components/EditorMarkdownIt.vue | |
parent | b265a3b243e97336b5894cc0a886947068fe3b95 (diff) |
improve code-blocks style
Diffstat (limited to 'src/components/EditorMarkdownIt.vue')
-rw-r--r-- | src/components/EditorMarkdownIt.vue | 31 |
1 files changed, 24 insertions, 7 deletions
diff --git a/src/components/EditorMarkdownIt.vue b/src/components/EditorMarkdownIt.vue index 6a053571..48545f0d 100644 --- a/src/components/EditorMarkdownIt.vue +++ b/src/components/EditorMarkdownIt.vue @@ -49,6 +49,8 @@ export default { created() { this.setImageRule(this.noteid) + + this.setInlineCodeRule() this.onUpdate() }, @@ -143,6 +145,13 @@ export default { } } }, + + setInlineCodeRule() { + this.md.renderer.rules.code_inline = function(tokens, idx, options, env, self) { + const token = tokens[idx] + return '<code class="inline-code">' + token.content + '</code>' + } + }, }, } @@ -204,13 +213,6 @@ export default { color: var(--color-primary-element); } - & pre, & code { - background: var(--color-background-dark); - font-size: 90%; - padding: 0.2ex 0.5ex; - white-space: pre-wrap; - } - & pre code { font-size: inherit; padding: 0; @@ -294,5 +296,20 @@ export default { & table td:empty::after { content: '\00a0'; } + + pre { + border-radius: 10px; + padding: 15px; + background: var(--color-background-dark); + font-size: 90%; + white-space: pre-wrap; + } + + .inline-code { + border-radius: 8px; + padding: 3px 8px; + background: var(--color-background-dark); + font-size: 85%; + } } </style> |