feat: 添加Markdown渲染支持并增强UI功能

- 引入markdown-it库实现节点内容和摘要的Markdown渲染
- 添加多种边类型选择功能(直线/曲线/折线等)
- 实现全屏模式切换功能
- 优化底部工具栏和节点输入框的样式
- 更新i18n多语言支持新增功能文本
This commit is contained in:
liuziting
2026-01-21 22:43:48 +08:00
parent 843b6d08be
commit 1b9deed3a7
11 changed files with 272 additions and 20 deletions

View File

@@ -29,3 +29,72 @@ body {
width: 100%;
margin: 0 auto;
}
/* Markdown 渲染基础样式 */
.markdown-body {
@apply text-slate-700;
}
.markdown-body h1 {
@apply text-lg font-black mt-4 mb-2 text-slate-900;
}
.markdown-body h2 {
@apply text-base font-black mt-3 mb-2 text-slate-900;
}
.markdown-body h3 {
@apply text-sm font-black mt-2 mb-1 text-slate-800;
}
.markdown-body p {
@apply mb-2 last:mb-0;
}
.markdown-body ul, .markdown-body ol {
@apply pl-4 mb-2 list-outside;
}
.markdown-body ul {
@apply list-disc;
}
.markdown-body ol {
@apply list-decimal;
}
.markdown-body li {
@apply mb-1;
}
.markdown-body code {
@apply px-1 py-0.5 bg-slate-100 rounded text-[0.9em] font-mono text-orange-600;
}
.markdown-body pre {
@apply p-3 bg-slate-900 text-slate-100 rounded-lg overflow-x-auto mb-3 font-mono text-[0.85em];
}
.markdown-body blockquote {
@apply pl-3 border-l-4 border-slate-200 text-slate-500 italic mb-2;
}
.markdown-body a {
@apply text-orange-500 hover:underline;
}
.markdown-body table {
@apply w-full border-collapse mb-3;
}
.markdown-body th, .markdown-body td {
@apply border border-slate-200 p-2 text-left;
}
.markdown-body th {
@apply bg-slate-50 font-bold;
}
.markdown-body hr {
@apply my-4 border-t border-slate-100;
}