@webref/css 6.5.2 → 6.5.5

package/css-animations-2.json

@@ -91,7 +91,7 @@
         },
         {
           "name": "<custom-ident>",
-          "prose": "If a named scroll progress timeline or view progress timeline is in scope on this element, use the referenced timeline as defined in Scroll-driven Animations § 4.2 Named Timeline Scoping. Otherwise the animation is not associated with a timeline.",
+          "prose": "If a named scroll progress timeline or view progress timeline is in scope on this element, use the referenced timeline as defined in Scroll-driven Animations § 4.2 Named Timeline Scoping and Lookup. Otherwise the animation is not associated with a timeline.",
           "type": "value",
           "value": "<custom-ident>"
         },

package/css-contain-3.json

@@ -96,6 +96,21 @@
       "styleDeclaration": [
         "container"
       ]
+    },
+    {
+      "name": "content-visibility",
+      "value": "visible | auto | hidden",
+      "initial": "visible",
+      "appliesTo": "elements for which size containment can apply",
+      "inherited": "no",
+      "percentages": "n/a",
+      "computedValue": "as specified",
+      "canonicalOrder": "per grammar",
+      "animationType": "see § 8.1 Animating and Interpolating content-visibility",
+      "styleDeclaration": [
+        "content-visibility",
+        "contentVisibility"
+      ]
     }
   ],
   "atrules": [
@@ -189,22 +204,14 @@
       "type": "type",
       "value": "( <style-query> ) | ( <style-feature> ) | <general-enclosed>"
     },
-    {
-      "name": "<style-feature>",
-      "type": "type",
-      "value": "<ident> : <declaration-value> | <ident>"
-    },
     {
       "name": "<size-feature>",
       "prose": "A container size query allows querying the size of the query container’s principal box. It is a boolean combination of individual size features (<size-feature>) that each query a single, specific dimensional feature of the query container. The syntax of a <size-feature> is the same as for a media feature: a feature name, a comparator, and a value. [mediaqueries-5] The boolean syntax and logic combining size features into a size query is the same as for CSS feature queries. (See @supports. [CSS-CONDITIONAL-3])",
       "type": "type"
-    }
-  ],
-  "warnings": [
+    },
     {
-      "msg": "Duplicate definition",
       "name": "<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.",
+      "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 either the same as for a valid declaration [CSS-SYNTAX-3], a supported CSS property, or a <custom-property-name>.",
       "type": "type"
     }
   ]

package/css-images-4.json

@@ -149,9 +149,9 @@
       "value": "[ <linear-gradient()> | <repeating-linear-gradient()> | <radial-gradient()> | <repeating-radial-gradient()> | <conic-gradient()> | <repeating-conic-gradient()> ]"
     },
     {
-      "name": "linear-gradient()",
-      "type": "function",
-      "value": "linear-gradient( [ [ <angle> | to <side-or-corner> ] || <color-interpolation-method> ]? , <color-stop-list> )"
+      "name": "<linear-gradient-syntax>",
+      "type": "type",
+      "value": "[ [ <angle> | to <side-or-corner> ] || <color-interpolation-method> ]? , <color-stop-list>"
     },
     {
       "name": "<side-or-corner>",
@@ -159,14 +159,14 @@
       "value": "[left | right] || [top | bottom]"
     },
     {
-      "name": "radial-gradient()",
-      "type": "function",
-      "value": "radial-gradient( [ [ [ <rg-ending-shape> || <rg-size> ]? [ at <position> ]? ] || <color-interpolation-method>]? , <color-stop-list> )"
+      "name": "<radial-gradient-syntax>",
+      "type": "type",
+      "value": "[ [ [ <rg-ending-shape> || <rg-size> ]? [ at <position> ]? ] || <color-interpolation-method>]? , <color-stop-list>"
     },
     {
       "name": "conic-gradient()",
       "type": "function",
-      "value": "conic-gradient( [ [ [ from <angle> ]? [ at <position> ]? ] || <color-interpolation-method> ]? , <angular-color-stop-list> )",
+      "value": "conic-gradient( [ <conic-gradient-syntax> ] )",
       "values": [
         {
           "name": "<angle>",
@@ -182,6 +182,11 @@
         }
       ]
     },
+    {
+      "name": "<conic-gradient-syntax>",
+      "type": "type",
+      "value": "[ [ [ from <angle> ]? [ at <position> ]? ] || <color-interpolation-method> ]? , <angular-color-stop-list>"
+    },
     {
       "name": "repeating-linear-gradient()",
       "prose": "In addition to linear-gradient(), radial-gradient(), and conic-gradient(), this specification defines repeating-linear-gradient(), repeating-radial-gradient(), and repeating-conic-gradient() values. These notations take the same values and are interpreted the same as their respective non-repeating siblings defined previously.",
@@ -211,6 +216,21 @@
         }
       ]
     },
+    {
+      "name": "<repeating-conic-gradient()>",
+      "type": "type",
+      "value": "repeating-conic-gradient( [ <conic-gradient-syntax> ] )"
+    },
+    {
+      "name": "<repeating-linear-gradient()>",
+      "type": "type",
+      "value": "repeating-linear-gradient( [ <linear-gradient-syntax> ] )"
+    },
+    {
+      "name": "<repeating-radial-gradient()>",
+      "type": "type",
+      "value": "repeating-radial-gradient( [ <radial-gradient-syntax> ] )"
+    },
     {
       "name": "<color-stop-list>",
       "type": "type",

package/css-images.json

@@ -166,7 +166,12 @@
       "name": "linear-gradient()",
       "prose": "The linear-gradient() notation specifies a linear gradient in CSS. Its syntax is as follows:",
       "type": "function",
-      "value": "linear-gradient( [ <angle> | to <side-or-corner> ]? , <color-stop-list> )"
+      "value": "linear-gradient( [ <linear-gradient-syntax> ] )"
+    },
+    {
+      "name": "<linear-gradient-syntax>",
+      "type": "type",
+      "value": "[ <angle> | to <side-or-corner> ]? , <color-stop-list>"
     },
     {
       "name": "<side-or-corner>",
@@ -177,7 +182,7 @@
       "name": "radial-gradient()",
       "prose": "The radial-gradient() notation specifies a radial gradient by indicating the center of the gradient (where the 0% ellipse will be) and the size and shape of the ending shape (the 100% ellipse). Color stops are given as a list, just as for linear-gradient(). Starting from the gradient center and progressing towards (and potentially beyond) the ending shape, uniformly-scaled concentric ellipses are drawn and colored according to the specified color stops.",
       "type": "function",
-      "value": "radial-gradient( [ <rg-ending-shape> || <rg-size> ]? [ at <position> ]? , <color-stop-list> )",
+      "value": "radial-gradient( [ <radial-gradient-syntax> ] )",
       "values": [
         {
           "name": "<position>",
@@ -199,6 +204,11 @@
         }
       ]
     },
+    {
+      "name": "<radial-gradient-syntax>",
+      "type": "type",
+      "value": "[ <rg-ending-shape> || <rg-size> ]? [ at <position> ]? , <color-stop-list>"
+    },
     {
       "name": "<rg-size>",
       "type": "type",
@@ -296,6 +306,16 @@
         }
       ]
     },
+    {
+      "name": "<repeating-linear-gradient()>",
+      "type": "type",
+      "value": "repeating-linear-gradient( [ <linear-gradient-syntax> ] )"
+    },
+    {
+      "name": "<repeating-radial-gradient()>",
+      "type": "type",
+      "value": "repeating-radial-gradient( [ <radial-gradient-syntax> ] )"
+    },
     {
       "name": "<color-stop-list>",
       "type": "type",

package/css-position-4.json

@@ -17,13 +17,13 @@
       "values": [
         {
           "name": "none",
-          "prose": "The element is not in the top layer.",
+          "prose": "The element shouldn’t be in the top layer.",
           "type": "value",
           "value": "none"
         },
         {
           "name": "auto",
-          "prose": "The element is rendered as part of the top layer. Rather than generating boxes as part of its normal position in the document, it generates boxes as a sibling of the root element.",
+          "prose": "The element should be in the top layer. Rather than generating boxes as part of its normal position in the document, it generates boxes as a sibling of the root element.",
           "type": "value",
           "value": "auto"
         }

package/package.json

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

package/scroll-animations.json

@@ -8,7 +8,7 @@
       "name": "scroll-timeline-name",
       "value": "none | <custom-ident>#",
       "initial": "none",
-      "appliesTo": "scroll containers",
+      "appliesTo": "all elements",
       "inherited": "no",
       "percentages": "n/a",
       "computedValue": "the keyword none or a list of <custom-ident>s",
@@ -23,7 +23,7 @@
       "name": "scroll-timeline-axis",
       "value": "[ block | inline | vertical | horizontal ]#",
       "initial": "block",
-      "appliesTo": "scroll containers",
+      "appliesTo": "all elements",
       "inherited": "no",
       "percentages": "n/a",
       "computedValue": "a list of the keywords specified",
@@ -78,11 +78,46 @@
         "scrollTimelineAxis"
       ]
     },
+    {
+      "name": "scroll-timeline-attachment",
+      "value": "[ local | defer | ancestor ]#",
+      "initial": "local",
+      "appliesTo": "all elements",
+      "inherited": "no",
+      "percentages": "n/a",
+      "computedValue": "a list of the keywords specified",
+      "canonicalOrder": "per grammar",
+      "animationType": "not animatable",
+      "values": [
+        {
+          "name": "local",
+          "prose": "This scroll progress timeline name attaches to the corresponding scroll progress timeline defined on this box.",
+          "type": "value",
+          "value": "local"
+        },
+        {
+          "name": "defer",
+          "prose": "This scroll progress timeline name’s attachment is deferred to its descendants. In other words, this element declares a scroll progress timeline’s name and defines its scope (see § 4.2 Named Timeline Scoping and Lookup), but defers the timeline’s definition (scroll container source and axis) to its descendants. If more than one matching descendant scroll progress timeline exists, or if no such timeline exists, then the timeline name has no attachment, and represents an inactive timeline. Should it instead be ignored (be invisible to lookup)? (This might make it harder to implement.) If multiple, should it attach instead to the last declared timeline (in tree order) rather than invalidating the attachment?",
+          "type": "value",
+          "value": "defer"
+        },
+        {
+          "name": "ancestor",
+          "prose": "This scroll progress timeline definition, attaches to the closest matching scroll progress timeline name that was deferred (defer) by an ancestor (if any). If no such ancestor exists, the attachment is treated as local.",
+          "type": "value",
+          "value": "ancestor"
+        }
+      ],
+      "styleDeclaration": [
+        "scroll-timeline-attachment",
+        "scrollTimelineAttachment"
+      ]
+    },
     {
       "name": "scroll-timeline",
-      "value": "[ <'scroll-timeline-name'> <'scroll-timeline-axis'>? ]#",
+      "value": "[ <'scroll-timeline-name'> [ <'scroll-timeline-axis'> || <'scroll-timeline-attachment'> ]? ]#",
       "initial": "see individual properties",
-      "appliesTo": "scroll containers",
+      "appliesTo": "all elements",
       "inherited": "no",
       "percentages": "see individual properties",
       "computedValue": "see individual properties",
@@ -196,9 +231,44 @@
         "viewTimelineInset"
       ]
     },
+    {
+      "name": "view-timeline-attachment",
+      "value": "[ local | defer | ancestor ]#",
+      "initial": "local",
+      "appliesTo": "all elements",
+      "inherited": "no",
+      "percentages": "n/a",
+      "computedValue": "a list of the keywords specified",
+      "canonicalOrder": "per grammar",
+      "animationType": "not animatable",
+      "values": [
+        {
+          "name": "local",
+          "prose": "This view progress timeline name attaches to the corresponding view progress timeline defined on this box.",
+          "type": "value",
+          "value": "local"
+        },
+        {
+          "name": "defer",
+          "prose": "This view progress timeline name’s attachment is deferred to its descendants. In other words, this element declares a view progress timeline’s name and defines its scope (see § 4.2 Named Timeline Scoping and Lookup), but defers the timeline’s definition (subject, scroll container source, axis, and visibility range) to its descendants. If more than one matching descendant view progress timeline exists, or if no such timeline exists, then this timeline name has no attachment, and represents an inactive timeline.",
+          "type": "value",
+          "value": "defer"
+        },
+        {
+          "name": "ancestor",
+          "prose": "This view progress timeline definition attaches to the closest matching view progress timeline name that was deferred (defer) by an ancestor (if any). If no such ancestor exists, the attachment is treated as local.",
+          "type": "value",
+          "value": "ancestor"
+        }
+      ],
+      "styleDeclaration": [
+        "view-timeline-attachment",
+        "viewTimelineAttachment"
+      ]
+    },
     {
       "name": "view-timeline",
-      "value": "[ <'view-timeline-name'> <'view-timeline-axis'>? ]#",
+      "value": "[ <'view-timeline-name'> [ <'view-timeline-axis'> || <'view-timeline-attachment'> ]? ]#",
       "initial": "see individual properties",
       "appliesTo": "all elements",
       "inherited": "see individual properties",
@@ -381,7 +451,7 @@
     {
       "msg": "Dangling value",
       "name": "cover",
-      "prose": "Represents the full range of the view progress timeline: 0% progress represents the position at which the start border edge of the element’s principal box coincides with the end edge of its view progress visibility range. 100% progress represents the position at which the end border edge of the element’s principal box coincides with the start edge of its view progress visibility range.",
+      "prose": "Represents the full range of the view progress timeline: 0% progress represents the latest position at which the start border edge of the element’s principal box coincides with the end edge of its view progress visibility range. 100% progress represents the earliest position at which the end border edge of the element’s principal box coincides with the start edge of its view progress visibility range.",
       "type": "value",
       "value": "cover",
       "for": "animation-timeline-range"
@@ -389,7 +459,7 @@
     {
       "msg": "Dangling value",
       "name": "contain",
-      "prose": "Represents the range during which the principal box is either fully contained by, or fully covers, its view progress visibility range within the scrollport. 0% progress represents the earlier position at which: the start border edge of the element’s principal box coincides with the start edge of its view progress visibility range. the end border edge of the element’s principal box coincides with the end edge of its view progress visibility range. 100% progress represents the later position at which: the start border edge of the element’s principal box coincides with the start edge of its view progress visibility range. the end border edge of the element’s principal box coincides with the end edge of its view progress visibility range.",
+      "prose": "Represents the range during which the principal box is either fully contained by, or fully covers, its view progress visibility range within the scrollport. 0% progress represents the earliest position at which either: the start border edge of the element’s principal box coincides with the start edge of its view progress visibility range. the end border edge of the element’s principal box coincides with the end edge of its view progress visibility range. 100% progress represents the latest position at which either: the start border edge of the element’s principal box coincides with the start edge of its view progress visibility range. the end border edge of the element’s principal box coincides with the end edge of its view progress visibility range.",
       "type": "value",
       "value": "contain",
       "for": "animation-timeline-range"
@@ -413,7 +483,7 @@
     {
       "msg": "Dangling value",
       "name": "entry-crossing",
-      "prose": "Represents the range during which the principal box crosses the end border edge 0% progress represents the position at which the start border edge of the element’s principal box coincides with the end edge of its view progress visibility range. 100% progress represents the position at which the end border edge of the element’s principal box coincides with the end edge of its view progress visibility range.",
+      "prose": "Represents the range during which the principal box crosses the end border edge 0% progress represents the latest position at which the start border edge of the element’s principal box coincides with the end edge of its view progress visibility range. 100% progress represents the earliest position at which the end border edge of the element’s principal box coincides with the end edge of its view progress visibility range.",
       "type": "value",
       "value": "entry-crossing",
       "for": "animation-timeline-range"
@@ -421,7 +491,7 @@
     {
       "msg": "Dangling value",
       "name": "exit-crossing",
-      "prose": "Represents the range during which the principal box crosses the start border edge 0% progress represents the position at which the start border edge of the element’s principal box coincides with the start edge of its view progress visibility range. 100% progress represents the position at which the end border edge of the element’s principal box coincides with the start edge of its view progress visibility range.",
+      "prose": "Represents the range during which the principal box crosses the start border edge 0% progress represents the latest position at which the start border edge of the element’s principal box coincides with the start edge of its view progress visibility range. 100% progress represents the earliest position at which the end border edge of the element’s principal box coincides with the start edge of its view progress visibility range.",
       "type": "value",
       "value": "exit-crossing",
       "for": "animation-timeline-range"