From 2e32548a0cb54c1a86fa9ef46aafacfaf92418b8 Mon Sep 17 00:00:00 2001 From: Laura Griffee Date: Thu, 2 Dec 2021 15:21:41 -0500 Subject: [PATCH 1/4] Update the values of ease-in and ease-out --- src/components/README.md | 2 +- src/tokens/_motion.ts | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/README.md b/src/components/README.md index 1e85c4fed8e..2b6e6ccf377 100644 --- a/src/components/README.md +++ b/src/components/README.md @@ -108,7 +108,7 @@ Wrap your application in a div that contains the Polaris CSS variables. This is ```html
``` diff --git a/src/tokens/_motion.ts b/src/tokens/_motion.ts index 52cb40a9bfa..925f310d9b6 100644 --- a/src/tokens/_motion.ts +++ b/src/tokens/_motion.ts @@ -13,7 +13,7 @@ export const motion: TokenGroup = { 'duration-450': '450ms', 'duration-500': '500ms', ease: 'cubic-bezier(0.25, 0.1, 0.25, 1)', - 'ease-in': 'cubic-bezier(0.36, 0, 1, 1)', - 'ease-out': 'cubic-bezier(0, 0, 0.42, 1)', + 'ease-in': 'cubic-bezier(0.42, 0, 1, 1)', + 'ease-out': 'cubic-bezier(0, 0, 0.58, 1)', 'ease-excite': 'cubic-bezier(0.18, 0.67, 0.6, 1.22)', }; From 528fb8590aada792958fe63763b381cedc4971ca Mon Sep 17 00:00:00 2001 From: Laura Griffee Date: Thu, 2 Dec 2021 15:25:03 -0500 Subject: [PATCH 2/4] Add ease-in-out and linear tokens --- src/components/README.md | 2 +- src/tokens/_motion.ts | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/README.md b/src/components/README.md index 2b6e6ccf377..bcb6628edb7 100644 --- a/src/components/README.md +++ b/src/components/README.md @@ -108,7 +108,7 @@ Wrap your application in a div that contains the Polaris CSS variables. This is ```html
``` diff --git a/src/tokens/_motion.ts b/src/tokens/_motion.ts index 925f310d9b6..217de89f035 100644 --- a/src/tokens/_motion.ts +++ b/src/tokens/_motion.ts @@ -15,5 +15,7 @@ export const motion: TokenGroup = { ease: 'cubic-bezier(0.25, 0.1, 0.25, 1)', 'ease-in': 'cubic-bezier(0.42, 0, 1, 1)', 'ease-out': 'cubic-bezier(0, 0, 0.58, 1)', + 'ease-in-out': 'cubic-bezier(0.42, 0, 0.58, 1)', + linear: 'cubic-bezier(0, 0, 1, 1)', 'ease-excite': 'cubic-bezier(0.18, 0.67, 0.6, 1.22)', }; From 3f66b197209d54cdb246a0a1d0ff3d0536b9b2ce Mon Sep 17 00:00:00 2001 From: Laura Griffee Date: Thu, 2 Dec 2021 15:27:15 -0500 Subject: [PATCH 3/4] Remove ease-excite token --- src/components/README.md | 2 +- src/tokens/_motion.ts | 1 - 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/README.md b/src/components/README.md index bcb6628edb7..47d28c1cebb 100644 --- a/src/components/README.md +++ b/src/components/README.md @@ -108,7 +108,7 @@ Wrap your application in a div that contains the Polaris CSS variables. This is ```html
``` diff --git a/src/tokens/_motion.ts b/src/tokens/_motion.ts index 217de89f035..583e5060184 100644 --- a/src/tokens/_motion.ts +++ b/src/tokens/_motion.ts @@ -17,5 +17,4 @@ export const motion: TokenGroup = { 'ease-out': 'cubic-bezier(0, 0, 0.58, 1)', 'ease-in-out': 'cubic-bezier(0.42, 0, 0.58, 1)', linear: 'cubic-bezier(0, 0, 1, 1)', - 'ease-excite': 'cubic-bezier(0.18, 0.67, 0.6, 1.22)', }; From 3d7da79ed9bdff21c31ee4205f7f7d66d1346160 Mon Sep 17 00:00:00 2001 From: Laura Griffee Date: Thu, 2 Dec 2021 16:07:32 -0500 Subject: [PATCH 4/4] Update UNRELEASED-v8.md --- UNRELEASED-v8.md | 1 + 1 file changed, 1 insertion(+) diff --git a/UNRELEASED-v8.md b/UNRELEASED-v8.md index 0243d3c41d3..38d6550192e 100644 --- a/UNRELEASED-v8.md +++ b/UNRELEASED-v8.md @@ -34,6 +34,7 @@ Use [the changelog guidelines](/documentation/Versioning%20and%20changelog.md) t ### Enhancements - Added duration token values between 0 and 500 with 50ms increments ([#4781](https://github.com/Shopify/polaris-react/pull/4781)) +- Aligned easing tokens and values with CSS defaults ([#4790](https://github.com/Shopify/polaris-react/pull/4790)) ### Bug fixes