filter grayed -> grayscale() + allow grayscale(0.5) + a few % support

h2d/domkit/BaseComponents.hx

@@ -7,9 +7,9 @@ class CustomParser extends CssValue.ValueParser {
 	function parseScale( value ) {
 		switch( value ) {
 		case VGroup([x,y]):
-			return { x : parseFloat(x), y : parseFloat(y) };
+			return { x : parseFloatPercent(x), y : parseFloatPercent(y) };
 		default:
-			var s = parseFloat(value);
+			var s = parseFloatPercent(value);
 			return { x : s, y : s };
 		}
 	}
@@ -169,7 +169,7 @@ class CustomParser extends CssValue.ValueParser {
 		case VIdent("none"):
 			return null;
 		case VGroup(vl):
-			return { dx : parseFloat(vl[0]), dy : parseFloat(vl[1]), color : vl.length >= 3 ? parseColor(vl[2]) : 0, alpha : vl.length >= 4 ? parseFloat(vl[3]) : 1 };
+			return { dx : parseFloat(vl[0]), dy : parseFloat(vl[1]), color : vl.length >= 3 ? parseColor(vl[2]) : 0, alpha : vl.length >= 4 ? parseFloatPercent(vl[3]) : 1 };
 		default:
 			return { dx : 1, dy : 1, color : parseColor(value), alpha : 1 };
 		}
@@ -207,9 +207,18 @@ class CustomParser extends CssValue.ValueParser {
 	public function parseFilter(value) : #if macro Bool #else h2d.filter.Filter #end {
 		return switch( value ) {
 		case VIdent("none"): #if macro true #else null #end;
-		case VIdent("grayed"): #if macro true #else h2d.filter.ColorMatrix.grayed() #end;
+		case VCall("grayscale",[]): #if macro true #else h2d.filter.ColorMatrix.grayed() #end;
+		case VCall("grayscale",[v]):
+			var v = parseFloatPercent(v);
+			#if macro
+				true;
+			#else
+				var f = new h2d.filter.ColorMatrix();
+				f.matrix.colorSaturate(-v);
+				f;
+			#end
 		case VCall("saturate",[v]):
-			var v = parseFloat(v);
+			var v = parseFloatPercent(v);
 			#if macro
 				true;
 			#else
@@ -226,7 +235,7 @@ class CustomParser extends CssValue.ValueParser {
 				new h2d.filter.Outline(s, c);
 			#end
 		case VCall("brightness",[v]):
-			var v = parseFloat(v);
+			var v = parseFloatPercent(v);
 			#if macro
 				true;
 			#else