[css-color-5] Change the computed value of light-dark() none from linear-gradient(transparent) to image(transparent) (#13897)

* Change the computed value of `light-dark()` none from `linear-gradient(transparent)` to `image(transparent)`

* Apply suggestion from @tabatkins

---------

Co-authored-by: Tab Atkins Jr. <jackalmage@gmail.com>

Author: yisibl

css-color-5/Overview.bs

@@ -2808,15 +2808,10 @@ or any other color or monochrome output device which has been characterized.
 	if the <a>used color scheme</a> is ''light'' or unknown,
 	or the second image,
 	if the <a>used color scheme</a> is ''dark''.
-	The none keyword 
-	produces a fully transparent image 
-	with no natural size. 
 
-	It is equivalent to a single-stop gradient whose stop color is ''transparent''':
-
-	<pre class="lang-css">
-		linear-gradient(transparent)
-	</pre>
+	The <dfn value for="light-dark()">none</dfn> keyword 
+	computes to ''image(transparent)''
+	(a fully transparent image with no natural size).
 
 	<div class="example" id="ex-light-dark-color">
 		For example, to maintain a legible contrast on links,
@@ -2866,6 +2861,12 @@ or any other color or monochrome output device which has been characterized.
 			<pre class="lang-css">
 				background-image: light-dark(url(my-light-image.png), none);
 			</pre>
+
+			This is equivalent to:
+
+			<pre class="lang-css">
+				background-image: light-dark(url(my-light-image.png), image(transparent));
+			</pre>
 		</div>
 
 

css-images-4/Overview.bs

@@ -395,7 +395,11 @@ Image Fallbacks and Annotations: the ''image()'' notation {#image-notation}
 		one can use this as a simple way to "tint" a background image,
 		by overlaying a partially-transparent color over the top of the other image:
 
-		<pre class="lang-css">background-image: image(rgba(0,0,255,.5)), url("bg-image.png");</pre>
+		<pre class="lang-css">background-image: image(rgba(0, 0, 255, .5)), url("bg-image.png");</pre>
+
+		This is equivalent to a single color stop gradient:
+
+		<pre class="lang-css">background-image: linear-gradient(rgba(0, 0, 255, .5)), url("bg-image.png");</pre>
 
 		'background-color' does not work for this,
 		as the solid color it generates always lies <em>beneath</em> all the background images.

css-images-5/Overview.bs

@@ -201,7 +201,11 @@ Image Fallbacks and Annotations: the ''image()'' notation {#image-notation}
 		one can use this as a simple way to "tint" a background image,
 		by overlaying a partially-transparent color over the top of the other image:
 
-		<pre class="lang-css">background-image: image(rgba(0,0,255,.5)), url("bg-image.png");</pre>
+		<pre class="lang-css">background-image: image(rgba(0, 0, 255, .5)), url("bg-image.png");</pre>
+
+		This is equivalent to a single color stop gradient:
+
+		<pre class="lang-css">background-image: linear-gradient(rgba(0, 0, 255, .5)), url("bg-image.png");</pre>
 
 		'background-color' does not work for this,
 		as the solid color it generates always lies <em>beneath</em> all the background images.