-
Notifications
You must be signed in to change notification settings - Fork 844
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[EuiToken] Updated tokenTag
design
#5553
Conversation
Preview documentation changes for this PR: https://eui.elastic.co/pr_5553/ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This PR LGTM 👍
I just noticed one thing while checking across the themes. It looks like Amsterdam has a higher border-radius than the legacy theme. I think this higher border radius makes it harder to distinguish between square and circle outer shapes. Would you mind bumping this radius down to be the same for both themes?
0359607
to
c9d4a81
Compare
Preview documentation changes for this PR: https://eui.elastic.co/pr_5553/ |
Thanks @cchaos, the border radius is now the same in both themes. I updated the screenshots on the PR description to reflect these changes. 👍🏽 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thank you! You might want to add a CL item for the lower radius as well. I think that now that Amsterdam is default, we don't need to put Amsterdam specific style updates under a specific header anymore.
Preview documentation changes for this PR: https://eui.elastic.co/pr_5553/ |
Summary
This PR updated the
tokenTag
design to look more like a tag. Closes #5520.The
tokenTag
is currently not being used in our products so this gives us an opportunity to update the design without causing any harm.After a few iterations, trying to design a new token icon to represent a semantic version we decided to use the
tokenTag
. But without the right context, the old design didn't look like a tag. So we decided to update it.Design
For the design, I basically used the old token. But now it has a more rectangular shape to look more like a tag. Also, I removed the inner rectangle and replaced it with a circle.
Light and dark themes
Checklist