Elevation token does not work for dark mode

[andre-bartak]

Which generators are impacted?

• All
• HTML
• React
• Angular
• Vue
• Web components
• Power Apps

Reproduction case

The --db-elevation tokens (like e.g. --db-elevation-md) seems to have a fixed dark color for the shadow.
In dark mode this shadow is not visible and the elevation does not work.

Compare to e.g. the shadow defined for .db-drawer .db-drawer-container:
https://design-system.deutschebahn.com/core-web/version/v2.0.4/components/layout/drawer/overview

Expected Behaviour

The elevation effect should be available in dark mode

Screenshots

No response

Browser version

None

Add any other context about the problem here.

No response

[nmerget]

@andre-bartak We don't provide a shadow for dark-mode, because it would look like a glow effect. Every component should have an additional border to seperate the content from other elements. Maybe @leape can answer this in detail

[leape]

@andre-bartak We don't provide a shadow for dark-mode, because it would look like a glow effect. Every component should have an additional border to seperate the content from other elements. Maybe @leape can answer this in detail

You've already summarized it well, Nico.
We work with an additional border in the popover, for example, to ensure separation from the layer behind it.

@nmerget in the drawer, however, the border is missing, i.e. we absolutely have to add it!

[andre-bartak]

Thanks for the feedback @nmerget @leape

A border would not work well with my use case. I use the elevation on cards for selected elements.

[leape]

@andre-bartak But you also use the checkbox, right? So the elevation is not the only indicator for the selection if I understand it correctly. From this perspective, the indicator for the selected card would be there for dark mode.

[andre-bartak]

You are right @leape , the elevation just enhances the selection which is already indicated by the checkbox.