style(LivePreviewEditor): 为代码块首尾行添加圆角样式

为代码块的第一行和最后一行添加特定的 CSS 类名（`cm-md-fenced-code-start` 和 `cm-md-fenced-code-end`），并在编辑器的主题样式中为这些类应用圆角边框和额外的内边距，以提升视觉层次感和美观度。

src/codemirror/liveMarkdownDecorations.js

@@ -311,14 +311,19 @@ const buildDecorations = (state, filePath) => {
          const startLine = doc.lineAt(nodeFrom)
          const endLine = doc.lineAt(nodeTo)
          const cursorInBlock = isCursorInRange(state, nodeFrom, nodeTo)
-         const blockClass = cursorInBlock ? 'cm-md-fenced-code cm-active' : 'cm-md-fenced-code'
+         const baseClass = cursorInBlock ? 'cm-md-fenced-code cm-active' : 'cm-md-fenced-code'
 
          for (let l = startLine.number; l <= endLine.number; l++) {
            const lineInfo = doc.line(l)
+           let lineClass = baseClass
+           
+           if (l === startLine.number) lineClass += ' cm-md-fenced-code-start'
+           if (l === endLine.number) lineClass += ' cm-md-fenced-code-end'
+           
            decorations.push({
              from: lineInfo.from,
              to: lineInfo.from,
-             value: Decoration.line({ class: blockClass })
+             value: Decoration.line({ class: lineClass })
            })
          }
       }

src/components/LivePreviewEditor.vue

@@ -232,6 +232,17 @@ const liveEditorTheme = computed(() => {
         paddingLeft: "16px",
         fontSize: "0.9em",
       },
+      // 代码块圆角处理
+      ".cm-line.cm-md-fenced-code-start": {
+        borderTopLeftRadius: "8px",
+        borderTopRightRadius: "8px",
+        paddingTop: "6px",
+      },
+      ".cm-line.cm-md-fenced-code-end": {
+        borderBottomLeftRadius: "8px",
+        borderBottomRightRadius: "8px",
+        paddingBottom: "6px",
+      },
       ".cm-line.cm-md-fenced-code.cm-active": {
         backgroundColor: "var(--hover-background)",
         outline: "1px solid var(--border-color)",