fix: 改进 diff 查看器样式和 markdown 渲染

static/css/style.css

@@ -16,8 +16,12 @@
 .prose ul, .prose ol {
     margin-left: 1.5em;
     margin-bottom: 1em;
+    padding-left: 0.5em;
+}
+.prose li {
+    margin-bottom: 0.25em;
+    overflow-wrap: break-word;
 }
-.prose li { margin-bottom: 0.25em; }
 .prose code {
     background: #f3f4f6;
     padding: 0.15em 0.4em;
@@ -68,6 +72,7 @@
     border-radius: 8px;
     overflow: hidden;
     min-height: 400px;
+    max-width: 100%;
 }
 
 .diff-sidebar {
@@ -81,8 +86,10 @@
 
 .diff-main {
     flex: 1;
+    min-width: 0;
     overflow: auto;
     max-height: 80vh;
+    max-width: 100%;
 }
 
 /* File tree */
@@ -176,6 +183,19 @@
 /* Review inline suggestion cards */
 .review-suggestion-card {
     font-size: 13px;
+    overflow: hidden;
+}
+
+/* Summary content container */
+#summary-content {
+    overflow-wrap: break-word;
+    word-break: break-word;
+}
+
+/* Review content in suggestion cards */
+.review-content {
+    overflow-wrap: break-word;
+    word-break: break-word;
 }
 
 .review-suggestion-row td {
@@ -221,3 +241,96 @@
     border-radius: 50%;
     animation: spin 0.6s linear infinite;
 }
+
+/* Force diff2html light mode — prevent dark empty placeholders and backgrounds */
+.d2h-emptyplaceholder,
+.d2h-code-side-emptyplaceholder {
+    background-color: #f1f1f1 !important;
+    border-color: #e1e1e1 !important;
+}
+
+.d2h-file-wrapper {
+    border-color: #ddd !important;
+}
+
+.d2h-file-header {
+    background-color: #f7f7f7 !important;
+    border-bottom-color: #d8d8d8 !important;
+}
+
+/* Line number td: override absolute→static so it participates in table flow */
+/* Side-by-side: 4em (matches diff2html original) */
+td.d2h-code-side-linenumber {
+    position: static !important;
+    background-color: #fff !important;
+    border-color: #eee !important;
+    color: rgba(0, 0, 0, 0.3) !important;
+    text-align: right !important;
+    white-space: nowrap !important;
+    padding: 0 0.5em 0 0 !important;
+    width: 4em !important;
+    min-width: 4em !important;
+    max-width: 4em !important;
+}
+/* Unified: 7.5em (needs room for two line numbers) */
+td.d2h-code-linenumber {
+    position: static !important;
+    background-color: #fff !important;
+    border-color: #eee !important;
+    color: rgba(0, 0, 0, 0.3) !important;
+    text-align: right !important;
+    white-space: nowrap !important;
+    width: 7.5em !important;
+    min-width: 7.5em !important;
+    max-width: 7.5em !important;
+}
+
+.d2h-del {
+    background-color: #fee8e9 !important;
+}
+
+.d2h-ins {
+    background-color: #dfd !important;
+}
+
+.d2h-info {
+    background-color: #f8fafd !important;
+    color: rgba(0, 0, 0, 0.3) !important;
+}
+
+#diff-container {
+    overflow: hidden;
+    max-width: 100%;
+}
+
+.d2h-files-diff {
+    width: 100% !important;
+    max-width: 100% !important;
+}
+
+.d2h-file-side-diff {
+    width: 50% !important;
+    max-width: 50% !important;
+    overflow-x: auto !important;
+}
+
+/* Diff table: full width, auto layout */
+.d2h-diff-table {
+    width: 100% !important;
+}
+
+/* Code cells fill remaining width after line number column */
+.d2h-file-side-diff td:not(.d2h-code-side-linenumber) {
+    width: auto !important;
+}
+
+/* Code line fills the cell */
+.d2h-code-side-line {
+    padding: 0 !important;
+    width: 100% !important;
+    display: block !important;
+}
+/* Collapse whitespace between prefix and content spans */
+.d2h-code-line-prefix {
+    white-space: normal !important;
+}

static/js/diff-viewer.js

@@ -774,7 +774,7 @@ const DiffViewer = {
                     <div class="flex items-center gap-2 mb-1">
                         <span class="text-xs font-medium">${severityLabels[severity] || severityLabels.info}</span>
                     </div>
-                    <p class="text-sm text-gray-700">${content}</p>
+                    <div class="text-sm text-gray-700 review-content">${typeof renderMarkdown === 'function' ? renderMarkdown(content) : content}</div>
                     <div class="mt-2 note-editor-placeholder" data-scope="suggestion" data-scope-key="${suggestionId || ''}"></div>
                 </div>
             </td>`;

static/js/review-inline.js

@@ -66,7 +66,7 @@ const ReviewInline = {
                     ${suggestion.file ? `<span class="text-xs text-gray-500 font-mono">${suggestion.file}</span>` : ''}
                     ${suggestion.line ? `<span class="text-xs text-gray-400">行 ${suggestion.line}</span>` : ''}
                 </div>
-                <div class="text-sm text-gray-700 review-content">${suggestion.content || ''}</div>
+                <div class="text-sm text-gray-700 review-content">${typeof renderMarkdown === 'function' ? renderMarkdown(suggestion.content || '') : (suggestion.content || '')}</div>
                 ${suggestion.code_example ? `
                     <pre class="mt-2 p-2 bg-gray-100 rounded text-xs overflow-x-auto"><code>${this._escapeHtml(suggestion.code_example)}</code></pre>
                 ` : ''}