[css-color-4] tweaks

Author: svgeesus

css-color-4/Overview.bs

@@ -76,6 +76,8 @@ Introduction</h2>
 	<abbr title="black-cyan-magenta-yellow-green-orange-violet">KCMYGOV</abbr>
 	are supported.
 
+	A <a href="https://test.csswg.org/harness/results/css-color-4_dev/grouped/">draft implementation report</a> is available.
+
 <h3 id="values">
 Value Definitions</h3>
 
@@ -953,6 +955,22 @@ System Colors</h3>
 	though possibly at a lower contrast rating,
 	over any of the backgrounds.
 
+	<div class="example" id="SystemCombo">
+		For example, the system color combinations in the browser you are currently using:
+
+		<p>Canvas with CanvasText <span style="background-color:Canvas; color:CanvasText">CanvasText</span></p>
+		<p>Canvas with LinkText <span style="background-color:Canvas; color:LinkText">LinkText</span></p>
+		<p>Canvas with VisitedText <span style="background-color:Canvas; color:VisitedText">VisitedText</span></p>
+		<p>Canvas with ActiveText <span style="background-color:Canvas; color:ActiveText">ActiveText</span></p>
+		<p>Canvas with GrayText <span style="background-color:Canvas; color:GrayText">GrayText</span></p>
+		<p>ButtonFace with ButtonText <span style="background-color:ButtonFace; color:ButtonText">ButtonText</span></p>
+		<p>ButtonFace with GrayText <span style="background-color:ButtonFace; color:GrayText">GrayText</span></p>
+		<p>Field with FieldText <span style="background-color:Field; color:FieldText">FieldText</span></p>
+		<p>Field with GrayText <span style="background-color:Field; color:GrayText">GrayText</span></p>
+		<p>Highlight with HighlightText <span style="background-color:Highlight; color:HighlightText">HighlightText</span></p>
+		<p>Highlight with GrayText <span style="background-color:Highlight; color:GrayText">GrayText</span></p>
+	</div>
+
 	Earlier versions of CSS defined additional <<system-color>>s,
 	which have since been deprecated.
 	These are documented in [[#deprecated-system-colors]].
@@ -1919,6 +1937,11 @@ Device-independent Colors: Lab and LCH</h2>
 Specifying Lab and LCH: the ''lab()'' and ''lch()'' functional notations</h3>
 	<!-- lab rather than CIELab or whatever, for brevity -->
 
+	<!-- browser tracking bugs:
+		Chromium https://bugs.chromium.org/p/chromium/issues/detail?id=1026287
+
+	-->
+
 	CSS allows colors to be directly expressed in Lab and LCH.
 
 	<pre class='prod'>
@@ -2191,6 +2214,12 @@ Profiled, Device-dependent Colors</h2>
 <h3 id="predefined">
 Predefined colorspaces: ''srgb'', ''display-p3'', ''a98-rgb'', ''prophoto-rgb'', ''rec2020'' and ''lab'''.</h3>
 
+<!-- Browser tracking bugs:
+	Chromium https://bugs.chromium.org/p/chromium/issues/detail?id=1068610
+
+	Quick test https://mathiasbynens.github.io/css-dbg-stories/css-color.html
+-->
+
 	The following colorspaces are predefined for use in the ''color()'' function.
 	They are used without any ''@color-profile'' rule.
 

css-color-4/style.css

@@ -27,3 +27,9 @@ table.gamuts tr>td+td {
 table.gamuts tr:hover {
 	background: papayawhip;
 }
+
+#SystemCombo span {
+	padding: 0.2em;
+	border: thin solid #555;
+	box-shadow: 2px 2px 1px rgba(0,0,0,.15)
+}