Skip to content

Commit

Permalink
feat(css): Update syntax of filter functions for optional parameters
Browse files Browse the repository at this point in the history
  • Loading branch information
@skyclouds2001
skyclouds2001 authored Jan 5, 2025
1 parent 23379df commit 62b8f26
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 36 deletions.
44 changes: 18 additions & 26 deletions css/functions.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,15 +69,15 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/attr"
},
"blur()": {
"syntax": "blur( <length> )",
"syntax": "blur( <length>? )",
"groups": [
"Filter Effects"
],
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/blur"
},
"brightness()": {
"syntax": "brightness( <number-percentage> )",
"syntax": "brightness( [ <number> | <percentage> ]? )",
"groups": [
"Filter Effects"
],
Expand Down Expand Up @@ -129,10 +129,9 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/gradient/conic-gradient"
},
"contrast()": {
"syntax": "contrast( [ <number-percentage> ] )",
"syntax": "contrast( [ <number> | <percentage> ]? )",
"groups": [
"Filter Effects",
"CSS Color"
"Filter Effects"
],
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/contrast"
Expand Down Expand Up @@ -172,10 +171,9 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/cross-fade"
},
"drop-shadow()": {
"syntax": "drop-shadow( <length>{2,3} <color>? )",
"syntax": "drop-shadow( [ <color>? && <length>{2,3} ] )",
"groups": [
"Filter Effects",
"CSS Color"
"Filter Effects"
],
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/drop-shadow"
Expand Down Expand Up @@ -222,10 +220,9 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/fit-content_function"
},
"grayscale()": {
"syntax": "grayscale( <number-percentage> )",
"syntax": "grayscale( [ <number> | <percentage> ]? )",
"groups": [
"Filter Effects",
"CSS Color"
"Filter Effects"
],
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/grayscale"
Expand All @@ -247,10 +244,9 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/color_value/hsl"
},
"hue-rotate()": {
"syntax": "hue-rotate( <angle> )",
"syntax": "hue-rotate( [ <angle> | <zero> ]? )",
"groups": [
"Filter Effects",
"CSS Color"
"Filter Effects"
],
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/hue-rotate"
Expand Down Expand Up @@ -297,10 +293,9 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/basic-shape/inset"
},
"invert()": {
"syntax": "invert( <number-percentage> )",
"syntax": "invert( [ <number> | <percentage> ]? )",
"groups": [
"Filter Effects",
"CSS Color"
"Filter Effects"
],
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/invert"
Expand Down Expand Up @@ -431,10 +426,9 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/color_value/oklch"
},
"opacity()": {
"syntax": "opacity( [ <number-percentage> ] )",
"syntax": "opacity( [ <number> | <percentage> ]? )",
"groups": [
"Filter Effects",
"CSS Color"
"Filter Effects"
],
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/opacity"
Expand Down Expand Up @@ -608,10 +602,9 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/round"
},
"saturate()": {
"syntax": "saturate( <number-percentage> )",
"syntax": "saturate( [ <number> | <percentage> ]? )",
"groups": [
"Filter Effects",
"CSS Color"
"Filter Effects"
],
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/saturate"
Expand Down Expand Up @@ -665,10 +658,9 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/animation-timeline/scroll"
},
"sepia()": {
"syntax": "sepia( <number-percentage> )",
"syntax": "sepia( [ <number> | <percentage> ]? )",
"groups": [
"Filter Effects",
"CSS Color"
"Filter Effects"
],
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/filter-function/sepia"
Expand Down
20 changes: 10 additions & 10 deletions css/syntaxes.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,10 +99,10 @@
"syntax": "normal | multiply | screen | overlay | darken | lighten | color-dodge | color-burn | hard-light | soft-light | difference | exclusion | hue | saturation | color | luminosity"
},
"blur()": {
"syntax": "blur( <length> )"
"syntax": "blur( <length>? )"
},
"brightness()": {
"syntax": "brightness( <number-percentage> )"
"syntax": "brightness( [ <number> | <percentage> ]? )"
},
"calc()": {
"syntax": "calc( <calc-sum> )"
Expand Down Expand Up @@ -207,7 +207,7 @@
"syntax": "[ contextual | no-contextual ]"
},
"contrast()": {
"syntax": "contrast( [ <number-percentage> ] )"
"syntax": "contrast( [ <number> | <percentage> ]? )"
},
"coord-box": {
"syntax": "<paint-box> | view-box"
Expand Down Expand Up @@ -267,7 +267,7 @@
"syntax": "block | inline | run-in"
},
"drop-shadow()": {
"syntax": "drop-shadow( <length>{2,3} <color>? )"
"syntax": "drop-shadow( [ <color>? && <length>{2,3} ] )"
},
"easing-function": {
"syntax": "linear | <cubic-bezier-timing-function> | <step-timing-function>"
Expand Down Expand Up @@ -372,7 +372,7 @@
"syntax": "<linear-gradient()> | <repeating-linear-gradient()> | <radial-gradient()> | <repeating-radial-gradient()> | <conic-gradient()> | <repeating-conic-gradient()>"
},
"grayscale()": {
"syntax": "grayscale( <number-percentage> )"
"syntax": "grayscale( [ <number> | <percentage> ]? )"
},
"grid-line": {
"syntax": "auto | <custom-ident> | [ <integer> && <custom-ident>? ] | [ span && [ <integer> || <custom-ident> ] ]"
Expand All @@ -393,7 +393,7 @@
"syntax": "[ shorter | longer | increasing | decreasing ] hue"
},
"hue-rotate()": {
"syntax": "hue-rotate( <angle> )"
"syntax": "hue-rotate( [ <angle> | <zero> ]? )"
},
"hwb()": {
"syntax": "hwb( [<hue> | none] [<percentage> | none] [<percentage> | none] [ / [<alpha-value> | none] ]? )"
Expand Down Expand Up @@ -429,7 +429,7 @@
"syntax": "inset( <length-percentage>{1,4} [ round <'border-radius'> ]? )"
},
"invert()": {
"syntax": "invert( <number-percentage> )"
"syntax": "invert( [ <number> | <percentage> ]? )"
},
"keyframe-block": {
"syntax": "<keyframe-selector># {\n <declaration-list>\n}"
Expand Down Expand Up @@ -606,7 +606,7 @@
"syntax": "oklch( [ <percentage> | <number> | none] [ <percentage> | <number> | none] [ <hue> | none] [ / [<alpha-value> | none] ]? )"
},
"opacity()": {
"syntax": "opacity( [ <number-percentage> ] )"
"syntax": "opacity( [ <number> | <percentage> ]? )"
},
"opacity-value": {
"syntax": "<number> | <percentage>"
Expand Down Expand Up @@ -756,7 +756,7 @@
"syntax": "nearest | up | down | to-zero"
},
"saturate()": {
"syntax": "saturate( <number-percentage> )"
"syntax": "saturate( [ <number> | <percentage> ]? )"
},
"scale()": {
"syntax": "scale( [ <number> | <percentage> ]#{1,2} )"
Expand Down Expand Up @@ -792,7 +792,7 @@
"syntax": "center | start | end | self-start | self-end | flex-start | flex-end"
},
"sepia()": {
"syntax": "sepia( <number-percentage> )"
"syntax": "sepia( [ <number> | <percentage> ]? )"
},
"shadow": {
"syntax": "inset? && <length>{2,4} && <color>?"
Expand Down

0 comments on commit 62b8f26

Please sign in to comment.