- From: Johannes Odland via GitHub <sysbot+gh@w3.org>
- Date: Mon, 04 Jul 2022 06:20:43 +0000
- To: public-css-archive@w3.org
Custom units as syntactic sugar would be great. Custom _functions_ would be awesome. It would allow us to build our own functions such as [`--progress`](https://github.com/w3c/csswg-drafts/issues/7268) to calculate a fluid ratio percentage to use in [the new `mix()` function](https://www.w3.org/TR/css-values-4/#interpolate).
```css
@custom-function --progress(--current, --min, --max) {
arg-syntax: --current "<length>", --min "<length>", --max "<length>";
result: clamp(0%, calc(100% * ((var(--current) - var(--min)) / (var(--max) - var(--min)))), 100%);
}
:root {
--fluid-ratio: --progress(100vw, 375px, 1920px)
}
.usage {
font-size: mix(--fluid-ratio, 1rem, 1.25rem)
}
```
Custom functions would allow us to write more readable css with less repetition.
@tabatkins Do you know if there are there any issues tracking custom functions?
--
GitHub Notification of comment by johannesodland
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7379#issuecomment-1173398703 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Monday, 4 July 2022 06:20:45 UTC