Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

chore: WDS adjust neutral subtle colors (#40595)

Browse Source 
## Description

Fixes #39932

| Before | After |
|--------|--------|
| <img width="674" alt="Screenshot 2025-05-07 at 10 38 06"
src="https://github.com/user-attachments/assets/052adffd-7d90-47c2-95ea-cc15e4fa89b1"
/> | <img width="676" alt="Screenshot 2025-05-07 at 10 36 39"
src="https://github.com/user-attachments/assets/80056605-1bda-4c02-ad4f-8827f93bc2ca"
/> |

## Automation

/ok-to-test tags="@tag.Sanity"

### 🔍 Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!IMPORTANT]
> 🟣 🟣 🟣 Your tests are running.
> Tests running at:
<https://github.com/appsmithorg/appsmith/actions/runs/14879153124>
> Commit: f691f26b504269eaaa960626392789db7ff7f0f3
> Workflow: `PR Automation test suite`
> Tags: `@tag.Sanity`
> Spec: ``
> <hr>Wed, 07 May 2025 08:48:38 UTC
<!-- end of auto-generated comment: Cypress test results  -->


## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [x] No


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **Style**
- Adjusted the brightness of subtle neutral background and foreground
colors in light mode for improved visual appearance.

- **Tests**
- Updated expected color values in tests to match the new brightness
adjustments.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
vadim 2025-05-07 12:06:40 +02:00 committed by GitHub
parent b7a2f5c261
commit c57cc56775
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/client/packages/design-system/theming/src/color/src/LightModeTheme.ts
View File

@ -413,7 +413,7 @@ export class LightModeTheme implements ColorModeTheme {
} }
if (!this.seedIsVeryLight) { if (!this.seedIsVeryLight) {
color.oklch.l = 0.97; color.oklch.l = 0.975;
} }
if (this.seedChroma > 0.002) { if (this.seedChroma > 0.002) {
@ -785,7 +785,7 @@ export class LightModeTheme implements ColorModeTheme {
private get fgNeutralSubtle() { private get fgNeutralSubtle() {
const color = this.fgNeutral.clone(); const color = this.fgNeutral.clone();
color.oklch.l += 0.12; color.oklch.l += 0.1;
return color; return color;
} }

12
app/client/packages/design-system/theming/src/color/tests/LightModeTheme.test.ts
View File

@ -358,7 +358,7 @@ describe("bgNeutralSubtle color", () => {
"oklch(0.92 0.03 170)", "oklch(0.92 0.03 170)",
).getColors(); ).getColors();
expect(bgNeutralSubtle).toEqual("rgb(95.592% 96.251% 95.981%)"); expect(bgNeutralSubtle).toEqual("rgb(96.247% 96.906% 96.636%)");
}); });
it("should return correct color when seedChroma > 0.01", () => { it("should return correct color when seedChroma > 0.01", () => {
@ -366,7 +366,7 @@ describe("bgNeutralSubtle color", () => {
"oklch(0.92 0.1 170)", "oklch(0.92 0.1 170)",
).getColors(); ).getColors();
expect(bgNeutralSubtle).toEqual("rgb(95.592% 96.251% 95.981%)"); expect(bgNeutralSubtle).toEqual("rgb(96.247% 96.906% 96.636%)");
}); });
it("should return correct color when chroma < 0.04", () => { it("should return correct color when chroma < 0.04", () => {
@ -374,7 +374,7 @@ describe("bgNeutralSubtle color", () => {
"oklch(0.92 0.03 170)", "oklch(0.92 0.03 170)",
).getColors(); ).getColors();
expect(bgNeutralSubtle).toEqual("rgb(95.592% 96.251% 95.981%)"); expect(bgNeutralSubtle).toEqual("rgb(96.247% 96.906% 96.636%)");
}); });
}); });
@ -384,7 +384,7 @@ describe("bgNeutralSubtleHover color", () => {
"oklch(0.92 0.1 170)", "oklch(0.92 0.1 170)",
).getColors(); ).getColors();
expect(bgNeutralSubtleHover).toEqual("rgb(97.164% 97.825% 97.554%)"); expect(bgNeutralSubtleHover).toEqual("rgb(97.82% 98.482% 98.21%)");
}); });
}); });
@ -394,7 +394,7 @@ describe("bgNeutralSubtleActive color", () => {
"oklch(0.92 0.1 170)", "oklch(0.92 0.1 170)",
).getColors(); ).getColors();
expect(bgNeutralSubtleActive).toEqual("rgb(94.286% 94.944% 94.674%)"); expect(bgNeutralSubtleActive).toEqual("rgb(94.939% 95.597% 95.327%)");
}); });
}); });
@ -692,7 +692,7 @@ describe("fgNeutralSubtle color", () => {
"oklch(0.45 0.03 60)", "oklch(0.45 0.03 60)",
).getColors(); ).getColors();
expect(fgNeutralSubtle).toEqual("rgb(43.337% 43.337% 43.337%)"); expect(fgNeutralSubtle).toEqual("rgb(41.086% 41.086% 41.086%)");
}); });
}); });