[css-color-5] Remove adjusters from color-mix() and simplify grammar

Author: LeaVerou

css-color-5/Overview.bs

@@ -119,74 +119,17 @@ Mixing colors: the ''color-mix()'' function {#color-mix}
 	in a given [=colorspace=],
 	by a specified amount.
 
-	Multiple color-adjusters can be specified.
-
 
 <pre class='prod'>
-	<dfn>color-mix()</dfn> = color-mix([ in <<colorspace>> ]?, <<mix-component>>#{2})
+	<dfn>color-mix()</dfn> = color-mix([ in <<colorspace>> ]?, <<color>>{2} [ <<percentage>> ]?)
 </pre>
 
-<pre class='prod'>
-	<dfn>&lt;mix-component></dfn> = <<color>> [ <<percentage>> | <<color-adjuster>>+ ]?
-</pre>
-
-
-<pre class='prod'>
-	<dfn>&lt;color-adjuster></dfn> = [ [
-			  <<srgb-adjuster>> | <<hsl-adjuster>> | <<hwb-adjuster>>
-			| <<xyz-adjuster>> | <<lab-adjuster>> | <<lch-adjuster>>
-		] | alpha ] <<percentage>>?
-	<dfn>&lt;srgb-adjuster></dfn> = red || green || blue
-	<dfn>&lt;hsl-adjuster></dfn> = <<hue-adjuster>> || saturation || lightness
-	<dfn>&lt;hwb-adjuster></dfn> = <<hue-adjuster>> ||  whiteness || blackness
-	<dfn>&lt;xyz-adjuster></dfn> = x || y || z
-	<dfn>&lt;lab-adjuster></dfn> = lightness || a || b
-	<dfn>&lt;lch-adjuster></dfn> = lightness || chroma || <<hue-adjuster>>
-	<dfn>&lt;hue-adjuster></dfn> = hue [shorter | longer | increasing | decreasing | specified ]?
-</pre>
-
-Arguments are normalized as follows:
-
-1. When a percentage is specified without any [=color-adjuster=]s,
-	it is expanded to all adjusters available for the given [=colorspace=] plus alpha.
-2. If a percentage is omitted and there are no adjusters present on any color arguments,
-	it defaults to 50% (an equal mix of the two colors).
-3. Adjusters that are not present on a color default to 0% (i.e. the corresponding components are taken from the other color).
-4. Adjusters that are only present on one of the colors default to <code>100% - <i>p</i></code> on the second color,
-	where <i>p</i> is the percentage of the corresponding adjuster in the other color.
-5. If the sum of corresponding adjusters across all colors is not 100%, percentages are scaled proportionally so that the sum is exactly 100%.
-
-Issue: Do missing adjusters default to 0% everywhere, or only in the second color?
-If the former, we can end up with adjusters that sum to 0% pretty easily.
-
-The meaning of the adjusters is defined by colorspace.
-For example, if the [=colorspace=] is [=hsl=],
-hue means the HSL hue, which is not the same as the LCH hue;
-if the colorspace is [=lch=],
-lightness means the LCH Lightness, which is the same as Lab lightness,
-but different to the HSL Lightness.
-
-Only the [=color-adjuster=]s defined for a given [=colorspace=] are available.
-For example, it is not possible to use the HWB [=whiteness=] adjuster unless the colorspace is [=hwb=].
-The alpha adjuster is available on any [=colorspace=].
+If a percentage is omitted, it defaults to 50% (an equal mix of the two colors).
 
 If the specified colorspace has a smaller gamut
 than the one in which the color to be adjusted is specified,
 gamut mapping will occur.
 
-Note: not all [=color-adjuster=]s are equally useful.
-Adjustments in LCH are the most useful, which is why it is the default.
-Adjustments on the a and b axes are rarely needed.
-Adjustments in the srgb-related spaces (srgb itself, hsl, hwb)
-are provided mainly for backward compatibility
-with the sorts of adjustments currently done in CSS preprocessors.
-Adjusting the individual x, y and z channels will produce significant hue shifts;
-however, adjusting all three channels together is useful
-and will lighten or darken the color.
-
-The [=hue-adjuster=] takes optional keywords, to specify the [[css-color-4#hue-interpolation]] algorithm.
-If no keyword is specified, it is as if ''shorter'' were specified.
-
 <div class="example">
 	This example produces a mixture of 40% <span class="swatch" style="--color: peru"></span> peru
 	and 60% <span class="swatch" style="--color: lightgoldenrod"></span> lightgoldenrod.
@@ -227,7 +170,7 @@ If no keyword is specified, it is as if ''shorter'' were specified.
 	keeps the intermediate colors
 	as saturated as the endpoint colors.
 
-	<pre class="lang-css">color-mix(teal 65%, olive);</pre>
+	<pre class="lang-css">color-mix(in lch, teal 65%, olive);</pre>
 
 	<figure>
 		<img src="images/CH-mixing3.svg" style="width: 50vmin">
@@ -251,10 +194,8 @@ If no keyword is specified, it is as if ''shorter'' were specified.
 		* which is a slightly-blueish green: <span class="swatch" style="--color: rgb(7.7377% 52.5730% 37.3213%)"></span>  rgb(7.7377% 52.5730% 37.3213%)
 </div>
 
-Instead of mixing all channels equally, color-adjusters can be used
-to only mix certain channels. The unmixed channels in the result
-are copied across from the <em>first</em> color.
-
+<!--
+Let's move this example to the appropriate section when we have the new syntax for making these low-level adjustments
 <div class="example">
 	This example produces the mixture of a deep green and a sky blue,
 	in ''lch()'' colorspace (the default),
@@ -396,6 +337,7 @@ are copied across from the <em>first</em> color.
 
 	This example demonstrates that not all colors which can be mixed, can be displayed on current devices.
 </div>
+-->
 
 <!--
 <img src="images/mix_red_yellow_lightness30.png" alt="Result of color-mix(red, yellow, lightness(30%)" />
@@ -928,6 +870,10 @@ Changes {#changes}
 <h3 id="changes-20200303">Since the <a href="https://www.w3.org/TR/2020/WD-css-color-5-20200303/">FPWD of 10 June 2020</a></h3>
 
 <ul>
+	<!--
+	<li>Added `in` keyword before <<colorspace>> tokens in functions</li>
+	<li>Removed adjusters from color-mix</li>
+	-->
 	<!-- to 28 Jan 2021 -->
 	<!-- removed interpolation section changes, added to Color 4 -->
 	<!-- to 5 Jan 2021 -->