Component: Checkbox Card | Positive

swisspost / design-system

The Swiss Post Design System - for a consistent and accessible user experience across the web platform.

https://design-system.post.ch

Apache License 2.0

124 stars 14 forks source link

Closed wueestd closed 8 months ago

wueestd commented 1 year ago

Figma: https://www.figma.com/file/xZ0IW0MJO0vnFicmrHiKaY/Components-Post?type=design&node-id=22630%3A6660&mode=design&t=QO3UJm1A4wNRIAvt-1

Story Book: https://preview-2260--swisspost-design-system-next.netlify.app/?path=/docs/9637bbae-0533-4522-89d4-c2732431c69b--docs https://preview-2260--swisspost-design-system-next.netlify.app/?path=/docs/886fabcf-148b-4054-a2ec-4869668294fb--docs

Comments:

Cian77 commented 9 months ago

Hi @rouvenpost I made a review, following my feedback:

I think we should keep to the states as defined: I changed active to selected
From usability perspective, we should decide how to switch between positive and negative, so it's always the same.
By the Checkbox component we added a group, do we want to have this with this component?
I think, the error state will not be accessible as it is now.

gfellerph commented 9 months ago

The checkbox card is usually used with a nested form inside. @Cian77, do you have any idea about usability and accessibility of this pattern? The checkbox acts like an accordion, revealing the form if it's checked (unfinished preview here https://preview-2260--swisspost-design-system-next.netlify.app/?path=/docs/components-forms-card-control--docs#with-content).

Cian77 commented 9 months ago

Good question, I am not sure. For cases like that, I think we should have a budget, that we can get support by an AX specialist.

rouvenpost commented 9 months ago

The Design is Ready for Review

rouvenpost commented 9 months ago

The Active Hover States have ben added.

oliverschuerch commented 8 months ago

Looks ok to me. Nice job!