summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components/MkCode.vue
diff options
context:
space:
mode:
authorかっこかり <67428053+kakkokari-gtyih@users.noreply.github.com>2023-10-29 14:12:40 +0900
committerGitHub <noreply@github.com>2023-10-29 14:12:40 +0900
commit1a8243f1cace06c2eb872177d39536f76c9a8f5d (patch)
treed75937ed6b116a98e3139d98b34bea4344c86f3e /packages/frontend/src/components/MkCode.vue
parentenhance(frontend): tweak about-misskey page (diff)
downloadmisskey-1a8243f1cace06c2eb872177d39536f76c9a8f5d.tar.gz
misskey-1a8243f1cace06c2eb872177d39536f76c9a8f5d.tar.bz2
misskey-1a8243f1cace06c2eb872177d39536f76c9a8f5d.zip
MkCodeのパースエンジンをShikiに変更 (#12102)
* (swap) prism -> shiki * fix styles * (bump) aiscript-vscode to v0.0.5 * refactor * replace prism-editor (beta) * Update scratchpad.vue * (enhance) MkCodeEditor自動インデント改行 * (fix) lint * (add) scratchpad: MkStickyContainer * Update CHANGELOG.md * clean up --------- Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>
Diffstat (limited to 'packages/frontend/src/components/MkCode.vue')
-rw-r--r--packages/frontend/src/components/MkCode.vue21
1 files changed, 20 insertions, 1 deletions
diff --git a/packages/frontend/src/components/MkCode.vue b/packages/frontend/src/components/MkCode.vue
index 8972b1863b..b39e6ff23c 100644
--- a/packages/frontend/src/components/MkCode.vue
+++ b/packages/frontend/src/components/MkCode.vue
@@ -4,11 +4,18 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
-<XCode :code="code" :lang="lang" :inline="inline"/>
+ <Suspense>
+ <template #fallback>
+ <MkLoading v-if="!inline ?? true" />
+ </template>
+ <code v-if="inline" :class="$style.codeInlineRoot">{{ code }}</code>
+ <XCode v-else :code="code" :lang="lang"/>
+ </Suspense>
</template>
<script lang="ts" setup>
import { defineAsyncComponent } from 'vue';
+import MkLoading from '@/components/global/MkLoading.vue';
defineProps<{
code: string;
@@ -18,3 +25,15 @@ defineProps<{
const XCode = defineAsyncComponent(() => import('@/components/MkCode.core.vue'));
</script>
+
+<style module lang="scss">
+.codeInlineRoot {
+ display: inline-block;
+ font-family: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace;
+ overflow-wrap: anywhere;
+ color: #D4D4D4;
+ background: #1E1E1E;
+ padding: .1em;
+ border-radius: .3em;
+}
+</style>