[css-values-4] Punt mix() to Values 5 #9343

css-values-4/Overview.bs

@@ -552,128 +552,6 @@ Combining Values: Interpolation, Addition, and Accumulation</h2>
 	If a value type does not define a specific procedure for <a>accumulation</a>,
 	its <a>accumulation</a> operation is identical to <a>addition</a>.
 
-<!--
-██     ██ ████ ██     ██   ███ ███
-███   ███  ██   ██   ██   ██     ██
-████ ████  ██    ██ ██   ██       ██
-██ ███ ██  ██     ███    ██       ██
-██     ██  ██    ██ ██   ██       ██
-██     ██  ██   ██   ██   ██     ██
-██     ██ ████ ██     ██   ███ ███
--->
-
-<h3 id="interpolate">
-Representing Interpolated Values: the ''mix()'' notation</h3>
-
-	[=Interpolation=] of two values can be represented
-	by the <dfn>mix()</dfn> [=functional notation=],
-	whose syntax is defined as follows:
-
-	<pre class="prod">
-		&lt;mix()> = mix( <<percentage>> ';' <<declaration-value>>? ';' <<declaration-value>>? )
-	</pre>
-
-	<dl dfn-for="mix()">
-		<dt><dfn value><<percentage>></dfn>
-		<dd>
-			Represents the interpolation progress between the two values.
-
-		<dt><dfn value><<declaration-value>></dfn>
-		<dd>
-			The first <<declaration-value>> represents
-			the value at the “start” (0%) of the interpolation range,
-			interpreted as a value for the property this function is used in.
-
-			The second <<declaration-value>> represents
-			the value at the “end” (100%) of the interpolation range,
-			interpreted the same.
-
-			Either value can be omitted,
-			to refer to an empty value
-			(this is valid in [=custom properties=], such as ''--foo:;'').
-			The separating '';'' cannot be omitted;
-			for example, a ''mix()'' with an empty starting value
-			would be written like ''mix(50%;;bar)''.
-	</dl>
-
-	Note: This [=functional notation=] uses semicolons to separate arguments
-	rather than the more typical comma
-	because the values themselves can contain commas.
-
-
-	If the two <<declaration-value>>s in ''mix()'' are [=interpolation|interpolable=]
-	as values for the property in which it is specified,
-	and the interpolated value can be represented without ''mix()'',
-	the [=computed value=] of ''mix()'' is
-	the result of interpolating these two values
-	to the progress given by the <<percentage>>.
-	Otherwise,
-	the [=computed value=] of ''mix()'' is
-	the ''mix()'' [=functional notation=] itself
-	with its <<percentage>> computed
-	and both <<declaration-value>>s computed
-	as values for this property.
-
-	<div class="example">
-		For example, most uses of ''mix()''
-		will resolve at computed-value time:
-
-		<pre>
-			color: mix(90%; red; blue);
-			/* via simple interpolation,
-			   computes to: */
-			color: rgb(10% 0 90%);
-
-			color: mix(90%; currentcolor; black);
-			/* can't be fully resolved at computed-value time,
-			   but still has a defined representation: */
-			color: color-mix(currentcolor 90%, black 10%);
-
-			float: mix(90%; left; right);
-			/* discretely animatable */
-			float: right;
-		</pre>
-
-		But a few cases don't have an intermediate representation:
-
-		<pre>
-			transform: mix(90%; translate(calc(1em + 50%)); rotate(30deg));
-			/* because functions don't match, it will interpolate
-			   via matrix(). But translate(%) needs layout
-			   information to turn into a matrix(), so the
-			   interpolated value can't actually be represented.
-			   Computes to: */
-			transform: mix(90%; translate(calc(16px + 50%)); rotate(30deg));
-		</pre>
-	</div>
-
-	A ''mix()'' notation is invalid
-	if it is not the sole value of the property;
-	if either of its <<declaration-value>>s
-	are invalid when specified as the entire value
-	for the property the function is used in;
-	or if the property using it is [=not animatable=].
-
-	<div class="example">
-		For example, the following declarations are invalid,
-		and will be ignored:
-
-		<pre>
-			/* Invalid start value */
-			color: mix(90% ; #invalid ; #F00);
-
-			/* Function is mixed with other values */
-			background: url(ocean) mix(10% ; blue ; yellow);
-
-			/* 'animation-*' is not animatable */
-			animation-delay: mix(0% ; 0s ; 2s);
-		</pre>
-	</div>
-
-	Progress values below ''0%'' and above ''100%'' are valid;
-	they represent interpolation beyond the range represented
-	by the start and end values.
-
 <h3 id="combining-range">
 Range Checking</h3>