-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Add composite text
and font-letter-spacing
tokens
#10647
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
Conversation
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.
Super slick how you set this up 🔥✨💯🚢 🎉
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.
Amazing 🙌
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 was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @shopify/polaris-tokens@7.11.0 ### Minor Changes - [#10647](#10647) [`f26cebe99`](f26cebe) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Added composite `text` and `font-letter-spacing` tokens - [#10643](#10643) [`2359e5f5a`](2359e5f) Thanks [@lgriffee](https://github.com/lgriffee)! - Added semantic `space` token scale ## @shopify/polaris-migrator@0.22.6 ### Patch Changes - Updated dependencies \[[`f26cebe99`](f26cebe), [`2359e5f5a`](2359e5f)]: - @shopify/polaris-tokens@7.11.0 - @shopify/stylelint-polaris@14.0.6 ## @shopify/polaris@11.20.1 ### Patch Changes - [#10665](#10665) [`22dbada34`](22dbada) Thanks [@chloerice](https://github.com/chloerice)! - Fixed `Modal` missing `FrameContext` error - [#10663](#10663) [`f6a965102`](f6a9651) Thanks [@chloerice](https://github.com/chloerice)! - Reverted disabling of `Page` `secondaryActions` when `IndexFilters` is in filter `mode` - [#10649](#10649) [`3bafbea50`](3bafbea) Thanks [@mattkubej](https://github.com/mattkubej)! - Replace usages of `bg-secondary-experimental` with `bg-subdued` for Tables - Updated dependencies \[[`f26cebe99`](f26cebe), [`2359e5f5a`](2359e5f)]: - @shopify/polaris-tokens@7.11.0 ## @shopify/stylelint-polaris@14.0.6 ### Patch Changes - Updated dependencies \[[`f26cebe99`](f26cebe), [`2359e5f5a`](2359e5f)]: - @shopify/polaris-tokens@7.11.0 ## polaris-for-vscode@0.8.0 ### Minor Changes - [#10647](#10647) [`f26cebe99`](f26cebe) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Added composite `text` token completions ## polaris.shopify.com@0.57.9 ### Patch Changes - [#10609](#10609) [`b53189c72`](b53189c) Thanks [@kyledurand](https://github.com/kyledurand)! - Updated component example backgrounds - Updated dependencies \[[`22dbada34`](22dbada), [`f26cebe99`](f26cebe), [`f6a965102`](f6a9651), [`3bafbea50`](3bafbea), [`2359e5f5a`](2359e5f)]: - @shopify/polaris@11.20.1 - @shopify/polaris-tokens@7.11.0 Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
### WHY are these changes introduced? Fixes Shopify#10510 Fixes Shopify#10514 ### WHAT is this pull request doing? Adds the following composite `text` tokens: | New Token | Value | | ------------------------- | ------------------------ | | `--p-text-heading-3xl-font-family` | `--p-font-family-sans` | | `--p-text-heading-3xl-font-size` | `--p-font-size-900` | | `--p-text-heading-3xl-font-weight` | `--p-font-weight-bold` | | `--p-text-heading-3xl-font-letter-spacing` | `--p-font-letter-spacing-densest` | | `--p-text-heading-3xl-font-line-height` | `--p-font-line-height-1200` | | `--p-text-heading-2xl-font-family` | `--p-font-family-sans` | | `--p-text-heading-2xl-font-size` | `--p-font-size-750` | | `--p-text-heading-2xl-font-weight` | `--p-font-weight-bold` | | `--p-text-heading-2xl-font-letter-spacing` | `--p-font-letter-spacing-denser` | | `--p-text-heading-2xl-font-line-height` | `--p-font-size-1000` | | `--p-text-heading-xl-font-family` | `--p-font-family-sans` | | `--p-text-heading-xl-font-size` | `--p-font-size-600` | | `--p-text-heading-xl-font-weight` | `--p-font-weight-bold` | | `--p-text-heading-xl-font-letter-spacing` | `--p-font-letter-spacing-dense` | | `--p-text-heading-xl-font-line-height` | `--p-font-line-height-800` | | `--p-text-heading-lg-font-family` | `--p-font-family-sans` | | `--p-text-heading-lg-font-size` | `--p-font-size-500` | | `--p-text-heading-lg-font-weight` | `--p-font-weight-semibold` | | `--p-text-heading-lg-font-letter-spacing` | `--p-font-letter-spacing-dense` | | `--p-text-heading-lg-font-line-height` | `--p-font-size-600` | | `--p-text-heading-md-font-family` | `--p-font-family-sans` | | `--p-text-heading-md-font-size` | `--p-font-size-350` | | `--p-text-heading-md-font-weight` | `--p-font-weight-semibold` | | `--p-text-heading-md-font-letter-spacing` | `--p-font-letter-spacing-normal` | | `--p-text-heading-md-font-line-height` | `--p-font-size-500` | | `--p-text-heading-sm-font-family` | `--p-font-family-sans` | | `--p-text-heading-sm-font-size` | `--p-font-size-325` | | `--p-text-heading-sm-font-weight` | `--p-font-weight-semibold` | | `--p-text-heading-sm-font-letter-spacing` | `--p-font-letter-spacing-normal` | | `--p-text-heading-sm-font-line-height` | `--p-font-size-500` | | `--p-text-body-lg-font-family` | `--p-font-family-sans` | | `--p-text-body-lg-font-size` | `--p-font-size-350` | | `--p-text-body-lg-font-weight` | `--p-font-weight-regular` | | `--p-text-body-lg-font-letter-spacing` | `--p-font-letter-spacing-normal` | | `--p-text-body-lg-font-line-height` | `--p-font-size-500` | | `--p-text-body-md-font-family` | `--p-font-family-sans` | | `--p-text-body-md-font-size` | `--p-font-size-325` | | `--p-text-body-md-font-weight` | `--p-font-weight-regular` | | `--p-text-body-md-font-letter-spacing` | `--p-font-letter-spacing-normal` | | `--p-text-body-md-font-line-height` | `--p-font-size-500` | | `--p-text-body-sm-font-family` | `--p-font-family-sans` | | `--p-text-body-sm-font-size` | `--p-font-size-300` | | `--p-text-body-sm-font-weight` | `--p-font-weight-regular` | | `--p-text-body-sm-font-letter-spacing` | `--p-font-letter-spacing-normal` | | `--p-text-body-sm-font-line-height` | `--p-font-size-400` | | `--p-text-body-xs-font-family` | `--p-font-family-sans` | | `--p-text-body-xs-font-size` | `--p-font-size-275` | | `--p-text-body-xs-font-weight` | `--p-font-weight-regular` | | `--p-text-body-xs-font-letter-spacing` | `--p-font-letter-spacing-normal` | | `--p-text-body-xs-font-line-height` | `--p-font-size-300` | Adds the following composite `font-letter-spacing` tokens: | New Token | Value | | --- | --- | | `--p-font-letter-spacing-densest` | `-0.54px` | | `--p-font-letter-spacing-denser` | `-0.3px` | | `--p-font-letter-spacing-dense` | `-0.2px` | | `--p-font-letter-spacing-normal` | `0px` |
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @shopify/polaris-tokens@7.11.0 ### Minor Changes - [Shopify#10647](Shopify#10647) [`f26cebe99`](Shopify@b384a49) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Added composite `text` and `font-letter-spacing` tokens - [Shopify#10643](Shopify#10643) [`2359e5f5a`](Shopify@ba2f01a) Thanks [@lgriffee](https://github.com/lgriffee)! - Added semantic `space` token scale ## @shopify/polaris-migrator@0.22.6 ### Patch Changes - Updated dependencies \[[`f26cebe99`](Shopify@b384a49), [`2359e5f5a`](Shopify@ba2f01a)]: - @shopify/polaris-tokens@7.11.0 - @shopify/stylelint-polaris@14.0.6 ## @shopify/polaris@11.20.1 ### Patch Changes - [Shopify#10665](Shopify#10665) [`22dbada34`](Shopify@d4bf751) Thanks [@chloerice](https://github.com/chloerice)! - Fixed `Modal` missing `FrameContext` error - [Shopify#10663](Shopify#10663) [`f6a965102`](Shopify@8a46514) Thanks [@chloerice](https://github.com/chloerice)! - Reverted disabling of `Page` `secondaryActions` when `IndexFilters` is in filter `mode` - [Shopify#10649](Shopify#10649) [`3bafbea50`](Shopify@6c81246) Thanks [@mattkubej](https://github.com/mattkubej)! - Replace usages of `bg-secondary-experimental` with `bg-subdued` for Tables - Updated dependencies \[[`f26cebe99`](Shopify@b384a49), [`2359e5f5a`](Shopify@ba2f01a)]: - @shopify/polaris-tokens@7.11.0 ## @shopify/stylelint-polaris@14.0.6 ### Patch Changes - Updated dependencies \[[`f26cebe99`](Shopify@b384a49), [`2359e5f5a`](Shopify@ba2f01a)]: - @shopify/polaris-tokens@7.11.0 ## polaris-for-vscode@0.8.0 ### Minor Changes - [Shopify#10647](Shopify#10647) [`f26cebe99`](Shopify@b384a49) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Added composite `text` token completions ## polaris.shopify.com@0.57.9 ### Patch Changes - [Shopify#10609](Shopify#10609) [`b53189c72`](Shopify@82d23cc) Thanks [@kyledurand](https://github.com/kyledurand)! - Updated component example backgrounds - Updated dependencies \[[`22dbada34`](Shopify@d4bf751), [`f26cebe99`](Shopify@b384a49), [`f6a965102`](Shopify@8a46514), [`3bafbea50`](Shopify@6c81246), [`2359e5f5a`](Shopify@ba2f01a)]: - @shopify/polaris@11.20.1 - @shopify/polaris-tokens@7.11.0 Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
WHY are these changes introduced?
Fixes #10510
Fixes #10514
WHAT is this pull request doing?
Adds the following composite
text
tokens:--p-text-heading-3xl-font-family
--p-font-family-sans
--p-text-heading-3xl-font-size
--p-font-size-900
--p-text-heading-3xl-font-weight
--p-font-weight-bold
--p-text-heading-3xl-font-letter-spacing
--p-font-letter-spacing-densest
--p-text-heading-3xl-font-line-height
--p-font-line-height-1200
--p-text-heading-2xl-font-family
--p-font-family-sans
--p-text-heading-2xl-font-size
--p-font-size-750
--p-text-heading-2xl-font-weight
--p-font-weight-bold
--p-text-heading-2xl-font-letter-spacing
--p-font-letter-spacing-denser
--p-text-heading-2xl-font-line-height
--p-font-size-1000
--p-text-heading-xl-font-family
--p-font-family-sans
--p-text-heading-xl-font-size
--p-font-size-600
--p-text-heading-xl-font-weight
--p-font-weight-bold
--p-text-heading-xl-font-letter-spacing
--p-font-letter-spacing-dense
--p-text-heading-xl-font-line-height
--p-font-line-height-800
--p-text-heading-lg-font-family
--p-font-family-sans
--p-text-heading-lg-font-size
--p-font-size-500
--p-text-heading-lg-font-weight
--p-font-weight-semibold
--p-text-heading-lg-font-letter-spacing
--p-font-letter-spacing-dense
--p-text-heading-lg-font-line-height
--p-font-size-600
--p-text-heading-md-font-family
--p-font-family-sans
--p-text-heading-md-font-size
--p-font-size-350
--p-text-heading-md-font-weight
--p-font-weight-semibold
--p-text-heading-md-font-letter-spacing
--p-font-letter-spacing-normal
--p-text-heading-md-font-line-height
--p-font-size-500
--p-text-heading-sm-font-family
--p-font-family-sans
--p-text-heading-sm-font-size
--p-font-size-325
--p-text-heading-sm-font-weight
--p-font-weight-semibold
--p-text-heading-sm-font-letter-spacing
--p-font-letter-spacing-normal
--p-text-heading-sm-font-line-height
--p-font-size-500
--p-text-body-lg-font-family
--p-font-family-sans
--p-text-body-lg-font-size
--p-font-size-350
--p-text-body-lg-font-weight
--p-font-weight-regular
--p-text-body-lg-font-letter-spacing
--p-font-letter-spacing-normal
--p-text-body-lg-font-line-height
--p-font-size-500
--p-text-body-md-font-family
--p-font-family-sans
--p-text-body-md-font-size
--p-font-size-325
--p-text-body-md-font-weight
--p-font-weight-regular
--p-text-body-md-font-letter-spacing
--p-font-letter-spacing-normal
--p-text-body-md-font-line-height
--p-font-size-500
--p-text-body-sm-font-family
--p-font-family-sans
--p-text-body-sm-font-size
--p-font-size-300
--p-text-body-sm-font-weight
--p-font-weight-regular
--p-text-body-sm-font-letter-spacing
--p-font-letter-spacing-normal
--p-text-body-sm-font-line-height
--p-font-size-400
--p-text-body-xs-font-family
--p-font-family-sans
--p-text-body-xs-font-size
--p-font-size-275
--p-text-body-xs-font-weight
--p-font-weight-regular
--p-text-body-xs-font-letter-spacing
--p-font-letter-spacing-normal
--p-text-body-xs-font-line-height
--p-font-size-300
Adds the following composite
font-letter-spacing
tokens:--p-font-letter-spacing-densest
-0.54px
--p-font-letter-spacing-denser
-0.3px
--p-font-letter-spacing-dense
-0.2px
--p-font-letter-spacing-normal
0px