feat: render code blocks in issue titles

Author: zxt-tzx

packages/web/src/components/IssueCard.tsx

@@ -140,15 +140,22 @@ function IssueTitleWithLabels({ issue }: { issue: Issue }) {
     );
   };
 
+  const processTitle = (title: string) => {
+    return title.replace(/`([^`]+)`/g, "<code>$1</code>");
+  };
+
   return (
     <div className="min-w-0 grow text-lg font-semibold">
       <a
         href={issue.issueUrl}
         target="_blank"
         rel="noopener noreferrer"
-        className="text-foreground hover:text-primary"
+        className="text-foreground hover:text-primary [&_code]:rounded [&_code]:bg-muted [&_code]:px-1.5 [&_code]:py-0.5"
       >
-        <span className="[word-break:break-word]">{issue.title}</span>
+        <span
+          className="[word-break:break-word]"
+          dangerouslySetInnerHTML={{ __html: processTitle(issue.title) }}
+        />
       </a>
       {issue.labels && issue.labels.length > 0 && (
         <span className="ml-2 inline-flex gap-2">