[Color 4 RGB/HSL] Refactor rgb() and hsl()

This commit is contained in:
Natalie Weizenbaum 2018-11-07 18:54:14 -08:00
parent 0694031ffb
commit 278fb9668f
2 changed files with 21 additions and 26 deletions

View File

@ -1,5 +1,8 @@
## Draft 1.3
* Refactor `rgb()` and `hsl()` to reduce repetition and ensure that they always
return plain CSS function calls with the correct names.
* Fix a redirect that didn't get the extra text about renaming its plain CSS.
## Draft 1.2

View File

@ -101,27 +101,23 @@ functions:
* Let `red` and `green` be the first two elements of `$channels`.
* If the third element of `$channels` has preserved its status as two
slash-separated numbers:
* Let `blue` be the number before the slash and `alpha` the number after the
slash.
* Call `rgba()` with `red`, `green`, `blue`, and `alpha` as arguments and
return the result.
* Otherwise, if the third element of `$channels` is an unquoted string that
contains `/`:
* If the third element of `$channels` is an unquoted string that contains `/`:
* Return a plain CSS function string with the name `"rgb"` and the argument
`$channels`.
* Otherwise, if the third element of `$channels` has preserved its status as
two slash-separated numbers:
* Let `blue` be the number before the slash and `alpha` the number after the
slash.
* Otherwise:
* Let `blue` be the third element of `$channels`.
* Call `rgb()` with `red`, `green`, and `blue` as arguments and return the
result.
* Call `rgb()` with `red`, `green`, `blue`, and `alpha` (if it's defined) as
arguments and return the result.
* ```
rgb($red, $green, $blue, $alpha)
@ -167,27 +163,23 @@ functions:
* Let `hue` and `saturation` be the first two elements of `$channels`.
* If the third element of `$channels` has preserved its status as two
slash-separated numbers:
* If the third element of `$channels` is an unquoted string that contains `/`:
* Return a plain CSS function string with the name `"rgb"` and the argument
`$channels`.
* Otherwise, if the third element of `$channels` has preserved its status as
two slash-separated numbers:
* Let `lightness` be the number before the slash and `alpha` the number
after the slash.
* Call `hsla()` with `hue`, `saturation`, `lightness`, and `alpha` as
arguments and return the result.
* Otherwise, if the third element of `$channels` is an unquoted string that
contains `/`:
* Return a plain CSS function string with the name `"hsl"` and the argument
`$channels`.
* Otherwise:
* Let `lightness` be the third element of `$channels`.
* Call `hsl()` with `hue`, `saturation`, and `lightness` as arguments and
return the result.
* Call `hsl()` with `hue`, `saturation`, `lightness`, and `alpha` (if it's
defined) as arguments and return the result.
* ```
hsl($hue, $saturation, $lightness, $alpha)