Skip to content

[css-properties-values-api-1] Allow @property syntax checking to work with fallback value #1096

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

Closed
miragecraft opened this issue Apr 22, 2023 · 3 comments

Comments

@miragecraft
Copy link

I'm experimenting with the new @property at-rule and feel that it should include the ability to use syntax in conjunction with custom property fallback value.

For example, let's say I want to create a special --width custom property that accepts fractions (such as 1/2, 2/5) in addition to all the values allowed by the built-in width property including the unitless 0, <percentage-length>, as well as all the keywords such as auto, min-content, max-content, fit-content.

Currently it's not possible to do so, but if we allow syntax checking with fallback, we can do:

div {
  --width-percent: calc(var(--width) * 100%);
  width: var(--width-percent, var(--width));
}

@property --width-percent {
  syntax: "<percentage>";
  inherits:false;
}

So this is why I would like the spec to allow combining fallback with syntax checking.

@Loirooriol
Copy link

This should probably be in https://github.com/w3c/css-houdini-drafts/issues/

And I don't really understand what you are proposing.

@miragecraft
Copy link
Author

And I don't really understand what you are proposing.

Currently, once you specify @property for a custom property, you can no longer use a fallback value because @property mandates an initial-value if you define a syntax other than syntax: "*".

The initial-value takes over the functionality of the fallback value.

This leaves two gaps in functionality:

  1. You can no longer use different fallback values for the same custom property, because the initial-value is defined once globally.
  2. You can no longer use custom property within the fallback (initial-value) of another custom property, because @property does not support it.

@Loirooriol Loirooriol transferred this issue from w3c/csswg-drafts May 14, 2023
@miragecraft
Copy link
Author

miragecraft commented Oct 29, 2024

I believe this issue is no longer needed due to the decision made here.

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

No branches or pull requests

2 participants