Tabs - Build Discovery - Githubissues

SeamusLeonardHPE commented 2 weeks ago

Working in the v2 library apply tokens to the tabs component.

https://www.figma.com/design/5NUO23O2mDjiulO2H0S2Os/v2-Construction-Site?node-id=2164-2232

[x] Create branch specific to this issue
[x] Replace existing styles with tokens
[x] Note any missing tokens or unused tokens related to state

vavalos5 commented 2 weeks ago

Focus hpe.color.focus token not working properly

Icon Color When I was changing the icon color, I was confused on when to use hpe.color.icon.xweak vs hpe.color.icon.disabled . Despite reading the definition we've got on our site, I was still unsure on which one to use.

When do I apply icon color vs button icon color? I suppose I might need a bit more education on semantic/component and when/how to apply.

Text Styles

Text styles haven't been created into token, so having to break it, apply Metric 2 HPE and correct font-weight took a little longer.
Ensuring I was applying the correct font-weight took time as I had to refer to our token values for font-weights.
Can't group change text styles (seems like a Figma limitation)

Gap Unsure whether i'm using the correct spacing for grouped tabs. I used spacing hpe.spacing.none

Others Overall, pretty easy to apply by searching the token name on library panel.

Wondering when transparent stroke would be applied?

SeamusLeonardHPE commented 1 week ago

Linking to branch https://www.figma.com/design/f64po8pohL7ub95iIZabSt/%234242---Apply-tokens-to-Tabs?node-id=2164-2232

Will review and add feedback asap

grommet / hpe-design-system

Tabs - Build Discovery #4242