vanilla-framework icon indicating copy to clipboard operation
vanilla-framework copied to clipboard

Component state audit and improvements

Open lyubomir-popov opened this issue 3 years ago • 3 comments

lyubomir-popov avatar Oct 06 '22 08:10 lyubomir-popov

Color state audit

Problems

  • The active state color is dependent on component size when it comes to visual weight.
  • Gray is often associated with disabled components. Issue shows in segmented controls that are limited to 2 choices.
Screen Shot 2022-10-07 at 10 35 32 AM

Solutions Available

Solution A: Adjustment of existing color down to 7% from 10%

Screen Shot 2022-10-07 at 10 48 37 AM

Solution B: Color move from gray to light blue.

Screen Shot 2022-10-07 at 11 29 18 AM

Cross-comparison of solutions

Screen Shot 2022-10-07 at 10 53 10 AM
Links

Figma Link

camillet16 avatar Oct 07 '22 07:10 camillet16

Samples:

Screen Shot 2022-10-07 at 11 25 33 AM

Screen Shot 2022-10-07 at 11 26 08 AM

camillet16 avatar Oct 07 '22 08:10 camillet16

@lyubomir-popov worked on exploring lighter options and landed here sorry I only got to update today. Would appreciate quick feedback on this. Thank you.

camillet16 avatar Oct 07 '22 08:10 camillet16