| 8 | |
| 9 | // Simple markdown to HTML converter |
| 10 | function parseMarkdown(markdown: string): string { |
| 11 | let html = markdown; |
| 12 | |
| 13 | // Escape HTML entities first |
| 14 | html = html |
| 15 | .replace(/&/g, "&") |
| 16 | .replace(/</g, "<") |
| 17 | .replace(/>/g, ">"); |
| 18 | |
| 19 | // Code blocks with syntax highlighting hint |
| 20 | html = html.replace( |
| 21 | /```(\w*)\n([\s\S]*?)```/g, |
| 22 | (_, lang, code) => |
| 23 | `<pre style="background-color: var(--background); border-radius: 0.5rem; padding: 1rem; overflow-x: auto; margin: 1rem 0;"><code style="font-size: 0.875rem; font-family: monospace; color: var(--accent);" data-lang="${lang}">${code.trim()}</code></pre>` |
| 24 | ); |
| 25 | |
| 26 | // Inline code |
| 27 | html = html.replace( |
| 28 | /`([^`]+)`/g, |
| 29 | '<code style="background-color: var(--background); color: var(--accent); padding: 0.125rem 0.375rem; border-radius: 0.25rem; font-size: 0.875rem; font-family: monospace;">$1</code>' |
| 30 | ); |
| 31 | |
| 32 | // Headers |
| 33 | html = html.replace( |
| 34 | /^### (.+)$/gm, |
| 35 | '<h3 style="font-size: 1.125rem; font-weight: 600; color: var(--text-primary); margin-top: 1.5rem; margin-bottom: 0.75rem;">$1</h3>' |
| 36 | ); |
| 37 | html = html.replace( |
| 38 | /^## (.+)$/gm, |
| 39 | '<h2 style="font-size: 1.25rem; font-weight: bold; color: var(--text-primary); margin-top: 2rem; margin-bottom: 1rem;">$1</h2>' |
| 40 | ); |
| 41 | html = html.replace( |
| 42 | /^# (.+)$/gm, |
| 43 | '<h1 style="font-size: 1.5rem; font-weight: bold; color: var(--text-primary); margin-top: 2rem; margin-bottom: 1rem;">$1</h1>' |
| 44 | ); |
| 45 | |
| 46 | // Bold and italic |
| 47 | html = html.replace( |
| 48 | /\*\*(.+?)\*\*/g, |
| 49 | '<strong style="font-weight: bold;">$1</strong>' |
| 50 | ); |
| 51 | html = html.replace(/\*(.+?)\*/g, '<em style="font-style: italic;">$1</em>'); |
| 52 | html = html.replace( |
| 53 | /__(.+?)__/g, |
| 54 | '<strong style="font-weight: bold;">$1</strong>' |
| 55 | ); |
| 56 | html = html.replace(/_(.+?)_/g, '<em style="font-style: italic;">$1</em>'); |
| 57 | |
| 58 | // Links |
| 59 | html = html.replace( |
| 60 | /\[([^\]]+)\]\(([^)]+)\)/g, |
| 61 | '<a href="$2" style="color: var(--accent);" target="_blank" rel="noopener noreferrer">$1</a>' |
| 62 | ); |
| 63 | |
| 64 | // Blockquotes |
| 65 | html = html.replace( |
| 66 | /^> (.+)$/gm, |
| 67 | '<blockquote style="border-left: 4px solid var(--accent); padding-left: 1rem; padding-top: 0.25rem; padding-bottom: 0.25rem; margin: 0.5rem 0; color: var(--text-secondary); font-style: italic;">$1</blockquote>' |