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.

Sign up for GitHub

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

Jump to bottom

@property javascript file for typed definitions #414

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

@property javascript file for typed definitions #414

wants to merge 1 commit into from

Conversation

argyleink
Copy link
Owner

@argyleink argyleink commented Sep 21, 2023 •
edited

fixes #410

example output so far:

[
  {"name":"--ratio-portrait","syntax":"<ratio>","initialValue":"3/4","inherits":false},
  {"name":"--ratio-widescreen","syntax":"<ratio>","initialValue":"16/9","inherits":false},
  {"name":"--ratio-ultrawide","syntax":"<ratio>","initialValue":"18/5","inherits":false},
  {"name":"--ratio-golden","syntax":"<ratio>","initialValue":"1.6180/1","inherits":false}
].forEach(CSS.registerProperty)

I'm not sure what else to add. All the colors and included, z-index values are included.

note:
There's an issue with sizes using rem and relative units, they won't register as is, they have to be assigned from CSS layer. Registration could type them, but not have meaningful initial defaults.

@stackblitz
Copy link

stackblitz bot commented Sep 21, 2023

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

argyleink
argyleink commented Sep 21, 2023
View reviewed changes
build/props.js
// gen @property module
const atTokens = toAtProperty(Object.entries({
...Object.assign({}, ...Object.values(individual_colors)),
// ...Easings,
Copy link
Owner Author

Choose a reason for hiding this comment

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

there's no type for easings I dont think

@github-actions
Copy link

Visit the preview URL for this PR (updated for commit 56fbe6c):

https://open-props--pr414-at-property-module-6z593eug.web.app

(expires Thu, 28 Sep 2023 04:17:36 GMT)

🔥 via Firebase Hosting GitHub Action 🌎

Sign: 32524ac481f54edda55dc959fa4614cf1acc8c11

@argyleink argyleink self-assigned this Sep 21, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees

@argyleink argyleink

Labels
to be explored
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

JS registration file for all props as @property
1 participant
@argyleink