chore: WDS elevation colors refinement

[ichik]

Closes #29421

Summary by CodeRabbit

• Style
  • Enhanced the visual contrast in Dark Mode by adjusting background elevation colors for improved readability.
  • Refined Light Mode background colors for better visual hierarchy based on lightness conditions.
  • Updated shadow effects on UI components to provide a more pronounced depth and focus.

[coderabbitai]

Walkthrough

Walkthrough

The changes involve fine-tuning the theming system for a design system, specifically the dark and light mode themes. Adjustments were made to the lightness values in color schemes and shadow visibility in component styling. These refinements aim to improve the visual consistency and adaptability of UI components under different themes and conditions.

Changes

File Path	Change Summary
.../theming/src/color/src/DarkModeTheme.ts .../theming/src/color/src/LightModeTheme.ts	Adjusted lightness increments for bgElevation methods and refined conditional logic for modifying lightness values based on seedIsVeryLight.
.../design-system/widgets/src/testing/Elevation.tsx	Changed boxShadow property value from "var(--box-shadow-1)" to "var(--box-shadow-3)".
.../theming/src/color/tests/LightModeTheme.test.ts	Updated RGB color values being tested in various scenarios.

Assessment against linked issues

Objective	Addressed	Explanation
Lightness checks for seed properties	✅	The changes in DarkModeTheme.ts and LightModeTheme.ts directly address this objective by adjusting lightness values based on specific conditions.
Condition for visibility of shadows	✅	The change in Elevation.tsx directly addresses this objective by modifying the shadow effect applied to the component.
Extending to more semantics	❌	The provided summaries do not mention extensions to more semantics such as accent, neutral, etc.

Related issues

• appsmithorg/appsmith#29421: The changes in the PR could be related to this issue as it discusses fine-tuning of the elevation system in the design system, which is similar to the adjustments made in the DarkModeTheme.ts and LightModeTheme.ts files. The PR might address considerations for lightness checks and shadow visibility, which are mentioned in the issue.

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on X ?

---

Tips

Chat with CodeRabbit Bot (@coderabbitai)

• You can reply to a review comment made by CodeRabbit.
• You can tag CodeRabbit on specific lines of code or files in the PR by tagging @coderabbitai in a comment.
• You can tag @coderabbitai in a PR comment and ask one-off questions about the PR and the codebase. Use quoted replies to pass the context for follow-up questions.

CodeRabbit Commands (invoked as PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger a review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• The JSON schema for the configuration file is available here.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/coderabbit-overrides.v2.json

[ichik]

@KelvinOm @jsartisan we're doing tests here for different hues, because we used to rotate focus hue based on accent, but we have removed that in favor of simpler logic. Should we just remove or simplify these tests?

[KelvinOm]

We will need the tests for refactoring this code. Now, when we change the code, we need to make changes to the tests. This is expected.