[tile item]: states background edit

[AyalaBu]

In option, nav-item & menu the states are looking wrong and the component background should be changed to look like this:

Hover state background should be neutral 50 Selected state background should be neutral 100 Pressed state background should be neutral 200

The components in the picture are in these states (from up to down):

1. Hover
2. Selected
3. Pressed

[yinonov]

appearance should be extracted to be defined via design tokens. Can you POC this in the background while we hardcode it in development?

[yinonov]

In option, nav-item & menu the states are looking wrong:

Hover state should be neutral 50 Selected state should be neutral 100 Pressed state should be neutral 200

This description and title doesn't tell much on the required action. please describe in detail

[rachelbt]

In option, nav-item & menu the states are looking wrong: Hover state should be neutral 50 Selected state should be neutral 100 Pressed state should be neutral 200

This description and title doesn't tell much on the required action. please describe in detail

also @AyalaBu take in mine that the states that you point out here are the state that we are using for ghost appearance - and it will effect other components, like button

[AyalaBu]

@rachelbt I am aware of that, it should be changed in other "ghost-like" components as well to these colors, so that it all be consistent

[AyalaBu]

@rachelbt @yinonov The original issue request has been edited 👆🏽

[rachelbt]

@AyalaBu are you sure? like - in the docs side navigation - the selected suppose to be accent, no?

[AyalaBu]

@rachelbt The thing is that if it is neutral 1000 background here then it has to be the same in other tile components, isn't it? Like checkbox item, or menu item.

[rachelbt]

followed the Figma file: https://www.figma.com/file/JJNgZvt1qf3ydYmOwbE3Jg/branch/rph75WFEwg1PWwaY0bVDL4/Vivid-UI-Kit---3.0-WIP?node-id=19383%3A121797&t=4nZOxPVYhGrEBGDF-0

@AyalaBu, you can check here: https://vivid-x0gcy0wcwpc0.deno.dev/components/menu-item

[AyalaBu]

@rachelbt Looking fabulous!

[rachelbt]

@AyalaBu @yinonov if we change the color - should we add the primary option as we did here: https://vivid.vonage.com/?path=/story/components-list-list-item--connotation&args=connotation:primary;activated:;shape:rounded;graphic:icon;twoline: if so - we will do it in a separated PR

[github-actions[bot]]

This issue is stale because it has been open for 30 days with no activity.

[github-actions[bot]]

This issue was closed because it has been inactive for 14 days since being marked as stale.