operational-ui icon indicating copy to clipboard operation
operational-ui copied to clipboard

RFC: Focus and hover styles on ContextMenuItems

Open TejasQ opened this issue 5 years ago • 7 comments

I feel the current style of focus and hover of ContextMenuItem is a little too out of place. It's bright and blue and attracts too much attention.

image

For these reasons, I propose restyling the hover/focus states to be the following:

Hover

image

Focus

image

If we agree, I'll go ahead and open a PR with changes that implement this adjustment.

RFC @kemal-contiamo @micha-f @contiamo/frontend

TejasQ avatar Jun 23 '19 05:06 TejasQ

I feel the current style of focus and hover of ContextMenuItem is a little too out of place. It's bright and blue and attracts too much attention.

image

For these reasons, I propose restyling the hover/focus states to be the following:

Hover

image

Focus

image

If we agree, I'll go ahead and open a PR with changes that implement this adjustment.

RFC @kemal-contiamo @micha-f @contiamo/frontend

@TejasQ would your proposed changes effecting all dropdown regardless of where they're being used?

kemal-contiamo avatar Jun 24 '19 05:06 kemal-contiamo

Yes. Please be aware that this is how all dropdowns looked before.

TejasQ avatar Jun 24 '19 07:06 TejasQ

@TejasQ I like the subtleness, but I would prefer to keep what's already being designed (the new one). One of the main reason is that we have this combo-dropdown (with custom text field) - look at the background color of the "custom": Screenshot 2019-06-24 at 09 28 06

The other reason is that I am deliberately making our focus and hover state a bit "catchy", so that it is more usable (think of users that don't have such a good eyes like ours ;)).

kemal-contiamo avatar Jun 24 '19 07:06 kemal-contiamo

I hear what you're saying, but bigger list items look a little weird: see the second example here. What do we do in this case?

TejasQ avatar Jun 24 '19 08:06 TejasQ

I hear what you're saying, but bigger list items look a little weird: see the second example here. What do we do in this case?

Is it weird because of its narrow width you mean? Screenshot 2019-06-24 at 10 05 37 or weird because the way focus and hover state looks in those menu?

kemal-contiamo avatar Jun 24 '19 08:06 kemal-contiamo

Weird because it's super blue there but not super blue here even though they're conceptually the same thing.

TejasQ avatar Jun 24 '19 08:06 TejasQ

@kemal-contiamo what conclusion did we come to here?

TejasQ avatar Jun 25 '19 09:06 TejasQ