story(sbb-card): initial implementation

[OkanBostan]

Feature Description

We want to implement the card design.

Figma Spec

Design Spec

• No special considerations

Technical Spec

• Content should be provided via unnamed slot
• Provide <slot name="badge"> for a <sbb-card-badge>
  • Hide/Remove the slot for sizes below m
• Provide property size with the appropriate sizes. Default to m.
• The card is an interactive element and should implement the LinkButtonProperties interface

Definition of Done

• Component is implemented
• Documentation is added
• Tests are implemented
• E2E Tests are implemented
• Storybook stories are implemented
• Navigation via keyboard is tested
• Screen reader output is tested
• High-contrast is tested
• Remaining accessibility is tested
• UX approved

[osminaz]

Top-padding of the card should change, whenever there is a sbb-card-badge. Should this be in the scope of this issue?

[sebastiencloss]

Will be made by Team-Lynx.

[sebastiencloss]

We won't need it for now:

Minaz Osman
Hey General, do somebody know, why we need the sbb-card component? Intuitively I would keep the sbb-card as a mixin and handle the sizes and the card-badge in the component where it is needed. (From my point of view, the card-badge will only be used for the timetable-row)
​
Spirig Lukas
We certainly want to implement/provide a generic sbb-card. If there is no need from sbb.ch side, we will however reduce priority.