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

I prefer B, which appears to remove all ambiguity here with `,`/`;`.

@LeaVerou Could we support some convention for stacking if contexts without nesting `if()` function usages?

```css
* {
  /* LESS PREFERABLE ❌ */
  --nested-function: if(style(--x: 1) ? 1, 2 : if(style(--x: 2) ? 3));

  /* PREFERABLE ✅ */
  --nested-syntax:   if(style(--x: 1) ? 1, 2 : style(--x: 2) ? 3);
}
```

Note in both of these examples that no `else` delimiter is needed and `no-value` is assumed when no final `:` else/if-false clause is used.

---

I'm sure someone else in this thread can probably soundboard me on this, but I think this should be doable. As long as an if/else clause returns a boolean followed by a conditional operator `?`/`:`, we can assume we are using a nested conditional syntax rather than the boolean value itself. A boolean value could technically be a returned value if not followed by conditional syntax `?`/`:`.

Some examples of this:
* `if(style(--x: 1) ? 1, 2 : style(--x: 2) ? 3)` returns one of…
   * `1, 2`
   * `3`
* `if(style(--x: 1) ? 1, 2 : style(--x: 2) ? 3 : )` returns one of…
   * `1, 2`
   * `3`
   * ` `
* `if(style(--x: 1) ? 1, 2 : style(--x: 2))` returns one of…
   * `1, 2`
   * `TRUE`/`FALSE` (dynamic value of `style(--x: 2)`)

The third of these examples assumes support for boolean values in CSS. I know these have been talked about a lot, and I believe they may have even been accepted for a future version, but I am not entirely sure. If they have not yet been selected, then the third example would be invalid syntax until boolean values are supported.

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


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

Received on Friday, 14 June 2024 17:56:16 UTC