[csswg-drafts] Allow --var's RHS to be a computed value (#11669)

Karric has just created a new issue for https://github.com/w3c/csswg-drafts:

== Allow --var's RHS to be a computed value ==
**Problem:**
• In web development, it is common to not have access to the code that applies a value. Thus, it can be difficult to copy/apply the same value elsewhere.

**Proposal:**
• Currently, when setting a variable, the right-hand-side (RHS) must be an actual CSS value (or variable). This proposal is to allow the right-hand-side to be a property name — the variable takes on the computed value for that property.

**Example:**
```
/* CSS from codebase I cannot edit */
framework-element {
width: 75%;
}

/* CSS from codebase I can edit */
framework-element {
--fwe-width: width; /* picks up the value so I can apply elsewhere; automatically root scope */
}
my-element {
width: var(--fw-width); /* my element can now match the width of the framework element at all times */
}
```

**Implementation Notes:**
• You can think of this proposal in the following way:
```
1) A --* was encountered where the RHS is a property name instead of a value.
2) Invent a secret root-level variable. Get the computed value of the property from above and make that the value of this secret variable.
3) Swap the RHS of the --* encountered in step 1 with var(--secret-variable)
4) --* is now a regular variable declaration with value.
```
• Most use cases I can think of would want/need this variable's scope to be root like.
• Ideally the RHS property name is syntactically interchangeable with a var(), so wrapping it in calc() and such would be parsed and evaluated just fine.

**Other Notes:**
• The spirit of this proposal is to have a way to link the value of property to the value of another property when I am not able to set up a shared variable or declaration block, typically due to codebase limitations.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/11669 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 7 February 2025 13:31:06 UTC