[card] Card looks like a paragraph when using white app background with Aura

[sissbruecker]

Description

When using a white app background in the Aura theme, then a card looks just like a paragraph of text:

In comparison, this is how it looks with the default background:

Expected outcome

I would expect a card to be recognizable as a card.

Minimal reproducible example

Use the Card dev page and add this style:

html {
  --aura-background-color-light: white;
}

Steps to reproduce

See above

Environment

Vaadin version(s): 25

Browsers

No response

[jouni]

One option is to use a --aura-surface-level: -1; by default. And maybe have a light border by default as well, and then have the outlined variant apply a stronger border color.

[yuriy-fix]

Decision from the discussion:

• For the documentation, we should ensure that Aura samples match the Aura default background colour. (immediate change)
  • Docs styles should be fixed to accommodate the changes
• Card should remain clearly visible on a white background, and Aura-styled components in general should also be evaluated to be recognisable on a white background. (scheduled for later)