-
Notifications
You must be signed in to change notification settings - Fork 8
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
feat!: Change naming approach of all typography tokens #1845
feat!: Change naming approach of all typography tokens #1845
Conversation
# Conflicts: # proprietary/tokens/src/components/ams/accordion.tokens.json # proprietary/tokens/src/components/ams/avatar.tokens.json # proprietary/tokens/src/components/ams/badge.tokens.json # proprietary/tokens/src/components/ams/blockquote.tokens.json # proprietary/tokens/src/components/ams/character-count.tokens.json # proprietary/tokens/src/components/ams/checkbox.tokens.json # proprietary/tokens/src/components/ams/date-input.tokens.json # proprietary/tokens/src/components/ams/description-list.tokens.json # proprietary/tokens/src/components/ams/error-message.tokens.json # proprietary/tokens/src/components/ams/field-set.tokens.json # proprietary/tokens/src/components/ams/heading.tokens.json # proprietary/tokens/src/components/ams/label.tokens.json # proprietary/tokens/src/components/ams/ordered-list.tokens.json # proprietary/tokens/src/components/ams/page-heading.tokens.json # proprietary/tokens/src/components/ams/pagination.tokens.json # proprietary/tokens/src/components/ams/paragraph.tokens.json # proprietary/tokens/src/components/ams/password-input.tokens.json # proprietary/tokens/src/components/ams/radio.tokens.json # proprietary/tokens/src/components/ams/search-field.tokens.json # proprietary/tokens/src/components/ams/select.tokens.json # proprietary/tokens/src/components/ams/skip-link.tokens.json # proprietary/tokens/src/components/ams/switch.tokens.json # proprietary/tokens/src/components/ams/table.tokens.json # proprietary/tokens/src/components/ams/text-area.tokens.json # proprietary/tokens/src/components/ams/text-input.tokens.json # proprietary/tokens/src/components/ams/time-input.tokens.json # proprietary/tokens/src/components/ams/top-task-link.tokens.json # proprietary/tokens/src/components/ams/unordered-list.tokens.json
# Conflicts: # proprietary/tokens/src/components/ams/accordion.tokens.json # proprietary/tokens/src/components/ams/blockquote.tokens.json # proprietary/tokens/src/components/ams/description-list.tokens.json # proprietary/tokens/src/components/ams/figure.tokens.json # proprietary/tokens/src/components/ams/heading.tokens.json # proprietary/tokens/src/components/ams/ordered-list.tokens.json # proprietary/tokens/src/components/ams/page-heading.tokens.json # proprietary/tokens/src/components/ams/paragraph.tokens.json # proprietary/tokens/src/components/ams/unordered-list.tokens.json
# Conflicts: # proprietary/tokens/src/components/ams/accordion.tokens.json # proprietary/tokens/src/components/ams/button.tokens.json # proprietary/tokens/src/components/ams/checkbox.tokens.json # proprietary/tokens/src/components/ams/file-input.tokens.json # proprietary/tokens/src/components/ams/radio.tokens.json # proprietary/tokens/src/components/ams/search-field.tokens.json # proprietary/tokens/src/components/ams/switch.tokens.json # proprietary/tokens/src/components/ams/tabs.tokens.json
# Conflicts: # proprietary/tokens/src/components/ams/link-list.tokens.json # proprietary/tokens/src/components/ams/link.tokens.json # proprietary/tokens/src/components/ams/page-menu.tokens.json # proprietary/tokens/src/components/ams/top-task-link.tokens.json
"font-size": { "value": "{ams.typography.body-text.xl.font-size}" }, | ||
"line-height": { "value": "{ams.typography.body-text.xl.line-height}" } |
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.
We agreed on body-text-small
, body-text-large
, heading-3
, heading-4
, heading-5
and heading-6
. We don’t see icons being combined with Headings 1 and 2 or extra large body text like Blockquote.
It’s become a hefty refactoring of the Icon and Icon Button components and the prop values aren’t the prettiest, but I think this is what needs to be expressed.
I’m replacing this PR with a fresh one. |
Describe the pull request
Thank you for contributing to the project!
Please use this template to help us handle your PR smoothly.
What
Refactors typography tokens:
ams.text
toams.typography
to match NLDSbody-text
andheading
groups to prepare for separate line height valuessize
prop of Icon and Icon Button to reflect that they may be paired with either a heading or body text component, whose line heights may differ even if their font sizes are the samefont-weight
token to Buttonfont-family
token from SwitchWhy
To implement a stable API of brand tokens for typography.
How
Meticulously.
Checklist
Before submitting your pull request, please ensure you have done the following. Check each checkmark if you have done so or if it wasn't necessary:
Additional notes