This repository was archived by the owner on Sep 30, 2025. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Update public primitive base
and light-uplift
theme scales
#10485
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
base
and light-uplift
theme scales
Co-Authored-By: Aaron Casanova <32409546+aaronccasanova@users.noreply.github.com>
Co-Authored-By: Aaron Casanova <32409546+aaronccasanova@users.noreply.github.com>
Co-Authored-By: Aaron Casanova <32409546+aaronccasanova@users.noreply.github.com>
aaronccasanova
approved these changes
Sep 15, 2023
Merged
laurkim
pushed a commit
that referenced
this pull request
Sep 22, 2023
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@11.20.0 ### Minor Changes - [#10477](#10477) [`790a001cd`](790a001) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Updated semantic `color` tokens - [#10478](#10478) [`8be227e0c`](8be227e) Thanks [@MaxCloutier](https://github.com/MaxCloutier)! - Added `allowFiltering` prop on `ActionList`, and `filterActions` prop on Page Header - [#9445](#9445) [`7be9c243a`](7be9c24) Thanks [@m4thieulavoie](https://github.com/m4thieulavoie)! - Added support for subheaders and selection of a range of `IndexTable.Rows` -- See the [With subheaders](https://polaris.shopify.com/components/tables/index-table) example on polaris.shopify.com for how to properly configure - `IndexTable.Row` - Added support for setting the `indeterminate` value on the `selected` prop - Added the `selectionRange` prop to specify a range of other consecutive, related rows selected when the row is selected - Added the `rowType` prop to indicate the relationship or role of the row's contents (defaults to `data`, `subheader` renders the row to look and behave like the table header row) Added support for setting accessibility attributes on `IndexTable.Cell` - `IndexTable.Cell` - Added the `as` prop to support rendering the cell as a `th` element if it is serving as a subheading cell - Added support for the `headers` attribute to manually associate all headers when the cell is described by more than its column heading - Added support for the `colSpan` attribute to specify the number of the columns that the cell element should extend to - Added support for the `scope` attribute to indicate whether the `th` is a header for a column, row, or group of columns or rows - [#10490](#10490) [`863f15ff2`](863f15f) Thanks [@mrcthms](https://github.com/mrcthms)! - Add new `IndexFiltersManager` for allowing disabling of Page Header actions when in Filtering or EditingColumns mode - [#10566](#10566) [`9fed74317`](9fed743) Thanks [@mrcthms](https://github.com/mrcthms)! - Fixed a bug in `Filters` where changes to the `appliedFilters` prop were not being handled ### Patch Changes - [#10404](#10404) [`5acfcec04`](5acfcec) Thanks [@jesstelford](https://github.com/jesstelford)! - Scoped CSS variables for non-responsive props on `Tooltip`, `RangeSlider`, `ProgressBar`, and `HorizontalStack`. - [#10582](#10582) [`3efbc1b4e`](3efbc1b) Thanks [@mrcthms](https://github.com/mrcthms)! - Fixed the focus states of actions within the Page Header component - [#10492](#10492) [`d5ff72dec`](d5ff72d) Thanks [@mrcthms](https://github.com/mrcthms)! - Updated Storybook stories to be wrapped with an empty FrameContext.Provider - Updated dependencies \[[`fe1aac1b5`](fe1aac1), [`790a001cd`](790a001), [`63cf3ad24`](63cf3ad), [`120e96eae`](120e96e)]: - @shopify/polaris-tokens@7.10.0 ## @shopify/polaris-tokens@7.10.0 ### Minor Changes - [#10465](#10465) [`fe1aac1b5`](fe1aac1) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Updated private primitive `colors` - [#10477](#10477) [`790a001cd`](790a001) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Updated semantic `color` tokens - [#10600](#10600) [`63cf3ad24`](63cf3ad) Thanks [@lgriffee](https://github.com/lgriffee)! - Added public primitive and semantic `shadow` token scales ### Patch Changes - [#10485](#10485) [`120e96eae`](120e96e) Thanks [@lgriffee](https://github.com/lgriffee)! - Updated public primitive `base` and `light-uplift` theme scales ## @shopify/polaris-migrator@0.22.5 ### Patch Changes - [#10575](#10575) [`ea6b54284`](ea6b542) Thanks [@aveline](https://github.com/aveline)! - Handled `buttonFrom` and `buttonsFrom` functions in `Button` migration - Updated dependencies \[[`fe1aac1b5`](fe1aac1), [`790a001cd`](790a001), [`63cf3ad24`](63cf3ad), [`120e96eae`](120e96e)]: - @shopify/polaris-tokens@7.10.0 - @shopify/stylelint-polaris@14.0.5 ## @shopify/stylelint-polaris@14.0.5 ### Patch Changes - Updated dependencies \[[`fe1aac1b5`](fe1aac1), [`790a001cd`](790a001), [`63cf3ad24`](63cf3ad), [`120e96eae`](120e96e)]: - @shopify/polaris-tokens@7.10.0 ## polaris.shopify.com@0.57.8 ### Patch Changes - [#10605](#10605) [`9748b0838`](9748b08) Thanks [@laurkim](https://github.com/laurkim)! - Updated logic for rendering `color` custom property previews in `TokenList` - [#10573](#10573) [`da09e0b8c`](da09e0b) Thanks [@kyledurand](https://github.com/kyledurand)! - Updated copy url to change browser url - Updated dependencies \[[`fe1aac1b5`](fe1aac1), [`5acfcec04`](5acfcec), [`790a001cd`](790a001), [`8be227e0c`](8be227e), [`63cf3ad24`](63cf3ad), [`7be9c243a`](7be9c24), [`863f15ff2`](863f15f), [`3efbc1b4e`](3efbc1b), [`d5ff72dec`](d5ff72d), [`120e96eae`](120e96e), [`9fed74317`](9fed743)]: - @shopify/polaris-tokens@7.10.0 - @shopify/polaris@11.20.0 Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
AnnaCheba
pushed a commit
to AnnaCheba/polaris
that referenced
this pull request
Apr 22, 2024
…fy#10485) ### WHY are these changes introduced? In order to support the opt out se23 feature flag with our pre v12 migrations we need to refactor how our new public primitive tokens are being referenced in `base` and `light-uplift` themes. ### WHAT is this pull request doing? - Maps our new tokens to their values in the `light-uplift` theme. <details> <summary>✨ New <code>border-radius</code> maps</summary> | New Token | Value | | ------------------------- | ------------------------ | | `--p-border-radius-0` | `size[0]` | | `--p-border-radius-050` | `size['050']` | | `--p-border-radius-100` | `size[100]` | | `--p-border-radius-150` | `size[150]` | | `--p-border-radius-200` | `size[200]` | | `--p-border-radius-300` | `size[300]` | | `--p-border-radius-400` | `size[400]` | | `--p-border-radius-500` | `size[500]` | | `--p-border-radius-750` | `size[750]` | </details> <details> <summary>✨ New <code>border-width</code> maps</summary> | New Token | Value | | ------------------------- | ------------------------ | | `--p-border-width-0165` | `size[0165]` | | `--p-border-width-025` | `size[025]` | | `--p-border-width-050` | `size['050']` | | `--p-border-width-100` | `size[100]` | </details> <details> <summary>✨ New <code>space</code> maps</summary> | New Token | Value | | ------------------------- | ------------------------ | | `--p-space-050` | `size['050']` | | `--p-space-100` | `size[100]` | | `--p-space-150` | `size[150]` | | `--p-space-200` | `size[200]` | | `--p-space-300` | `size[300]` | | `--p-space-400` | `size[400]` | | `--p-space-500` | `size[500]` | | `--p-space-600` | `size[600]` | | `--p-space-800` | `size[800]` | | `--p-space-1000` | `size[1000]` | | `--p-space-1200` | `size[1200]` | | `--p-space-1600` | `size[1600]` | | `--p-space-2000` | `size[2000]` | | `--p-space-2400` | `size[2400]` | | `--p-space-2800` | `size[2800]` | | `--p-space-3200` | `size[3200]` | </details> <details> <summary>✨ New <code>height</code> maps</summary> | New Token | Value | | ------------------------- | ------------------------ | | `--p-height-0` | `size['0']` | | `--p-height-025` | `size['025']` | | `--p-height-050` | `size['050']` | | `--p-height-100` | `size[100]` | | `--p-height-150` | `size[150]` | | `--p-height-200` | `size[200]` | | `--p-height-300` | `size[300]` | | `--p-height-400` | `size[400]` | | `--p-height-500` | `size[500]` | | `--p-height-600` | `size[600]` | | `--p-height-700` | `size[700]` | | `--p-height-800` | `size[800]` | | `--p-height-900` | `size[900]` | | `--p-height-1000` | `size[1000]` | | `--p-height-1200` | `size[1200]` | | `--p-height-1600` | `size[1600]` | | `--p-height-2000` | `size[2000]` | | `--p-height-2400` | `size[2400]` | | `--p-height-2800` | `size[2800]` | | `--p-height-3200` | `size[3200]` | </details> <details> <summary>✨ New <code>width</code> maps</summary> | New Token | Value | | ------------------------- | ------------------------ | | `--p-width-0` | `size['0']` | | `--p-width-025` | `size['025']` | | `--p-width-050` | `size['050']` | | `--p-width-100` | `size[100]` | | `--p-width-150` | `size[150]` | | `--p-width-200` | `size[200]` | | `--p-width-300` | `size[300]` | | `--p-width-400` | `size[400]` | | `--p-width-500` | `size[500]` | | `--p-width-600` | `size[600]` | | `--p-width-700` | `size[700]` | | `--p-width-800` | `size[800]` | | `--p-width-900` | `size[900]` | | `--p-width-1000` | `size[1000]` | | `--p-width-1200` | `size[1200]` | | `--p-width-1600` | `size[1600]` | | `--p-width-2000` | `size[2000]` | | `--p-width-2400` | `size[2400]` | | `--p-width-2800` | `size[2800]` | | `--p-width-3200` | `size[3200]` | </details> <details> <summary>✨ New <code>font-size</code> maps</summary> | New Token | Value | | ------------------------- | ------------------------ | | `--p-font-size-275` | `size[275]` | | ~`--p-font-size-300`~ | ~`size[300]`~ | | `--p-font-size-325` | `size[325]` | | `--p-font-size-350` | `size[350]` | | ~`--p-font-size-400`~ | ~`size[400]`~ | | ~`--p-font-size-500`~ | ~`size[500]`~ | | ~`--p-font-size-600`~ | ~`size[600]`~ | | `--p-font-size-750` | `size[750]` | | `--p-font-size-900` | `size[900]` | | `--p-font-size-1000` | `size[1000]` | > [!NOTE] > The following values were not added since they conflict with existing tokens with the same name. These tokens will have their values updated in the next major version v12: | New Token | Value | Value (in px) | ------------------------- | ------------------------ | ------------------------ | | `--p-font-size-300` | `size[300]` | `12px` | | `--p-font-size-400` | `size[400]` | `16px` | | `--p-font-size-500` | `size[500]` | `20px` | | `--p-font-size-600` | `size[600]` | `24px` | </details> <details> <summary>✨ New <code>line-height</code> maps</summary> | New Token | Value | | ------------------------- | ------------------------ | | `--p-font-line-height-300` | `size[300]` | | `--p-font-line-height-400` | `size[400]` | | `--p-font-line-height-500` | `size[500]` | | `--p-font-line-height-600` | `size[600]` | | `--p-font-line-height-700` | `size[700]` | | `--p-font-line-height-800` | `size[800]` | | `--p-font-line-height-1000` | `size[1000]` | | `--p-font-line-height-1200` | `size[1200]` | </details> - Maps our new tokens to the tokens they will be replacing in the `base` theme (for opt out support) <details> <summary>↔️ Replacement <code>border-radius</code> maps</summary> | Deprecated Token | Replacement Value | | ------------------------- | ------------------------ | | `--p-border-radius-0-experimental` | `--p-border-radius-0` | | `--p-border-radius-05` | `--p-border-radius-050` | | `--p-border-radius-1` | `--p-border-radius-100` | | `--p-border-radius-1_5-experimental` | `--p-border-radius-150` | | `--p-border-radius-2` | `--p-border-radius-200` | | `--p-border-radius-3` | `--p-border-radius-300` | | `--p-border-radius-4` | `--p-border-radius-400` | | `--p-border-radius-5` | `--p-border-radius-500` | | `--p-border-radius-6` | `--p-border-radius-750` | </details> <details> <summary>↔️ Replacement <code>border-width</code> maps</summary> | Deprecated Token | Replacement Value | | ------------------------- | ------------------------ | | `--p-border-width-1` | `--p-border-width-025` | | `--p-border-width-1-experimental` | `--p-border-width-0165` | | `--p-border-width-2` | `--p-border-width-050` | | `--p-border-width-2-experimental` | `--p-border-width-025` | | `--p-border-width-3` | `--p-border-width-050` | | `--p-border-width-4` | `--p-border-width-100` | | `--p-border-width-5` | `--p-border-width-100` | </details> <details> <summary>↔️ Replacement <code>space</code> maps</summary> | Deprecated Token | Replacement Value | | ------------------------- | ------------------------ | | `--p-space-05` | `--p-space-050` | | `--p-space-1` | `--p-space-100` | | `--p-space-1_5-experimental` | `--p-space-150` | | `--p-space-2` | `--p-space-200` | | `--p-space-3` | `--p-space-300` | | `--p-space-4` | `--p-space-400` | | `--p-space-5` | `--p-space-500` | | `--p-space-6` | `--p-space-600` | | `--p-space-8` | `--p-space-800` | | `--p-space-10` | `--p-space-1000` | | `--p-space-12` | `--p-space-1200` | | `--p-space-16` | `--p-space-1600` | | `--p-space-20` | `--p-space-2000` | | `--p-space-24` | `--p-space-2400` | | `--p-space-28` | `--p-space-2800` | | `--p-space-32` | `--p-space-3200` | </details> <details> <summary>↔️ Replacement <code>font-size</code> maps</summary> | Deprecated Token | Replacement Value | | ------------------------- | ------------------------ | | `--p-font-size-70-experimental` | `--p-font-size-275` | | `--p-font-size-75` | `--p-font-size-300` | | `--p-font-size-80-experimental` | `--p-font-size-325` | | `--p-font-size-100` | `--p-font-size-350` | | `--p-font-size-200` | `--p-font-size-400` | | `--p-font-size-300` | `--p-font-size-500` | | `--p-font-size-400` | `--p-font-size-600` | | `--p-font-size-500` | `--p-font-size-750` | | `--p-font-size-600` | `--p-font-size-900` | | `--p-font-size-700` | `--p-font-size-1000` | </details> <details> <summary>↔️ Replacement <code>line-height</code> maps</summary> | Deprecated Token | Replacement Value | | ------------------------- | ------------------------ | | `--p-font-line-height-075-experimental` | `--p-font-line-height-300` | | `--p-font-line-height-1` | `--p-font-line-height-400` | | `--p-font-line-height-2` | `--p-font-line-height-500` | | `--p-font-line-height-3` | `--p-font-line-height-600` | | `--p-font-line-height-4` | `--p-font-line-height-700` | | `--p-font-line-height-5` | `--p-font-line-height-800` | | `--p-font-line-height-6` | `--p-font-line-height-1000` | | `--p-font-line-height-7` | `--p-font-line-height-1200` | </details> --------- Co-authored-by: Aaron Casanova <32409546+aaronccasanova@users.noreply.github.com>
ascherkus
pushed a commit
to ascherkus/polaris
that referenced
this pull request
Feb 19, 2025
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@11.20.0 ### Minor Changes - [Shopify#10477](Shopify#10477) [`790a001cd`](Shopify@be6914d) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Updated semantic `color` tokens - [Shopify#10478](Shopify#10478) [`8be227e0c`](Shopify@b588f20) Thanks [@MaxCloutier](https://github.com/MaxCloutier)! - Added `allowFiltering` prop on `ActionList`, and `filterActions` prop on Page Header - [Shopify#9445](Shopify#9445) [`7be9c243a`](Shopify@4069237) Thanks [@m4thieulavoie](https://github.com/m4thieulavoie)! - Added support for subheaders and selection of a range of `IndexTable.Rows` -- See the [With subheaders](https://polaris.shopify.com/components/tables/index-table) example on polaris.shopify.com for how to properly configure - `IndexTable.Row` - Added support for setting the `indeterminate` value on the `selected` prop - Added the `selectionRange` prop to specify a range of other consecutive, related rows selected when the row is selected - Added the `rowType` prop to indicate the relationship or role of the row's contents (defaults to `data`, `subheader` renders the row to look and behave like the table header row) Added support for setting accessibility attributes on `IndexTable.Cell` - `IndexTable.Cell` - Added the `as` prop to support rendering the cell as a `th` element if it is serving as a subheading cell - Added support for the `headers` attribute to manually associate all headers when the cell is described by more than its column heading - Added support for the `colSpan` attribute to specify the number of the columns that the cell element should extend to - Added support for the `scope` attribute to indicate whether the `th` is a header for a column, row, or group of columns or rows - [Shopify#10490](Shopify#10490) [`863f15ff2`](Shopify@07246bc) Thanks [@mrcthms](https://github.com/mrcthms)! - Add new `IndexFiltersManager` for allowing disabling of Page Header actions when in Filtering or EditingColumns mode - [Shopify#10566](Shopify#10566) [`9fed74317`](Shopify@3fb446f) Thanks [@mrcthms](https://github.com/mrcthms)! - Fixed a bug in `Filters` where changes to the `appliedFilters` prop were not being handled ### Patch Changes - [Shopify#10404](Shopify#10404) [`5acfcec04`](Shopify@5cdd787) Thanks [@jesstelford](https://github.com/jesstelford)! - Scoped CSS variables for non-responsive props on `Tooltip`, `RangeSlider`, `ProgressBar`, and `HorizontalStack`. - [Shopify#10582](Shopify#10582) [`3efbc1b4e`](Shopify@d47089b) Thanks [@mrcthms](https://github.com/mrcthms)! - Fixed the focus states of actions within the Page Header component - [Shopify#10492](Shopify#10492) [`d5ff72dec`](Shopify@8057862) Thanks [@mrcthms](https://github.com/mrcthms)! - Updated Storybook stories to be wrapped with an empty FrameContext.Provider - Updated dependencies \[[`fe1aac1b5`](Shopify@a4f7ed7), [`790a001cd`](Shopify@be6914d), [`63cf3ad24`](Shopify@d4e6bd4), [`120e96eae`](Shopify@fe98b0b)]: - @shopify/polaris-tokens@7.10.0 ## @shopify/polaris-tokens@7.10.0 ### Minor Changes - [Shopify#10465](Shopify#10465) [`fe1aac1b5`](Shopify@a4f7ed7) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Updated private primitive `colors` - [Shopify#10477](Shopify#10477) [`790a001cd`](Shopify@be6914d) Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Updated semantic `color` tokens - [Shopify#10600](Shopify#10600) [`63cf3ad24`](Shopify@d4e6bd4) Thanks [@lgriffee](https://github.com/lgriffee)! - Added public primitive and semantic `shadow` token scales ### Patch Changes - [Shopify#10485](Shopify#10485) [`120e96eae`](Shopify@fe98b0b) Thanks [@lgriffee](https://github.com/lgriffee)! - Updated public primitive `base` and `light-uplift` theme scales ## @shopify/polaris-migrator@0.22.5 ### Patch Changes - [Shopify#10575](Shopify#10575) [`ea6b54284`](Shopify@9761c8a) Thanks [@aveline](https://github.com/aveline)! - Handled `buttonFrom` and `buttonsFrom` functions in `Button` migration - Updated dependencies \[[`fe1aac1b5`](Shopify@a4f7ed7), [`790a001cd`](Shopify@be6914d), [`63cf3ad24`](Shopify@d4e6bd4), [`120e96eae`](Shopify@fe98b0b)]: - @shopify/polaris-tokens@7.10.0 - @shopify/stylelint-polaris@14.0.5 ## @shopify/stylelint-polaris@14.0.5 ### Patch Changes - Updated dependencies \[[`fe1aac1b5`](Shopify@a4f7ed7), [`790a001cd`](Shopify@be6914d), [`63cf3ad24`](Shopify@d4e6bd4), [`120e96eae`](Shopify@fe98b0b)]: - @shopify/polaris-tokens@7.10.0 ## polaris.shopify.com@0.57.8 ### Patch Changes - [Shopify#10605](Shopify#10605) [`9748b0838`](Shopify@a21aca4) Thanks [@laurkim](https://github.com/laurkim)! - Updated logic for rendering `color` custom property previews in `TokenList` - [Shopify#10573](Shopify#10573) [`da09e0b8c`](Shopify@439fedc) Thanks [@kyledurand](https://github.com/kyledurand)! - Updated copy url to change browser url - Updated dependencies \[[`fe1aac1b5`](Shopify@a4f7ed7), [`5acfcec04`](Shopify@5cdd787), [`790a001cd`](Shopify@be6914d), [`8be227e0c`](Shopify@b588f20), [`63cf3ad24`](Shopify@d4e6bd4), [`7be9c243a`](Shopify@4069237), [`863f15ff2`](Shopify@07246bc), [`3efbc1b4e`](Shopify@d47089b), [`d5ff72dec`](Shopify@8057862), [`120e96eae`](Shopify@fe98b0b), [`9fed74317`](Shopify@3fb446f)]: - @shopify/polaris-tokens@7.10.0 - @shopify/polaris@11.20.0 Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
WHY are these changes introduced?
In order to support the opt out se23 feature flag with our pre v12 migrations we need to refactor how our new public primitive tokens are being referenced in
base
andlight-uplift
themes.WHAT is this pull request doing?
Maps our new tokens to their values in the
light-uplift
theme.✨ New
border-radius
maps--p-border-radius-0
size[0]
--p-border-radius-050
size['050']
--p-border-radius-100
size[100]
--p-border-radius-150
size[150]
--p-border-radius-200
size[200]
--p-border-radius-300
size[300]
--p-border-radius-400
size[400]
--p-border-radius-500
size[500]
--p-border-radius-750
size[750]
✨ New
border-width
maps--p-border-width-0165
size[0165]
--p-border-width-025
size[025]
--p-border-width-050
size['050']
--p-border-width-100
size[100]
✨ New
space
maps--p-space-050
size['050']
--p-space-100
size[100]
--p-space-150
size[150]
--p-space-200
size[200]
--p-space-300
size[300]
--p-space-400
size[400]
--p-space-500
size[500]
--p-space-600
size[600]
--p-space-800
size[800]
--p-space-1000
size[1000]
--p-space-1200
size[1200]
--p-space-1600
size[1600]
--p-space-2000
size[2000]
--p-space-2400
size[2400]
--p-space-2800
size[2800]
--p-space-3200
size[3200]
✨ New
height
maps--p-height-0
size['0']
--p-height-025
size['025']
--p-height-050
size['050']
--p-height-100
size[100]
--p-height-150
size[150]
--p-height-200
size[200]
--p-height-300
size[300]
--p-height-400
size[400]
--p-height-500
size[500]
--p-height-600
size[600]
--p-height-700
size[700]
--p-height-800
size[800]
--p-height-900
size[900]
--p-height-1000
size[1000]
--p-height-1200
size[1200]
--p-height-1600
size[1600]
--p-height-2000
size[2000]
--p-height-2400
size[2400]
--p-height-2800
size[2800]
--p-height-3200
size[3200]
✨ New
width
maps--p-width-0
size['0']
--p-width-025
size['025']
--p-width-050
size['050']
--p-width-100
size[100]
--p-width-150
size[150]
--p-width-200
size[200]
--p-width-300
size[300]
--p-width-400
size[400]
--p-width-500
size[500]
--p-width-600
size[600]
--p-width-700
size[700]
--p-width-800
size[800]
--p-width-900
size[900]
--p-width-1000
size[1000]
--p-width-1200
size[1200]
--p-width-1600
size[1600]
--p-width-2000
size[2000]
--p-width-2400
size[2400]
--p-width-2800
size[2800]
--p-width-3200
size[3200]
✨ New
font-size
maps--p-font-size-275
size[275]
--p-font-size-300
size[300]
--p-font-size-325
size[325]
--p-font-size-350
size[350]
--p-font-size-400
size[400]
--p-font-size-500
size[500]
--p-font-size-600
size[600]
--p-font-size-750
size[750]
--p-font-size-900
size[900]
--p-font-size-1000
size[1000]
--p-font-size-300
size[300]
12px
--p-font-size-400
size[400]
16px
--p-font-size-500
size[500]
20px
--p-font-size-600
size[600]
24px
✨ New
line-height
maps--p-font-line-height-300
size[300]
--p-font-line-height-400
size[400]
--p-font-line-height-500
size[500]
--p-font-line-height-600
size[600]
--p-font-line-height-700
size[700]
--p-font-line-height-800
size[800]
--p-font-line-height-1000
size[1000]
--p-font-line-height-1200
size[1200]
Maps our new tokens to the tokens they will be replacing in the
base
theme (for opt out support)border-radius
maps--p-border-radius-0-experimental
--p-border-radius-0
--p-border-radius-05
--p-border-radius-050
--p-border-radius-1
--p-border-radius-100
--p-border-radius-1_5-experimental
--p-border-radius-150
--p-border-radius-2
--p-border-radius-200
--p-border-radius-3
--p-border-radius-300
--p-border-radius-4
--p-border-radius-400
--p-border-radius-5
--p-border-radius-500
--p-border-radius-6
--p-border-radius-750
border-width
maps--p-border-width-1
--p-border-width-025
--p-border-width-1-experimental
--p-border-width-0165
--p-border-width-2
--p-border-width-050
--p-border-width-2-experimental
--p-border-width-025
--p-border-width-3
--p-border-width-050
--p-border-width-4
--p-border-width-100
--p-border-width-5
--p-border-width-100
space
maps--p-space-05
--p-space-050
--p-space-1
--p-space-100
--p-space-1_5-experimental
--p-space-150
--p-space-2
--p-space-200
--p-space-3
--p-space-300
--p-space-4
--p-space-400
--p-space-5
--p-space-500
--p-space-6
--p-space-600
--p-space-8
--p-space-800
--p-space-10
--p-space-1000
--p-space-12
--p-space-1200
--p-space-16
--p-space-1600
--p-space-20
--p-space-2000
--p-space-24
--p-space-2400
--p-space-28
--p-space-2800
--p-space-32
--p-space-3200
font-size
maps--p-font-size-70-experimental
--p-font-size-275
--p-font-size-75
--p-font-size-300
--p-font-size-80-experimental
--p-font-size-325
--p-font-size-100
--p-font-size-350
--p-font-size-200
--p-font-size-400
--p-font-size-300
--p-font-size-500
--p-font-size-400
--p-font-size-600
--p-font-size-500
--p-font-size-750
--p-font-size-600
--p-font-size-900
--p-font-size-700
--p-font-size-1000
line-height
maps--p-font-line-height-075-experimental
--p-font-line-height-300
--p-font-line-height-1
--p-font-line-height-400
--p-font-line-height-2
--p-font-line-height-500
--p-font-line-height-3
--p-font-line-height-600
--p-font-line-height-4
--p-font-line-height-700
--p-font-line-height-5
--p-font-line-height-800
--p-font-line-height-6
--p-font-line-height-1000
--p-font-line-height-7
--p-font-line-height-1200