[FE fix] Improve trace output styling

[ardaerzin]

Summary

fixes the reported issue:

The outputs in tracing when strings are shown with grey background (even in markdown) we should simply use white background like in pretty

Testing

QA follow-up

check the trace output information in the drawer

Checklist

• I have included a video or screen recording for UI changes, or marked Demo as N/A
• Relevant tests pass locally
• Relevant linting and formatting pass locally
• I have signed the CLA, or I will sign it when the bot prompts me

Contributor Resources

• Contributing guide
• Creating your first PR
• Development mode
• Testing
• Formatting and linting
• Slack support

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
agenta-documentation	Ready	Preview, Comment	May 28, 2026 8:07pm

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 5833dffd-a67e-444f-8ebf-9f4e1c311063

📥 Commits

Reviewing files that changed from the base of the PR and between 57a499c and 3ae4398.

📒 Files selected for processing (1)

• web/oss/src/components/DrillInView/TraceSpanDrillInView.tsx

---

📝 Walkthrough

Summary by CodeRabbit

• Style
  • Updated background colors and visual styling in the trace viewer.
  • Refined editor UI appearance with improved typography and layout adjustments.

Walkthrough

This PR updates Tailwind styling in the TraceSpanDrillInView component. The editor provider's className selector is revised with updated border, rounding, and internal spacing/background/typography styles, and the text/markdown mode wrapper background color changes from light gray to white.

Changes

Styling Updates

Layer / File(s)	Summary
Editor and wrapper container styling web/oss/src/components/DrillInView/TraceSpanDrillInView.tsx	TextModeViewer editor className Tailwind selectors are updated, and the wrapper container <div> background changes from bg-[#F6F8FB] to bg-white.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change: styling improvements to trace output rendering in the frontend, specifically updating background colors and typography in the text/markdown view.
Description check	✅ Passed	The description is directly related to the changeset, explaining the specific issue (grey background in trace outputs) and the fix (white background to match the pretty view), with appropriate QA testing notes.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

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

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fe-fix/trace-output-styling

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[coderabbitai]

Actionable comments posted: 0

[github-actions]

Railway Preview Environment

Status	Destroyed (PR closed)

Updated at 2026-05-28T21:00:12.541Z