[css-values-5][editorial] Swap all possible examples to using commas rather than semicolons. w3c#10670

Author: tabatkins

css-values-5/Overview.bs

@@ -635,31 +635,31 @@ Interpolated Property Values: the ''mix()'' notation</h3>
 		will resolve at computed-value time:
 
 		<pre>
-			color: mix(90%; red; blue);
+			color: mix(90%, red, blue);
 			/* via simple interpolation,
 			   computes to: */
 			color: rgb(10% 0 90%);
 
-			color: mix(90%; currentcolor; black);
+			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);
+			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));
+			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));
+			transform: mix(90%, translate(calc(16px + 50%)), rotate(30deg));
 			transform: mix(90% of ripple);
 		</pre>
 	</div>
@@ -675,13 +675,13 @@ Interpolated Property Values: the ''mix()'' notation</h3>
 
 		<pre>
 			/* Invalid start value */
-			color: mix(90% ; #invalid ; #F00);
+			color: mix(90%, #invalid, #F00);
 
 			/* Function is mixed with other values */
-			background: url(ocean) mix(10% ; blue ; yellow);
+			background: url(ocean) mix(10%, blue, yellow);
 
 			/* 'animation-*' is not animatable */
-			animation-delay: mix(0% ; 0s ; 2s);
+			animation-delay: mix(0%, 0s, 2s);
 		</pre>
 	</div>
 
@@ -790,7 +790,7 @@ Toggling Between Values: ''toggle()''</h3>
 		The following example makes <code>&lt;em></code> elements italic in general,
 		but makes them normal if they're inside something that's italic:
 
-		<pre>em { font-style: toggle(italic; normal); }</pre>
+		<pre>em { font-style: toggle(italic, normal); }</pre>
 	</div>
 
 	<div class='example'>
@@ -800,7 +800,7 @@ Toggling Between Values: ''toggle()''</h3>
 		and then repeat through the list of marker shapes,
 		starting again (for the 5th list deep) with ''list-style-type/disc''.
 
-		<pre>ul { list-style-type: toggle(disc; circle; square; box); }</pre>
+		<pre>ul { list-style-type: toggle(disc, circle, square, box); }</pre>
 	</div>
 
 	The syntax of the ''toggle()'' expression is:
@@ -840,7 +840,7 @@ Toggling Between Values: ''toggle()''</h3>
 
 
 	Note: This means that repeating values in a ''toggle()'' short-circuits the list.
-	For example ''toggle(1em, 2em, 1em, 4em)'' will be equivalent to ''toggle(1em; 2em)''.
+	For example ''toggle(1em, 2em, 1em, 4em)'' will be equivalent to ''toggle(1em, 2em)''.
 
 	<!-- Issue: Should this short-circuiting affect the computed value? -->
 
@@ -1409,23 +1409,23 @@ Picking a Random Item From a List: the ''random-item()'' function</h3>
 		is much simpler:
 		all that matters is the number of arguments.
 
-		That is, ''random-item(--x; red; blue; green)''
-		and ''random-item(--x; 1; 2; 3)''
+		That is, ''random-item(--x, red, blue, green)''
+		and ''random-item(--x, 1, 2, 3)''
 		will always resolve to the same argument index:
 		either ''red'' and ''1'', or ''blue'' and ''2'', or ''green'' and ''3''.
 		This allows coordination between groups of properties
 		that all want to use a random set of values.
 
-		On the other hand, ''random-item(--x; red; blue; green)''
-		and ''random-item(--x; 1; 2; 3; 4)''
+		On the other hand, ''random-item(--x, red, blue, green)''
+		and ''random-item(--x, 1, 2, 3, 4)''
 		will have no connection to each other;
 		any of the 12 possible combinations can occur.
 	</div>
 
 	Note: The <<random-caching-options>> argument is required in ''random-item()'',
 	but optional in ''random()'',
 	both for parsing reasons
-	(it's impossible to tell whether ''random-item(--foo; --bar; --baz)''
+	(it's impossible to tell whether ''random-item(--foo, --bar, --baz)''
 	has three <<declaration-value>> arguments
 	or two and a <<random-caching-options>> argument),
 	and because accidentally associating the random generation of ''random-item()'' functions together