search

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
106 stars 13 forks source link

Optimize Dropdown #1501

Closed wueestd closed 7 months ago

wueestd commented 11 months ago

https://www.figma.com/file/xZ0IW0MJO0vnFicmrHiKaY/Components-Post?type=design&node-id=12639%3A60344&t=Oc7lhYg2E5NGXV35-1

wueestd commented 11 months ago

@rouvenpost I updated the Figma components, have a look

gfellerph commented 10 months ago

@wueestd, the Design looks good, but from a dev viewpoint we have multiple components here. One is a menu for navigation or toolbars, one is a select menu where you make choices for a form and we might even extract a base dropdown component that provides the functionality of displaying a panel below an element. Development needs more investigation.

I created a ticket for investigating development approaches: https://github.com/swisspost/design-system/issues/1610

gfellerph commented 10 months ago

approved, @wueestd

wueestd commented 10 months ago

When combining the component with other components (especially small buttons) I find it to be very oversized. what do you think @gfellerph & @rouvenpost ? https://www.figma.com/file/xZ0IW0MJO0vnFicmrHiKaY/Components-Post?type=design&node-id=12775%3A61376&mode=design&t=7oqrnfHBJ8pn1R7p-1

should we make it a bit smaller (e.g. 14px font size and some smaller spacings) or should we maintaint two versions?

gfellerph commented 8 months ago

I think two versions would be good, then we have dedicated support for internal applications.

rouvenpost commented 8 months ago

Creating two Sizes for the Dropdown Menu.... including smaller Checkboxes and Radioboxes: https://github.com/swisspost/design-system/issues/1861

rouvenpost commented 8 months ago

Ready for Review

gfellerph commented 8 months ago

@rouvenpost and @wueestd, the Design looks good. I'd like to discuss https://github.com/swisspost/design-system/discussions/1888 however because for development a dropdown where you can select options is something different than a dropdown with buttons/links that directly call an action. There are also different accessibility requirements for the two.

gfellerph commented 8 months ago
gfellerph commented 7 months ago

Dev tickets will be created after naming resolution for a bunch of new components in https://www.figma.com/file/hPSc0je4Pwa8pL0PLnfmrS/Component-Naming?type=whiteboard&node-id=0%3A1&t=0DkA2N6Wx8EbP0Z1-1