Skip to content

Enhance PR/issue detail views with syntax highlighting and UI polish#24

Merged
stylessh merged 1 commit into
mainfrom
stylessh/pr-detail-icons-fix
Apr 8, 2026
Merged

Enhance PR/issue detail views with syntax highlighting and UI polish#24
stylessh merged 1 commit into
mainfrom
stylessh/pr-detail-icons-fix

Conversation

@stylessh
Copy link
Copy Markdown
Owner

@stylessh stylessh commented Apr 8, 2026

Summary

  • Add shiki-based syntax highlighting to markdown code blocks with custom Vercel light/dark themes, per-block copy button, and React.use() + Suspense for flash-free rendering
  • Move issue labels from main column to sidebar with theme-aware .label-pill styling (darker in light mode, vibrant in dark mode)
  • Add icons to PR detail sidebar rows (calendar, clock, message, file, commit) and new CopyIcon/TickIcon exports
  • Restructure PR header with copyable branch badges (<button> with tooltip on copy) and inline state badge + author
  • Add diff boxes visualization to PR stats bar and shrink the +N -N text
  • Darken green-500 in light mode only, switch to Geist Mono Variable font with font-weight: 450 and tighter letter-spacing for all monospace text

Test plan

  • Verify syntax highlighting renders on PR/issue detail markdown code blocks (light + dark mode)
  • Confirm no flash of unstyled code on page load or navigation
  • Test copy button appears on hover over code blocks, copies content, shows checkmark
  • Verify copyable branch badges in PR header work and truncate correctly for long names
  • Check issue labels render in sidebar with correct colors in both themes
  • Confirm diff boxes and stats display correctly in PR stats bar

… polish

- Add shiki-based syntax highlighting to markdown code blocks with custom Vercel
  light/dark themes, copy button, and React Suspense for flash-free rendering
- Move issue labels to sidebar with theme-aware label pill styling
- Add icons to PR detail sidebar rows (calendar, clock, message, file, commit)
- Restructure PR header layout with copyable branch badges
- Add diff boxes visualization to PR stats bar
- Darken green-500 in light mode, switch to Geist Mono variable font
@stylessh stylessh merged commit 0d516fa into main Apr 8, 2026
1 of 2 checks passed
stylessh added a commit that referenced this pull request Apr 18, 2026
… polish (#24)

- Add shiki-based syntax highlighting to markdown code blocks with custom Vercel
  light/dark themes, copy button, and React Suspense for flash-free rendering
- Move issue labels to sidebar with theme-aware label pill styling
- Add icons to PR detail sidebar rows (calendar, clock, message, file, commit)
- Restructure PR header layout with copyable branch badges
- Add diff boxes visualization to PR stats bar
- Darken green-500 in light mode, switch to Geist Mono variable font
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant