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

Filter typography tokens from all.css output #377

Open
wants to merge 11 commits into
base: beta
Choose a base branch
from

Conversation

adrianbruntonsagecom
Copy link
Contributor

@adrianbruntonsagecom adrianbruntonsagecom commented Sep 26, 2024

The default output exposes both responsive typography tokens (which use the css clamp function) and adaptive typography tokens which are amended based on a media query. The reason that both tokens are needed is due to Figma not currently supporting the clamp function. Therefore, both types are being exposed as tokens with the advise given that even though Figma is using the adaptive tokens, going forward we should use the responsive tokens.

This change adds a token formatter which:

  • Filters out adaptive typography tokens for product and marketing contexts
  • Filters out responsive typography tokens for the frozenproduct context.
  • Removes "adaptive-" and "responsive-" from any typography tokens. This is primarily done to genericise these tokens since we've removed some so they no longer need to be so specific, but also to aid the frozenproduct usage so there is a direct migration path from the frozenproduct context to the product context.

This change takes the product output down from 2249 total lines to 2107 removing 142 lines (~6%).

Additionally, BrandTokens has been renamed to the more correct ContextTokens terminology.

@adrianbruntonsagecom adrianbruntonsagecom changed the base branch from master to beta September 26, 2024 15:41
import { CssProperty } from "../../css-parser/css-parser.types";
import { Decorator } from "../decorator";

export class FilterTypographyTokens extends Decorator {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

I'm also adding renaming of the tokens so that there is an actual smooth transition possible from frozenproduct to product.

Copy link
Contributor Author

@adrianbruntonsagecom adrianbruntonsagecom Sep 27, 2024

Choose a reason for hiding this comment

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

This is done now. However I also added a sanity check given the assumption that's been made that each token has a mirror adaptive/responsive token. This doesn't appear to be 100% true currently, but could be a config issue. This is why the CI build is currently failing.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

2 participants