Skip to content

Dark theme fixes#3285

Merged
yurishkuro merged 3 commits into
mainfrom
dark-theme-background
Jan 2, 2026
Merged

Dark theme fixes#3285
yurishkuro merged 3 commits into
mainfrom
dark-theme-background

Conversation

@yurishkuro
Copy link
Copy Markdown
Member

@yurishkuro yurishkuro commented Jan 2, 2026

Which problem is this PR solving?

Description of the changes

Fix dark theme readability and layout issues in TracePage

  • SpanDetail & Sub-components: Replaced hardcoded colors (backgrounds, borders, and text) with theme-aware CSS variables in SpanDetailRow, KeyValuesTable, AccordianLogs, and other detail views to ensure text readability in dark mode.
  • Theming: Added centralized syntax highlighting tokens to vars.css for JSON and key-value displays, and updated TraceTimelineViewer to use them.
  • Timeline Header:
    • Made the --surface-tertiary background opaque to prevent content from bleeding through the sticky header.
    • Fixed a 1px transparent gap at the top of TimelineHeaderRow using a CSS pseudo-element to mask sub-pixel rounding issues during scrolling.
  • Search Bar:
    • Improved contrast for navigation icons (locate, up, down) and the search 'clear' icon in dark theme.
    • Overrode Ant Design's default disabled button styles to ensure they remain visible against dark backgrounds.

Signed-off-by: Yuri Shkuro <[email protected]>
Signed-off-by: Yuri Shkuro <[email protected]>
Signed-off-by: Yuri Shkuro <[email protected]>
@yurishkuro yurishkuro requested a review from a team as a code owner January 2, 2026 17:52
@yurishkuro yurishkuro requested review from jkowall and removed request for a team January 2, 2026 17:52
@yurishkuro yurishkuro added the changelog:bugfix-or-minor-feature 🐞 Bug fixes, Minor Improvements label Jan 2, 2026
@codecov
Copy link
Copy Markdown

codecov Bot commented Jan 2, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 97.42%. Comparing base (7ea5367) to head (20cb950).
⚠️ Report is 1 commits behind head on main.

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #3285   +/-   ##
=======================================
  Coverage   97.42%   97.42%           
=======================================
  Files         266      266           
  Lines        8297     8297           
  Branches     2166     2195   +29     
=======================================
  Hits         8083     8083           
  Misses        211      211           
  Partials        3        3           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@yurishkuro yurishkuro merged commit 4412cd4 into main Jan 2, 2026
12 checks passed
@yurishkuro yurishkuro deleted the dark-theme-background branch January 2, 2026 17:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

changelog:bugfix-or-minor-feature 🐞 Bug fixes, Minor Improvements

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug]: Dark mode in v2.14.0 is unreadable

1 participant