Re: [csswg-drafts] [css-values] Make top-level NaN be IACVT instead of ∞ (#7067)

@miragecraft It seems to me you actually want conditionals like

```css
--x-shrink: if(var(--s) = -1; initial; 1);
```

Something like this was proposed in https://github.com/w3c/csswg-drafts/issues/5009#issuecomment-625545276, but of course this thing doesn't exist yet.

At first I thought that just using `sign()` would do the trick, arithmetic conditionals are precisely why I proposed it in #4673

```css
--x-shrink: abs(sign(var(--s) + 1));
flex-basis: calc(var(--auto-span) * var(--x-shrink) - 1px * (1 - var(--x-shrink)));
```

but the problem is that `calc()` will just clamp the deliberately invalid `-1px` into `0px` instead of invalidating `flex-basis`.

So you will need registered properties:

```css
@property --flex-basis {
  syntax: "<length>";
  inherits: false;
  initial-value: -1px;
}
#target {
  --x-shrink: abs(sign(var(--s) + 1));
  --flex-basis: calc(var(--auto-span) * var(--x-shrink) - 1px * (1 - var(--x-shrink)));
  flex-basis: var(--flex-basis);
}
```

Also, Chromium has not implemented `sign()` yet :(

```css
@property --x-shrink {
  syntax: "<number>";
  inherits: false;
  initial-value: calc(1px / 0);
}
@property --x-shrink-2 {
  syntax: "<number>";
  inherits: false;
  initial-value: calc(1px / 0);
}
@property --flex-basis {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: -1px;
}
#target {
  --x-shrink: calc((var(--s) + 1) / (var(--s) + 1));
  --x-shrink-2: max(0, var(--x-shrink) * -1 + 2);
  --flex-basis: calc(var(--auto-span) * var(--x-shrink-2) - 1px * (1 - var(--x-shrink-2)));
  flex-basis: var(--flex-basis);
}
```

So I think your usecase is still doable, but the lack of conditionals sucks. Also, Firefox and WebKit haven't implemented registered properties...

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


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

Received on Monday, 4 April 2022 15:17:30 UTC