Skip to content

feat(twake-css,twake-mui): material 3 elevation 3 shadow - #216

Open
Crash-- wants to merge 1 commit into
linagora:mainfrom
Crash--:feat/design-elevation
Open

Crash-- wants to merge 1 commit into
linagora:mainfrom
Crash--:feat/design-elevation

Conversation

@Crash--

@Crash-- Crash-- commented Oct 28, 2026

Copy link
Copy Markdown
Contributor

Adds the Material 3 elevation 3 shadow that the Teammail 1.1 mockup puts on docked windows, as theme.vars.elevation.level3 and --twake-elevation-level3. It sits outside the cozy-ui shadow ramp, so existing shadows keep their values. Black in both modes, as Material 3 draws it.

Elevation 3 next to the ramp

The design lifts docked windows with Material 3's elevation 3, which the
cozy-ui shadow ramp has no level for. It comes as its own token,
theme.vars.elevation.level3 and the --twake-elevation-level3 variable,
so the ramp keeps its values. Black in both modes, as Material 3 draws it.
@coderabbitai

coderabbitai Bot commented Oct 28, 2026

Copy link
Copy Markdown

Warning

Review limit reached

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

Next included review available in 59 minutes.

Check out review usage here.

View limit details

Limit details: You’ve used the included review currently available.

Learn how review limits work.

Review configuration:

Run configuration
  • Source mode: Auto
  • Repository: Unavailable
  • Branch: Unavailable
  • File: No configuration file from this repository applied
  • Commit: Unavailable
  • Layers: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: 8cc8f015-4829-4139-8103-3f6c32c577b7
Commits

Reviewing files that changed from the base of the PR and between 504e86c and 23c5a24.

Files selected for processing: 5
  • packages/twake-css/src/stories/CssVariables.tsx
  • packages/twake-css/src/vars.scss
  • packages/twake-mui/src/lib/makeShadows.ts
  • packages/twake-mui/src/lib/makeTheme.ts
  • packages/twake-mui/src/lib/types.ts
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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

Comment @coderabbitai help to get the list of available commands.

@JF-Cozy

JF-Cozy commented Oct 28, 2026 •

Copy link
Copy Markdown
Collaborator
image

this is weird to put it there. .u-* are classes, --twake-elevation is a css var 🤔

@JF-Cozy JF-Cozy left a comment •

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

to be consistent we should use u-* for "elevation" as well... and rename the previous ones in u-shadow probably.

Be careful with this "foot in the door" approach, MUI v9 still rely on M2, so if we want to add more and more stuff from M3, we probably should separate them to avoid a mix and mess inside Mui overrides... it would ease the upgrade in v9+.

And why not adding level1 and level2?

And finally, could we use something from shadows instead? There are 25 shades...

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants