@webref/css 5.1.1 → 5.2.1

package/css-align.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Box Alignment Module Level 3",
-    "url": "https://drafts.csswg.org/css-align/"
+    "url": "https://drafts.csswg.org/css-align-3/"
   },
   "properties": {
     "align-content": {

package/css-animations.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Animations Level 1",
-    "url": "https://drafts.csswg.org/css-animations/"
+    "url": "https://drafts.csswg.org/css-animations-1/"
   },
   "properties": {
     "animation-name": {
@@ -94,21 +94,6 @@
         "animationPlayState"
       ]
     },
-    "animation-delay": {
-      "name": "animation-delay",
-      "value": "<time>#",
-      "initial": "0s",
-      "appliesTo": "all elements",
-      "inherited": "no",
-      "percentages": "N/A",
-      "computedValue": "list, each item a duration",
-      "canonicalOrder": "per grammar",
-      "animationType": "not animatable",
-      "styleDeclaration": [
-        "animation-delay",
-        "animationDelay"
-      ]
-    },
     "animation-fill-mode": {
       "name": "animation-fill-mode",
       "value": "<single-animation-fill-mode>#",
@@ -166,9 +151,6 @@
     },
     "<keyframe-block>": {
       "value": "<keyframe-selector># { <declaration-list> }"
-    },
-    "<keyframe-selector>": {
-      "value": "from | to | <percentage [0,100]>"
     }
   }
 }

package/css-backgrounds-4.json

@@ -52,7 +52,7 @@
     "background-position-inline": {
       "name": "background-position-inline",
       "value": "[ center | [ start | end ]? <length-percentage>? ]#",
-      "initial": "not applicable (initial value comes from physical property)",
+      "initial": "0%",
       "appliesTo": "all elements",
       "inherited": "no",
       "percentages": "refer to inline-size of background positioning area minus inline-size of background image",
@@ -67,7 +67,7 @@
     "background-position-block": {
       "name": "background-position-block",
       "value": "[ center | [ start | end ]? <length-percentage>? ]#",
-      "initial": "not applicable (initial value comes from physical property)",
+      "initial": "0%",
       "appliesTo": "all elements",
       "inherited": "no",
       "percentages": "refer to size of background positioning area minus size of background image",

package/css-backgrounds.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Backgrounds and Borders Module Level 3",
-    "url": "https://drafts.csswg.org/css-backgrounds/"
+    "url": "https://drafts.csswg.org/css-backgrounds-3/"
   },
   "properties": {
     "background-color": {

package/css-cascade-6.json

@@ -15,7 +15,7 @@
       "prose": "The <scope-start> is a <forgiving-selector-list>. Each element matched by <scope-start> is a scoping element, creating a scope with itself as the scoping root."
     },
     "<scope-end>": {
-      "prose": "The <scope-end> is a <forgiving-selector-list> that is scoped by the <scope-start> selector, with the scoping roots as :scope elements. Each element matched by <scope-end> is a scoping limit. The scoping limit elements define the lower bounds of a scope, so that scoped selectors are not able to match any elements nested within them."
+      "prose": "The <scope-end> is a <forgiving-selector-list> that is scoped by the <scope-start> selector, with the scoping roots as :scope elements. Each element matched by <scope-end> is a scoping limit. The scoping limit elements define the lower bounds of a scope, so that scoped selectors are not able to match any scoping limit elements, or any elements nested within them."
     },
     "<selector-scope>": {
       "value": "( <scope-start> [/ <scope-end>]? )"

package/css-contain-3.json

@@ -58,7 +58,7 @@
   },
   "atrules": {
     "@container": {
-      "value": "@container [ <container-name> ]? <container-condition> { <stylesheet> }",
+      "value": "@container <container-condition> { <stylesheet> }",
       "descriptors": [
         {
           "name": "width",
@@ -106,23 +106,23 @@
     "<style-feature>": {
       "prose": "A container style query allows querying the computed values of the query container. It is a boolean combination of individual style features (<style-feature>) that each query a single, specific property of the query container. The syntax of a <style-feature> is the same as for a declaration [CSS-SYNTAX-3], and its query is true if the computed value of the given property on the query container matches the given value (which is also computed with respect to the query container), unknown if the property or its value is invalid or unsupported, and false otherwise. The boolean syntax and logic combining style features into a style query is the same as for CSS feature queries. (See @supports. [CSS-CONDITIONAL-3])"
     },
+    "<container-condition>": {
+      "value": "[ <container-name> ]? <container-query>"
+    },
     "<container-name>": {
       "value": "<custom-ident>"
     },
-    "<container-condition>": {
+    "<container-query>": {
       "value": "not <query-in-parens> | <query-in-parens> [ [ and <query-in-parens> ]* | [ or <query-in-parens> ]* ]"
     },
     "<query-in-parens>": {
-      "value": "( <container-condition> ) | ( <size-feature> ) | style( <style-query> ) | <general-enclosed>"
+      "value": "( <container-query> ) | ( <size-feature> ) | style( <style-query> ) | <general-enclosed>"
     },
     "<style-query>": {
-      "value": "<style-condition> | <style-feature>"
-    },
-    "<style-condition>": {
-      "value": "not <style-in-parens> | <style-in-parens> [ [ and <style-in-parens> ]* | [ or <style-in-parens> ]* ]"
+      "value": "not <style-in-parens> | <style-in-parens> [ [ and <style-in-parens> ]* | [ or <style-in-parens> ]* ] | <style-feature>"
     },
     "<style-in-parens>": {
-      "value": "( <style-condition> ) | ( <style-feature> ) | <general-enclosed>"
+      "value": "( <style-query> ) | ( <style-feature> ) | <general-enclosed>"
     }
   }
 }

package/css-counter-styles.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Counter Styles Level 3",
-    "url": "https://drafts.csswg.org/css-counter-styles/"
+    "url": "https://drafts.csswg.org/css-counter-styles-3/"
   },
   "properties": {},
   "atrules": {

package/css-device-adapt.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Device Adaptation Module Level 1",
-    "url": "https://drafts.csswg.org/css-device-adapt/"
+    "url": "https://drafts.csswg.org/css-device-adapt-1/"
   },
   "properties": {},
   "atrules": {

package/css-display.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Display Module Level 3",
-    "url": "https://drafts.csswg.org/css-display/"
+    "url": "https://drafts.csswg.org/css-display-3/"
   },
   "properties": {
     "display": {

package/css-exclusions.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Exclusions Module Level 1",
-    "url": "https://drafts.csswg.org/css-exclusions/"
+    "url": "https://drafts.csswg.org/css-exclusions-1/"
   },
   "properties": {
     "wrap-flow": {

package/css-fonts.json

@@ -58,7 +58,7 @@
       "percentages": "n/a",
       "computedValue": "the keyword specified, plus angle in degrees if specified",
       "canonicalOrder": "per grammar",
-      "animationType": "by computed value type; normal animates as 'oblique 0deg'",
+      "animationType": "by computed value type; normal animates as oblique 0deg",
       "styleDeclaration": [
         "font-style",
         "fontStyle"
@@ -277,7 +277,7 @@
     },
     "font-variant": {
       "name": "font-variant",
-      "value": "normal | none | [ <common-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <contextual-alt-values> || [ small-caps | all-small-caps | petite-caps | all-petite-caps | unicase | titling-caps ] || [ stylistic(<feature-value-name>) || historical-forms || styleset(<feature-value-name>#) || character-variant(<feature-value-name>#) || swash(<feature-value-name>) || ornaments(<feature-value-name>) || annotation(<feature-value-name>) ] || <numeric-figure-values> || <numeric-spacing-values> || <numeric-fraction-values> || ordinal || slashed-zero || <east-asian-variant-values> || <east-asian-width-values> || ruby || [ sub | super ] || [ text | emoji | unicode ] ]",
+      "value": "normal | none | [ [ <common-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <contextual-alt-values> ] || [ small-caps | all-small-caps | petite-caps | all-petite-caps | unicase | titling-caps ] || [ stylistic(<feature-value-name>) || historical-forms || styleset(<feature-value-name>#) || character-variant(<feature-value-name>#) || swash(<feature-value-name>) || ornaments(<feature-value-name>) || annotation(<feature-value-name>) ] || [ <numeric-figure-values> || <numeric-spacing-values> || <numeric-fraction-values> || ordinal || slashed-zero ] || [ <east-asian-variant-values> || <east-asian-width-values> || ruby ] || [ sub | super ] || [ text | emoji | unicode ] ]",
       "initial": "normal",
       "appliesTo": "all elements and text",
       "inherited": "yes",
@@ -488,7 +488,7 @@
         {
           "name": "font-family",
           "for": "@font-palette-values",
-          "value": "<'font-family'>",
+          "value": "<family-name>#",
           "initial": "N/A"
         },
         {

package/css-gcpm.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Generated Content for Paged Media Module",
-    "url": "https://drafts.csswg.org/css-gcpm/"
+    "url": "https://drafts.csswg.org/css-gcpm-3/"
   },
   "properties": {
     "position": {

package/css-line-grid.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Line Grid Module Level 1",
-    "url": "https://drafts.csswg.org/css-line-grid/"
+    "url": "https://drafts.csswg.org/css-line-grid-1/"
   },
   "properties": {
     "line-grid": {

package/css-multicol.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Multi-column Layout Module Level 1",
-    "url": "https://drafts.csswg.org/css-multicol/"
+    "url": "https://drafts.csswg.org/css-multicol-1/"
   },
   "properties": {
     "column-width": {

package/css-namespaces.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Namespaces Module Level 3",
-    "url": "https://drafts.csswg.org/css-namespaces/"
+    "url": "https://drafts.csswg.org/css-namespaces-3/"
   },
   "properties": {},
   "atrules": {

package/css-nesting.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Nesting Module",
-    "url": "https://drafts.csswg.org/css-nesting/"
+    "url": "https://drafts.csswg.org/css-nesting-1/"
   },
   "properties": {},
   "atrules": {

package/css-page-floats.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Page Floats",
-    "url": "https://drafts.csswg.org/css-page-floats/"
+    "url": "https://drafts.csswg.org/css-page-floats-3/"
   },
   "properties": {
     "float-reference": {

package/css-regions.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Regions Module Level 1",
-    "url": "https://drafts.csswg.org/css-regions/"
+    "url": "https://drafts.csswg.org/css-regions-1/"
   },
   "properties": {
     "flow-into": {

package/css-rhythm.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Rhythmic Sizing",
-    "url": "https://drafts.csswg.org/css-rhythm/"
+    "url": "https://drafts.csswg.org/css-rhythm-1/"
   },
   "properties": {
     "block-step-size": {

package/css-round-display.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Round Display Level 1",
-    "url": "https://drafts.csswg.org/css-round-display/"
+    "url": "https://drafts.csswg.org/css-round-display-1/"
   },
   "properties": {
     "border-boundary": {

package/css-scroll-anchoring.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Scroll Anchoring Module Level 1",
-    "url": "https://drafts.csswg.org/css-scroll-anchoring/"
+    "url": "https://drafts.csswg.org/css-scroll-anchoring-1/"
   },
   "properties": {
     "overflow-anchor": {

package/css-scrollbars.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Scrollbars Styling Module Level 1",
-    "url": "https://drafts.csswg.org/css-scrollbars/"
+    "url": "https://drafts.csswg.org/css-scrollbars-1/"
   },
   "properties": {
     "scrollbar-color": {

package/css-shadow-parts.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Shadow Parts",
-    "url": "https://drafts.csswg.org/css-shadow-parts/"
+    "url": "https://drafts.csswg.org/css-shadow-parts-1/"
   },
   "properties": {},
   "atrules": {},

package/css-shapes.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Shapes Module Level 1",
-    "url": "https://drafts.csswg.org/css-shapes/"
+    "url": "https://drafts.csswg.org/css-shapes-1/"
   },
   "properties": {
     "shape-outside": {

package/css-shared-element-transitions.json

@@ -0,0 +1,29 @@
+{
+  "spec": {
+    "title": "CSS Shared Element Transitions Module Level 1",
+    "url": "https://drafts.csswg.org/css-shared-element-transitions-1/"
+  },
+  "properties": {
+    "page-transition-tag": {
+      "name": "page-transition-tag",
+      "value": "none | <custom-ident>",
+      "initial": "none",
+      "appliesTo": "all elements",
+      "inherited": "no",
+      "percentages": "n/a",
+      "computedValue": "as specified",
+      "canonicalOrder": "per grammar",
+      "animationType": "discrete",
+      "styleDeclaration": [
+        "page-transition-tag",
+        "pageTransitionTag"
+      ]
+    }
+  },
+  "atrules": {},
+  "valuespaces": {
+    "<pt-tag-selector>": {
+      "value": "'*' | <custom-ident>"
+    }
+  }
+}

package/css-syntax.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Syntax Module Level 3",
-    "url": "https://drafts.csswg.org/css-syntax/"
+    "url": "https://drafts.csswg.org/css-syntax-3/"
   },
   "properties": {},
   "atrules": {},

package/css-transforms.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Transforms Module Level 1",
-    "url": "https://drafts.csswg.org/css-transforms/"
+    "url": "https://drafts.csswg.org/css-transforms-1/"
   },
   "properties": {
     "transform": {

package/css-transitions.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Transitions",
-    "url": "https://drafts.csswg.org/css-transitions/"
+    "url": "https://drafts.csswg.org/css-transitions-1/"
   },
   "properties": {
     "transition-property": {

package/css-will-change.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Will Change Module Level 1",
-    "url": "https://drafts.csswg.org/css-will-change/"
+    "url": "https://drafts.csswg.org/css-will-change-1/"
   },
   "properties": {
     "will-change": {

package/fill-stroke.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "CSS Fill and Stroke Module Level 3",
-    "url": "https://drafts.fxtf.org/fill-stroke/"
+    "url": "https://drafts.fxtf.org/fill-stroke-3/"
   },
   "properties": {
     "fill-rule": {

package/filter-effects.json

@@ -102,31 +102,31 @@
       "value": "blur( <length>? )"
     },
     "<brightness()>": {
-      "value": "brightness( <number-percentage>? )"
+      "value": "brightness( [ <number> | <percentage> ]? )"
     },
     "<contrast()>": {
-      "value": "contrast( <number-percentage>? )"
+      "value": "contrast( [ <number> | <percentage> ]? )"
     },
     "<drop-shadow()>": {
       "value": "drop-shadow( [ <color>? && <length>{2,3} ] )"
     },
     "<grayscale()>": {
-      "value": "grayscale( <number-percentage>? )"
+      "value": "grayscale( [ <number> | <percentage> ]? )"
     },
     "<hue-rotate()>": {
       "value": "hue-rotate( [ <angle> | <zero> ]? )"
     },
     "<invert()>": {
-      "value": "invert( <number-percentage>? )"
+      "value": "invert( [ <number> | <percentage> ]? )"
     },
     "<opacity()>": {
-      "value": "opacity( <number-percentage>? )"
+      "value": "opacity( [ <number> | <percentage> ]? )"
     },
     "<saturate()>": {
-      "value": "saturate( <number-percentage>? )"
+      "value": "saturate( [ <number> | <percentage> ]? )"
     },
     "<sepia()>": {
-      "value": "sepia( <number-percentage>? )"
+      "value": "sepia( [ <number> | <percentage> ]? )"
     },
     "<filter()>": {
       "value": "filter( [ <image> | <string> ], <filter-value-list> )"

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@webref/css",
   "description": "CSS definitions of the web platform",
-  "version": "5.1.1",
+  "version": "5.2.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/w3c/webref.git"

package/scroll-animations.json

@@ -108,10 +108,73 @@
         "view-timeline",
         "viewTimeline"
       ]
+    },
+    "animation-delay": {
+      "name": "animation-delay",
+      "value": "[ <'animation-delay-start'> <'animation-delay-end'>? | <timeline-range-name> ]#",
+      "initial": "see individual properties",
+      "appliesTo": "see individual properties",
+      "inherited": "see individual properties",
+      "percentages": "see individual properties",
+      "computedValue": "see individual properties",
+      "animationType": "see individual properties",
+      "canonicalOrder": "per grammar",
+      "styleDeclaration": [
+        "animation-delay",
+        "animationDelay"
+      ]
+    },
+    "animation-range": {
+      "name": "animation-range",
+      "value": "[ <'animation-delay-start'> <'animation-delay-end'>? | <timeline-range-name> ]#",
+      "initial": "see individual properties",
+      "appliesTo": "see individual properties",
+      "inherited": "see individual properties",
+      "percentages": "see individual properties",
+      "computedValue": "see individual properties",
+      "animationType": "see individual properties",
+      "canonicalOrder": "per grammar",
+      "styleDeclaration": [
+        "animation-range",
+        "animationRange"
+      ]
+    },
+    "animation-delay-start": {
+      "name": "animation-delay-start",
+      "value": "[ <time> | <timeline-range-name> <percentage> ]",
+      "initial": "0s",
+      "appliesTo": "all elements",
+      "inherited": "no",
+      "percentages": "relative to the specified named timeline range",
+      "computedValue": "list, each item either a duration or a timeline range and progress percentage",
+      "canonicalOrder": "per grammar",
+      "animatable": "no",
+      "styleDeclaration": [
+        "animation-delay-start",
+        "animationDelayStart"
+      ]
+    },
+    "animation-delay-end": {
+      "name": "animation-delay-end",
+      "value": "[ <time> | <timeline-range-name> <percentage> ]",
+      "initial": "0s",
+      "appliesTo": "all elements",
+      "inherited": "no",
+      "percentages": "relative to the specified named timeline range",
+      "computedValue": "list, each item either a duration or a timeline range and progress percentage",
+      "canonicalOrder": "per grammar",
+      "animatable": "no",
+      "styleDeclaration": [
+        "animation-delay-end",
+        "animationDelayEnd"
+      ]
     }
   },
   "atrules": {},
   "valuespaces": {
+    "<timeline-range-name>": {
+      "prose": "A named timeline range is a named segment of an animation timeline. The start of the segment is represented as 0% progress through the range; the end of the segment is represented as 100% progress through the range. Multiple named timeline ranges can be attached to a given timeline, and multiple such ranges can overlap. For example, the contain range of a view progress timeline overlaps with its cover range. Named timeline ranges are represented by the <timeline-range-name> value type, which indicates a CSS identifier representing one of the predefined named timeline ranges."
+    },
     "<scroll()>": {
       "value": "scroll( <axis>? <scroller>? )"
     },
@@ -120,6 +183,9 @@
     },
     "<scroller>": {
       "value": "root | nearest"
+    },
+    "<keyframe-selector>": {
+      "value": "from | to | <percentage> | <timeline-range-name> <percentage>"
     }
   }
 }

package/selectors.json

@@ -1,7 +1,7 @@
 {
   "spec": {
     "title": "Selectors Level 4",
-    "url": "https://drafts.csswg.org/selectors/"
+    "url": "https://drafts.csswg.org/selectors-4/"
   },
   "properties": {},
   "atrules": {},