From a4310d6c6af905ab1d32bd13de8f59376d1d236b Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Sun, 29 Dec 2024 15:31:00 +0800
Subject: [PATCH 1/2] feat(css): Update syntax for color functions

---
 css/functions.json | 10 +++++-----
 css/syntaxes.json  | 10 +++++-----
 2 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/css/functions.json b/css/functions.json
index 639b46908..d39160364 100644
--- a/css/functions.json
+++ b/css/functions.json
@@ -231,7 +231,7 @@
     "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/grayscale"
   },
   "hsl()": {
-    "syntax": "hsl( <hue> <percentage> <percentage> [ / <alpha-value> ]? ) | hsl( <hue>, <percentage>, <percentage>, <alpha-value>? )",
+    "syntax": "hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? ) | hsl( <hue>, <percentage>, <percentage>, <alpha-value>? )",
     "groups": [
       "CSS Color"
     ],
@@ -239,7 +239,7 @@
     "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/color_value/hsl"
   },
   "hsla()": {
-    "syntax": "hsla( <hue> <percentage> <percentage> [ / <alpha-value> ]? ) | hsla( <hue>, <percentage>, <percentage>, <alpha-value>? )",
+    "syntax": "hsla( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? ) | hsla( <hue>, <percentage>, <percentage>, <alpha-value>? )",
     "groups": [
       "CSS Color"
     ],
@@ -265,7 +265,7 @@
     "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/hypot"
   },
   "hwb()": {
-    "syntax": "hwb( [<hue> | none] [<percentage> | none] [<percentage> | none] [ / [<alpha-value> | none] ]? )",
+    "syntax": "hwb( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )",
     "groups": [
       "CSS Color"
     ],
@@ -543,7 +543,7 @@
     "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/gradient/repeating-linear-gradient"
   },
   "rgb()": {
-    "syntax": "rgb( <percentage>{3} [ / <alpha-value> ]? ) | rgb( <number>{3} [ / <alpha-value> ]? ) | rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )",
+    "syntax": "rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  ) | rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )",
     "groups": [
       "CSS Color"
     ],
@@ -551,7 +551,7 @@
     "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/color_value/rgb"
   },
   "rgba()": {
-    "syntax": "rgba( <percentage>{3} [ / <alpha-value> ]? ) | rgba( <number>{3} [ / <alpha-value> ]? ) | rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )",
+    "syntax": "rgba( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  ) | rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )",
     "groups": [
       "CSS Color"
     ],
diff --git a/css/syntaxes.json b/css/syntaxes.json
index 8d075acb3..16fd10484 100644
--- a/css/syntaxes.json
+++ b/css/syntaxes.json
@@ -375,10 +375,10 @@
     "syntax": "[ historical-ligatures | no-historical-ligatures ]"
   },
   "hsl()": {
-    "syntax": "hsl( <hue> <percentage> <percentage> [ / <alpha-value> ]? ) | hsl( <hue>, <percentage>, <percentage>, <alpha-value>? )"
+    "syntax": "hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? ) | hsl( <hue>, <percentage>, <percentage>, <alpha-value>? )"
   },
   "hsla()": {
-    "syntax": "hsla( <hue> <percentage> <percentage> [ / <alpha-value> ]? ) | hsla( <hue>, <percentage>, <percentage>, <alpha-value>? )"
+    "syntax": "hsla( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? ) | hsla( <hue>, <percentage>, <percentage>, <alpha-value>? )"
   },
   "hue": {
     "syntax": "<number> | <angle>"
@@ -390,7 +390,7 @@
     "syntax": "hue-rotate( <angle> )"
   },
   "hwb()": {
-    "syntax": "hwb( [<hue> | none] [<percentage> | none] [<percentage> | none] [ / [<alpha-value> | none] ]? )"
+    "syntax": "hwb( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )"
   },
   "hypot()": {
     "syntax": "hypot( <calc-sum># )"
@@ -723,10 +723,10 @@
     "syntax": "reversed( <counter-name> )"
   },
   "rgb()": {
-    "syntax": "rgb( <percentage>{3} [ / <alpha-value> ]? ) | rgb( <number>{3} [ / <alpha-value> ]? ) | rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )"
+    "syntax": "rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  ) | rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )"
   },
   "rgba()": {
-    "syntax": "rgba( <percentage>{3} [ / <alpha-value> ]? ) | rgba( <number>{3} [ / <alpha-value> ]? ) | rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )"
+    "syntax": "rgba( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  ) | rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )"
   },
   "rotate()": {
     "syntax": "rotate( [ <angle> | <zero> ] )"

From 30e4fe1a5f79af57ec7950a7493a82aa8b4cf1a9 Mon Sep 17 00:00:00 2001
From: skyclouds2001 <95597335+skyclouds2001@users.noreply.github.com>
Date: Tue, 4 Feb 2025 21:56:51 +0800
Subject: [PATCH 2/2] Apply suggestions from code review

---
 css/functions.json | 8 ++++----
 css/syntaxes.json  | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/css/functions.json b/css/functions.json
index 799dd758b..3d49440e8 100644
--- a/css/functions.json
+++ b/css/functions.json
@@ -239,7 +239,7 @@
     "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/grayscale"
   },
   "hsl()": {
-    "syntax": "hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? ) | hsl( <hue>, <percentage>, <percentage>, <alpha-value>? )",
+    "syntax": "hsl( <hue>, <percentage>, <percentage>, <alpha-value>? ) | hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )",
     "groups": [
       "CSS Color"
     ],
@@ -247,7 +247,7 @@
     "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/color_value/hsl"
   },
   "hsla()": {
-    "syntax": "hsla( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? ) | hsla( <hue>, <percentage>, <percentage>, <alpha-value>? )",
+    "syntax": "hsla( <hue>, <percentage>, <percentage>, <alpha-value>? ) | hsla( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )",
     "groups": [
       "CSS Color"
     ],
@@ -551,7 +551,7 @@
     "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/gradient/repeating-radial-gradient"
   },
   "rgb()": {
-    "syntax": "rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  ) | rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )",
+    "syntax": "rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? ) | rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  )",
     "groups": [
       "CSS Color"
     ],
@@ -559,7 +559,7 @@
     "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/color_value/rgb"
   },
   "rgba()": {
-    "syntax": "rgba( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  ) | rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )",
+    "syntax": "rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? ) | rgba( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  )",
     "groups": [
       "CSS Color"
     ],
diff --git a/css/syntaxes.json b/css/syntaxes.json
index 2c8ff434f..39ddf19b6 100644
--- a/css/syntaxes.json
+++ b/css/syntaxes.json
@@ -390,10 +390,10 @@
     "syntax": "[ historical-ligatures | no-historical-ligatures ]"
   },
   "hsl()": {
-    "syntax": "hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? ) | hsl( <hue>, <percentage>, <percentage>, <alpha-value>? )"
+    "syntax": "hsl( <hue>, <percentage>, <percentage>, <alpha-value>? ) | hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )"
   },
   "hsla()": {
-    "syntax": "hsla( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? ) | hsla( <hue>, <percentage>, <percentage>, <alpha-value>? )"
+    "syntax": "hsla( <hue>, <percentage>, <percentage>, <alpha-value>? ) | hsla( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )"
   },
   "hue": {
     "syntax": "<number> | <angle>"
@@ -744,10 +744,10 @@
     "syntax": "reversed( <counter-name> )"
   },
   "rgb()": {
-    "syntax": "rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  ) | rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )"
+    "syntax": "rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? ) | rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]? )"
   },
   "rgba()": {
-    "syntax": "rgba( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]?  ) | rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )"
+    "syntax": "rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? ) | rgba( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]? )"
   },
   "rotate()": {
     "syntax": "rotate( [ <angle> | <zero> ] )"