fix(component): render comment line breaks and tag icon

src/components/CommentSection.vue

@@ -49,7 +49,7 @@ function renderCommentContent(text: string): string {
     const id = Number(refMatch[1])
     const quoted = comments.value.find((c) => c.id === id)
     const excerpt = quoted ? quoteExcerpt(quoted) : `评论 #${id}`
-    html += `<span class="comment-ref-tag">${escapeHtml(excerpt.replace(/\\</g, '<').replace(/\\>/g, '>'))}</span>`
+    html += `<span class="comment-ref-tag"><svg class="comment-ref-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="12" height="12" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" /></svg>${escapeHtml(excerpt.replace(/\\</g, '<').replace(/\\>/g, '>'))}</span>`
     rest = text.slice(refMatch[0].length)
   }
   const body = escapeHtml(rest.replace(/\\</g, '<').replace(/\\>/g, '>'))
@@ -342,6 +342,7 @@ onMounted(() => {
   color: var(--ac-text);
   line-height: 22px;
   word-break: break-word;
+  white-space: pre-line;
 }
 
 .comment-star {
@@ -406,7 +407,9 @@ onMounted(() => {
 }
 
 :deep(.comment-ref-tag) {
-  display: block;
+  display: flex;
+  align-items: center;
+  gap: 4px;
   width: fit-content;
   padding: 0 8px;
   margin-bottom: 6px;
@@ -418,6 +421,10 @@ onMounted(() => {
   line-height: 20px;
 }
 
+:deep(.comment-ref-icon) {
+  flex-shrink: 0;
+}
+
 .quote-preview {
   display: flex;
   align-items: center;