Re: [csswg-drafts] [css-values-5] What is the MVP for inline conditionals on custom properties? (#10064)

> To be more productive, then, my suggestion for the syntax is:
> 
> ```
> if( [<<if-cond>> ':' <<decl-value>> ]# )
> <if-cond> = <<boolean>> | else
> ```
> 
> With the condition that `else` is only valid in the final pair. (And if there's no `else` and all the conditions fail, the value is IACVT.)

@tabatkins If we settle on the `if( [<<if-cond>> ':' <<decl-value>> ]# )` grammar, how would values that contain commas be handled? Would the parser not consider a comma `,` the statement terminator unless preceding a value followed by a colon `:`?

Consider this example:
```postcss
* {
  --val: if(media(width > 200px): media(width > 100px), media(width > 50px), media(width > 10px): 10px),
}
```
While it may be a bit convoluted, this would be the expected condition-result map, as I see it:

| Condition | Result | Result type |
|--------|--------|--------|
| `media(width > 200px)` | `media(width > 100px)` | `"<boolean>"` (re #10593) |
| `media(width > 50px)` | `10px` | `"<length>"` |
| (omitted `else`) |  | IACVT |

-- 
GitHub Notification of comment by brandonmcconnell
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10064#issuecomment-2238150993 using your GitHub account


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

Received on Friday, 19 July 2024 04:46:13 UTC