Open oliverschuerch opened 2 weeks ago
Implement styles for the document list component
https://www.figma.com/design/xZ0IW0MJO0vnFicmrHiKaY/Components-Post?node-id=30036-39980&node-type=frame&t=9S5ISrEjDt8dXCYT-0
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
list.item.padding.inline.start
list.item.padding.inline.end
list.item.padding.block.start
list.item.padding.block.end
list.item.inline.gap
list.item.icon.container.block.padding
list.item.icon.container.inline.padding
list.item.icon.size
list.item.border-width
list.item.border-style
list.item.enabled-border
list.item.hover-border
list.item.focus.outline-style
list.item.focus.outline-width
list.item.enabled-fg
list.item.hover-fg sandgrey
list.item.focus.outline.offset
## Tasks - [ ] Review Design (All states present? Possible to implement?) - [ ] #3496 - [ ] #3437 - [ ] HTML/CSS implementation - [ ] Documentation in Storybook - [ ] Design review
@gfellerph proposal for token names added.
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/16list.item.padding.inline.end
12/12/12list.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/8list.item.icon.container.block.padding
3/0/2list.item.icon.container.inline.padding
0/0/2list.item.icon.size
24/24/20list.item.border-width
1list.item.border-style
solidlist.item.enabled-border
sandgrey 100list.item.hover-border
sandgrey 070list.item.focus.outline-style
solidlist.item.focus.outline-width
2list.item.enabled-fg
sandgrey 100list.item.hover-fg sandgrey
070list.item.focus.outline.offset
2