Fix code highlight rendering

Author: ruibaby

packages/comment-widget/src/base-comment-item.ts

@@ -121,7 +121,11 @@ export class BaseCommentItem extends LitElement {
         </div>
 
         <div class="item-content mt-2.5 space-y-2.5 content">
-          <slot name="pre-content"></slot>${unsafeHTML(sanitizeHtml(this.content))}
+          <slot name="pre-content"></slot>${unsafeHTML(
+            sanitizeHtml(this.content, {
+              allowedAttributes: { code: ['class'] },
+            })
+          )}
         </div>
 
         <div class="item-actions mt-2 flex items-center gap-3">

packages/comment-widget/src/reply-item.ts

@@ -159,7 +159,7 @@ export class ReplyItem extends LitElement {
                 slot="pre-content"
                 @mouseenter=${() => this.handleSetActiveQuoteReply(this.quoteReply)}
                 @mouseleave=${() => this.handleSetActiveQuoteReply()}
-                class="quote-badge cursor-pointer inline-flex items-center gap-1 px-2.5 py-2 rounded-base bg-muted-3 text-text-2 hover:-translate-y-0.5 hover:text-text-1 hover:bg-muted-2 transition-all text-xs font-medium"
+                class="quote-badge cursor-pointer inline-flex items-center gap-1 px-2 py-1.5 rounded-base bg-muted-3 text-text-2 hover:-translate-y-0.5 hover:text-text-1 hover:bg-muted-2 transition-all text-sm font-medium"
                 ><i class="i-ic:round-reply"></i><span>${this.quoteReply?.owner.displayName}</span>
               </span>
               <br slot="pre-content" />`