Skip to content

fix: codeblock header border-radius#828

Open
4anghyeon wants to merge 1 commit intoTanStack:mainfrom
4anghyeon:fix/code-block-rounded
Open

fix: codeblock header border-radius#828
4anghyeon wants to merge 1 commit intoTanStack:mainfrom
4anghyeon:fix/code-block-rounded

Conversation

@4anghyeon
Copy link
Copy Markdown

@4anghyeon 4anghyeon commented Apr 15, 2026

Summary

The codeblock header is missing rounded-t-md, causing a visual inconsistency
between the container's border-radius and the header background.

Screenshots

Before After
스크린샷 2026-04-15 12 08 24 스크린샷 2026-04-15 12 08 38

Changes

  • Add rounded-t-md to the header element in CodeBlockView.tsx

Issue: #827

Summary by CodeRabbit

  • Style
    • Added rounded top corners to code block headers for improved visual presentation and consistency.

@netlify
Copy link
Copy Markdown

netlify bot commented Apr 15, 2026

👷 Deploy request for tanstack pending review.

Visit the deploys page to approve it

Name Link
🔨 Latest commit e04f68b

@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Apr 15, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 91ffd917-c808-4f1b-ae6e-d3578fd3fe5e

📥 Commits

Reviewing files that changed from the base of the PR and between 004be5c and e04f68b.

📒 Files selected for processing (1)
  • src/components/markdown/CodeBlockView.tsx

📝 Walkthrough

Walkthrough

The CodeBlockView component receives a styling enhancement with the addition of the rounded-t-md CSS class to the header container that renders conditionally when title or showTypeCopyButton is present.

Changes

Cohort / File(s) Summary
UI Styling Enhancement
src/components/markdown/CodeBlockView.tsx
Added rounded-t-md class to conditional header container for top-rounded border styling.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

Poem

🐰 A whisker-twitch of rounded grace,
The header bows with softer face,
No corners sharp, just curves so sweet,
This styling fix makes code complete!

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately describes the main change: adding rounded-t-md class to fix the codeblock header border-radius visual inconsistency.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

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