Color factory #89
Color factory #89
Conversation
|
Not sure why linting is failing in CI. It does not fail for me locally |
|
Random thought should we call these “variables” instead of “variants”? |
I don't feel like that change improves understanding when compared to "variants". |
My thinking was these are actually variables as opposed to our current colors which are constants. The value varies depending on dark, light, or theme (for web). Variants also indicates a sibling relationship when this is more like a parent/child relationship. The role variables belong to their given role because they are derived from the role’s base color. |
|
Updated the base branch to |
|
Okay I’m happy with where this is at for a first iteration and think it is ready for review. Additional features like adding in metadata, etc I'd like to leave for future beta releases. As this stands, it should support both Polaris React and Polaris Rails. |
| const {saturationAdjustmentFn, hueRotationFn} = require('../utils'); | ||
|
|
||
| const base = { | ||
| surface: [ |
There was a problem hiding this comment.
I’d like to leave the scheme as-is for now, get a working beta released, then iterate on adding metadata which will be part of the generated files. Specifically the immediate plan for metadata is to add info that can be used to filter colors based on various dimensions.
| gulp | ||
| .src('tokens/themes/*.yml') | ||
| .pipe( | ||
| $.theo({ |
There was a problem hiding this comment.
Useing theo to transform a theme into a palette, which is then passed into theo again feels a little odd to me. I wonder if we could do this with plain old JS, rather than having to register a theo transform.
That can be a problem for later though, no need to block this PR
There was a problem hiding this comment.
Leaving this comment unresolved for posterity and future PRs
Co-authored-by: Dan Rosenthal <dan.rosenthal@shopify.com>
tmlayton
force-pushed
the
color-system/init
branch
from
32ad306 to
46526a8
Compare
* Added surface disabled variant and updated other variant configs ([#101](#101)) * Added TypeScript build for modern tokens, and shifted directory structures to differentiate between legacy and modern tokens ([#97](#97)) * Updated variant names and descriptions ([#96](#96)) * Added decorative icon variants ([#94](#94)) * Built changes from previous release, and added textOnInteractive variant ([#93](#93)) * Fixed an issue where legacy themes caused the color factory to throw ([#92](#92)) * Update color variants for consistency with changes in Polaris React ([#91](#91)) * Marked the config as optional and the colors as partial ([dd3d8fc](https://github.com/Shopify/polaris-tokens/commit/ * Actually exporting the types would be helpful ([4998856](4998856)) * Added the Color Factory. Long live the Color Factory! ([#89](#89)) Co-authored-by: Dan Rosenthal <dan.rosenthal@shopify.com> Co-authored-by: Ben Scott <227292+BPScott@users.noreply.github.com> Co-authored-by: Kyle Durand <kyle.durand@shopify.com> Co-authored-by: Sara Hill <sara.hill@shopify.com>
Addresses #71
The PR is the first of a few to move the color factory from Polaris React to Polaris Tokens. Here is a high level diagram of the color system, including the color factory:
Todo