Skip to content

FLPATH-4272 | [DCM] Hardcoded colors may break dark mode#3336

Open
asmasarw wants to merge 2 commits into
redhat-developer:mainfrom
asmasarw:fix/FLPATH-4272
Open

FLPATH-4272 | [DCM] Hardcoded colors may break dark mode#3336
asmasarw wants to merge 2 commits into
redhat-developer:mainfrom
asmasarw:fix/FLPATH-4272

Conversation

@asmasarw

@asmasarw asmasarw commented Jun 9, 2026

Copy link
Copy Markdown
Contributor

Replace hardcoded colors and shadows with theme-aware values for dark mode support.

  • ProviderStatus: chip border now uses theme.palette.divider instead of rgba(0,0,0,0.2)
  • CopyButton: "copied" checkmark color now uses theme.palette.success.main instead of #28a745
  • dcmStyles: overview card box-shadow is suppressed in dark mode via theme.palette.type check

@asmasarw asmasarw requested review from a team, jkilzi and mareklibra as code owners June 9, 2026 10:59
@rhdh-gh-app

rhdh-gh-app Bot commented Jun 9, 2026

Copy link
Copy Markdown

Changed Packages

Package Name Package Path Changeset Bump Current Version
@red-hat-developer-hub/backstage-plugin-dcm workspaces/dcm/plugins/dcm patch v1.0.0

@codecov

codecov Bot commented Jun 9, 2026

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 66.66667% with 1 line in your changes missing coverage. Please review.
✅ Project coverage is 54.00%. Comparing base (0239de6) to head (51219a3).
⚠️ Report is 7 commits behind head on main.
✅ All tests successful. No failed tests found.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #3336      +/-   ##
==========================================
- Coverage   54.01%   54.00%   -0.02%     
==========================================
  Files        2402     2403       +1     
  Lines       87402    87607     +205     
  Branches    24207    24292      +85     
==========================================
+ Hits        47212    47309      +97     
- Misses      38694    38789      +95     
- Partials     1496     1509      +13     
Flag Coverage Δ *Carryforward flag
adoption-insights 83.58% <ø> (ø) Carriedforward from 0755878
ai-integrations 70.03% <ø> (ø) Carriedforward from 0755878
app-defaults 69.60% <ø> (ø) Carriedforward from 0755878
augment 46.39% <ø> (ø) Carriedforward from 0755878
bulk-import 72.86% <ø> (ø) Carriedforward from 0755878
cost-management 17.48% <ø> (ø) Carriedforward from 0755878
dcm 59.62% <66.66%> (-1.61%) ⬇️
extensions 62.24% <ø> (ø) Carriedforward from 0755878
global-floating-action-button 74.30% <ø> (ø) Carriedforward from 0755878
global-header 61.63% <ø> (ø) Carriedforward from 0755878
homepage 51.52% <ø> (ø) Carriedforward from 0755878
install-dynamic-plugins 56.23% <ø> (ø) Carriedforward from 0755878
konflux 91.01% <ø> (ø) Carriedforward from 0755878
lightspeed 68.52% <ø> (ø) Carriedforward from 0755878
mcp-integrations 85.46% <ø> (ø) Carriedforward from 0755878
orchestrator 37.33% <ø> (ø) Carriedforward from 0755878
quickstart 62.09% <ø> (ø) Carriedforward from 0755878
sandbox 79.56% <ø> (ø) Carriedforward from 0755878
scorecard 83.84% <ø> (ø) Carriedforward from 0755878
theme 64.54% <ø> (ø) Carriedforward from 0755878
translations 8.49% <ø> (ø) Carriedforward from 0755878
x2a 78.79% <ø> (ø) Carriedforward from 0755878

*This pull request uses carry forward flags. Click here to find out more.


Continue to review full report in Codecov by Harness.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 0239de6...51219a3. Read the comment docs.

🚀 New features to boost your workflow:
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@mareklibra mareklibra left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Besides of the comment about isDarkMode(), it would be good to find other occurances difficult for the dark mode.

Hint: CatalogItemFormFields.tsx (background)

But there might be others

borderRadius: theme.shape.borderRadius,
boxShadow: '0 1px 2px rgba(0, 0, 0, 0.06)',
boxShadow:
theme.palette.type === 'dark'

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In a previous PR, a isDarkMode() function has been added. It would be good to reuse it here instead

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice Catch :)

@sonarqubecloud

Copy link
Copy Markdown

@asmasarw asmasarw requested a review from mareklibra June 10, 2026 08:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants