ni / nimble

The NI Nimble Design System
https://nimble.ni.dev
MIT License
29 stars 8 forks source link

Add chip/tag background color token #2040

Closed fredvisser closed 2 months ago

fredvisser commented 2 months ago

Pull Request

🤨 Rationale

Bug 2718212: sl-details-item-keywords chip background color is too similar to section bg color in light theme

…requires this new Nimble token.

👩‍💻 Implementation

Ultimately used the same token values as cardBorderColor: Light: 10% Black91 Dark: 10% Black15 Color: 10% White

Tag preview

Screenshot 2024-04-26 at 11 56 36 AM Screenshot 2024-04-26 at 11 59 58 AM Screenshot 2024-04-26 at 12 00 46 PM

(Note, I'll fix the missing font-color token issue in my SystemLinkShared changes as well)

🧪 Testing

Visual review

✅ Checklist

fredvisser commented 2 months ago

@NIbokeefe - Are these the correct color values for this use case (tags in the details panel)?

NIbokeefe commented 2 months ago

@NIbokeefe - Are these the correct color values for this use case (tags in the details panel)?

@fredvisser Yes, those are the correct chip color tags. However we should sync about the shape of the chips which is not correct.

fredvisser commented 2 months ago

Resolved the shape and the color in: Pull Request 708737: Update sl-details-item-keywords component to use tag-fill-color token