style(编辑器): 为行内代码添加样式并移除文本装饰

- 为行内代码添加等宽字体、背景色和圆角样式,提升可读性
- 移除 CodeMirror 特定元素下的文本装饰线,保持界面整洁
This commit is contained in:
cfq 2026-01-26 18:25:33 +08:00
parent b550b8b603
commit d5d594fb7f
2 changed files with 22 additions and 0 deletions

View File

@ -368,6 +368,15 @@ const buildDecorations = (view, filePath) => {
})
}
// 5.3 行内代码 (InlineCode)
if (typeName === 'InlineCode') {
decorations.push({
from: nodeFrom,
to: nodeTo,
value: Decoration.mark({ class: 'cm-md-monospace' })
})
}
// 6. 链接 (Link) -> LinkMark, URL, LinkTitle...
// 结构通常是: Link( [ LinkMark( [ ) ... LinkMark( ] ) LinkMark( ( ) URL ... LinkMark( ) ) ] )
// 我们希望在非编辑状态下:隐藏所有 LinkMark 和 URL只显示 Link 文本

View File

@ -134,6 +134,15 @@ const liveEditorTheme = computed(() => {
paddingLeft: '4px'
},
//
'.cm-md-monospace': {
fontFamily: monospaceFont,
backgroundColor: 'var(--hover-background)',
padding: '2px 4px',
borderRadius: '4px',
fontSize: '0.9em'
},
//
'.cm-line.cm-md-fenced-code': {
fontFamily: monospaceFont,
@ -284,4 +293,8 @@ onUnmounted(() => {
overflow: hidden;
background: var(--card-background);
}
:deep(.ͼ7) {
text-decoration: none;
}
</style>