Skip to content

Commit

Permalink
Sort color functions alphabetically
Browse files Browse the repository at this point in the history
  • Loading branch information
FloEdelmann authored Sep 18, 2024
1 parent af5ba59 commit 8c449a1
Showing 1 changed file with 34 additions and 34 deletions.
68 changes: 34 additions & 34 deletions source/documentation/modules/color.md
Original file line number Diff line number Diff line change
Expand Up @@ -141,6 +141,40 @@ title: sass:color
{% endcodeExample %}
{% endfunction %}

{% function 'color.channel($color, $channel, $space: null)', 'returns:number' %}
{% compatibility 'dart: "1.78.0"', 'libsass: false', 'ruby: false', 'feature: "$space"' %}{% endcompatibility %}

Returns the value of `$channel` in `$space`, which defaults to `$color`'s
space. The `$channel` must be a quoted string, and the `$space` must be an
unquoted string.

This returns a number with unit `deg` for the `hue` channel of the `hsl`,
`hwb`, `lch`, and `oklch` spaces. It returns a number with unit `%` for the
`saturation`, `lightness`, `whiteness`, and `blackness` channels of the `hsl`,
`hwb`, `lab`, `lch`, `oklab`, and `oklch` spaces. For all other channels, it
returns a unitless number.

This will return `0` (possibly with an appropriate unit) if the `$channel` is
missing in `$color`. You can use [`color.is-missing()`] to check explicitly
for missing channels.

[`color.is-missing()`]: #is-missing

{% codeExample 'color-channel', false %}
@use 'sass:color';

@debug color.channel(hsl(80deg 30% 50%), "hue"); // 80deg
@debug color.channel(hsl(80deg 30% 50%), "hue", $space: oklch); // 124.279238779deg
@debug color.channel(hsl(80deg 30% 50%), "red", $space: rgb); // 140.25
===
@use 'sass:color'

@debug color.channel(hsl(80deg 30% 50%), "hue") // 80deg
@debug color.channel(hsl(80deg 30% 50%), "hue", $space: oklch) // 124.279238779deg
@debug color.channel(hsl(80deg 30% 50%), "red", $space: rgb) // 140.25
{% endcodeExample %}
{% endfunction %}

{% function 'color.complement($color, $space: null)', 'complement($color, $space: null)', 'returns:color' %}
{% compatibility 'dart: "1.78.0"', 'libsass: false', 'ruby: false', 'feature: "$space"' %}{% endcompatibility %}

Expand Down Expand Up @@ -187,40 +221,6 @@ title: sass:color
{% endcodeExample %}
{% endfunction %}

{% function 'color.channel($color, $channel, $space: null)', 'returns:number' %}
{% compatibility 'dart: "1.78.0"', 'libsass: false', 'ruby: false', 'feature: "$space"' %}{% endcompatibility %}

Returns the value of `$channel` in `$space`, which defaults to `$color`'s
space. The `$channel` must be a quoted string, and the `$space` must be an
unquoted string.

This returns a number with unit `deg` for the `hue` channel of the `hsl`,
`hwb`, `lch`, and `oklch` spaces. It returns a number with unit `%` for the
`saturation`, `lightness`, `whiteness`, and `blackness` channels of the `hsl`,
`hwb`, `lab`, `lch`, `oklab`, and `oklch` spaces. For all other channels, it
returns a unitless number.

This will return `0` (possibly with an appropriate unit) if the `$channel` is
missing in `$color`. You can use [`color.is-missing()`] to check explicitly
for missing channels.

[`color.is-missing()`]: #is-missing

{% codeExample 'color-channel', false %}
@use 'sass:color';

@debug color.channel(hsl(80deg 30% 50%), "hue"); // 80deg
@debug color.channel(hsl(80deg 30% 50%), "hue", $space: oklch); // 124.279238779deg
@debug color.channel(hsl(80deg 30% 50%), "red", $space: rgb); // 140.25
===
@use 'sass:color'

@debug color.channel(hsl(80deg 30% 50%), "hue") // 80deg
@debug color.channel(hsl(80deg 30% 50%), "hue", $space: oklch) // 124.279238779deg
@debug color.channel(hsl(80deg 30% 50%), "red", $space: rgb) // 140.25
{% endcodeExample %}
{% endfunction %}

{% function 'color.grayscale($color)', 'grayscale($color)', 'returns:color' %}
Returns a gray color with the same lightness as `$color`.

Expand Down

0 comments on commit 8c449a1

Please sign in to comment.