Skip to content
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(animation): add motion tokens #54

Closed
wants to merge 2 commits into from

Conversation

srambach
Copy link
Member

Fixes #52

@mcoker @lboehling @kaylachumley Do you think the base tokens (like --pf-t--global--delay--400) should have "motion" in them?

@mcoker Is it ok to include these in the -default scss file?

@mcoker
Copy link
Contributor

mcoker commented May 14, 2024

@mcoker @lboehling @kaylachumley Do you think the base tokens (like --pf-t--global--delay--400) should have "motion" in them?

@srambach I'm curious if others have an opinion. A little bit on what I'm thinking is...

Pros to not including --motion:

  • Vars are shorter, which isn't terribly important but it's more than zero importance!
  • Naming is more flexible so they could be used with other non-motion semantic tokens without the naming being potentially confusing. This implies they may be used for things other than --motion tokens

Pros to including --motion:

  • being more clear as to what these apply to. Everything is under --pf-t--global--motion. Implies these base tokens will probably only apply to --pf-t--global--motion semantic vars
  • avoiding namespace conflicts if we introduced different base delays/durations for some other non-motion tokens

@mcoker Is it ok to include these in the -default scss file?

I don't see why not. Is there a potential issue you can think of? Is it a question of whether we need an additional token file (like -motion or something)?

Copy link
Contributor

@mcoker mcoker left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm! just one comment about an update to build.js

@@ -26,6 +26,7 @@ const build = (selector) => {
name: 'patternfly/global/px',
type: 'value',
matcher: (token) =>
token.attributes.type === 'breakpoint' ||
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just wanted to make sure this change was intentional 👍

@srambach
Copy link
Member Author

Closing in favor of #56, which brings in the relevant tokens.
As to naming... let's go with this for the moment.
And motion tokens are included in the default scss token file.

@srambach srambach closed this May 16, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Tokens - import motion tokens
2 participants