swisspost / design-system

The Swiss Post Design System pattern library for a consistent and accessible user experience across the web platform.
https://design-system.post.ch
Apache License 2.0
120 stars 14 forks source link

[list]: Add styles for component document list #3548

Open oliverschuerch opened 2 weeks ago

oliverschuerch commented 2 weeks ago

Description

Implement styles for the document list component

Design

https://www.figma.com/design/xZ0IW0MJO0vnFicmrHiKaY/Components-Post?node-id=30036-39980&node-type=frame&t=9S5ISrEjDt8dXCYT-0

Tokens

proposed tokennames with values list.item.padding.inline.start 16/16/16 list.item.padding.inline.end 12/12/12 list.item.padding.block.start 17/16/11 (could be build with center alignment) list.item.padding.block.end 16/15/10 (could be build with center alignment) list.item.inline.gap 16/16/8 list.item.icon.container.block.padding 3/0/2 list.item.icon.container.inline.padding 0/0/2 list.item.icon.size 24/24/20 list.item.border-width 1 list.item.border-style solid list.item.enabled-border sandgrey 100 list.item.hover-border sandgrey 070 list.item.focus.outline-style solid list.item.focus.outline-width 2 list.item.enabled-fg sandgrey 100 list.item.hover-fg sandgrey 070 list.item.focus.outline.offset 2

## Tasks
- [ ] Review Design (All states present? Possible to implement?)
- [ ] #3496
- [ ] #3437
- [ ] HTML/CSS implementation
- [ ] Documentation in Storybook
- [ ] Design review
Vandapanda commented 5 days ago

@gfellerph proposal for token names added.