@webref/css 5.4.3 → 6.0.0

package/scroll-animations.json

@@ -3,8 +3,8 @@
     "title": "Scroll-linked Animations",
     "url": "https://drafts.csswg.org/scroll-animations-1/"
   },
-  "properties": {
-    "scroll-timeline-name": {
+  "properties": [
+    {
       "name": "scroll-timeline-name",
       "value": "none | <custom-ident>",
       "initial": "none",
@@ -19,7 +19,7 @@
         "scrollTimelineName"
       ]
     },
-    "scroll-timeline-axis": {
+    {
       "name": "scroll-timeline-axis",
       "value": "block | inline | vertical | horizontal",
       "initial": "block",
@@ -29,12 +29,50 @@
       "computedValue": "the specified keyword",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
+      "values": [
+        {
+          "name": "block",
+          "prose": "Specifies to use the measure of progress along the block axis of the scroll container. (Default.)",
+          "type": "value",
+          "value": "block"
+        },
+        {
+          "name": "inline",
+          "prose": "Specifies to use the measure of progress along the inline axis of the scroll container.",
+          "type": "value",
+          "value": "inline"
+        },
+        {
+          "name": "vertical",
+          "prose": "Specifies to use the measure of progress along the vertical axis of the scroll container.",
+          "type": "value",
+          "value": "vertical"
+        },
+        {
+          "name": "horizontal",
+          "prose": "Specifies to use the measure of progress along the horizontal axis of the scroll container.",
+          "type": "value",
+          "value": "horizontal"
+        },
+        {
+          "name": "nearest",
+          "prose": "Specifies to use the nearest ancestor scroll container. (Default.)",
+          "type": "value",
+          "value": "nearest"
+        },
+        {
+          "name": "root",
+          "prose": "Specifies to use the document viewport as the scroll container.",
+          "type": "value",
+          "value": "root"
+        }
+      ],
       "styleDeclaration": [
         "scroll-timeline-axis",
         "scrollTimelineAxis"
       ]
     },
-    "scroll-timeline": {
+    {
       "name": "scroll-timeline",
       "value": "<'scroll-timeline-name'> || <'scroll-timeline-axis'>",
       "initial": "see individual properties",
@@ -49,7 +87,7 @@
         "scrollTimeline"
       ]
     },
-    "view-timeline-name": {
+    {
       "name": "view-timeline-name",
       "value": "none | <custom-ident>#",
       "initial": "none",
@@ -64,7 +102,7 @@
         "viewTimelineName"
       ]
     },
-    "view-timeline-axis": {
+    {
       "name": "view-timeline-axis",
       "value": "[ block | inline | vertical | horizontal ]#",
       "initial": "block",
@@ -74,12 +112,50 @@
       "computedValue": "a list of the keywords specified",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
+      "values": [
+        {
+          "name": "block",
+          "prose": "Specifies to use the measure of progress along the block axis of the scroll container. (Default.)",
+          "type": "value",
+          "value": "block"
+        },
+        {
+          "name": "inline",
+          "prose": "Specifies to use the measure of progress along the inline axis of the scroll container.",
+          "type": "value",
+          "value": "inline"
+        },
+        {
+          "name": "vertical",
+          "prose": "Specifies to use the measure of progress along the vertical axis of the scroll container.",
+          "type": "value",
+          "value": "vertical"
+        },
+        {
+          "name": "horizontal",
+          "prose": "Specifies to use the measure of progress along the horizontal axis of the scroll container.",
+          "type": "value",
+          "value": "horizontal"
+        },
+        {
+          "name": "nearest",
+          "prose": "Specifies to use the nearest ancestor scroll container. (Default.)",
+          "type": "value",
+          "value": "nearest"
+        },
+        {
+          "name": "root",
+          "prose": "Specifies to use the document viewport as the scroll container.",
+          "type": "value",
+          "value": "root"
+        }
+      ],
       "styleDeclaration": [
         "view-timeline-axis",
         "viewTimelineAxis"
       ]
     },
-    "view-timeline-inset": {
+    {
       "name": "view-timeline-inset",
       "value": "[ [ auto | <length-percentage> ]{1,2} ]#",
       "initial": "0",
@@ -89,12 +165,26 @@
       "computedValue": "a list consisting of two-value pairs representing the start and end insets each as either the keyword auto or a computed <length-percentage> value",
       "canonicalOrder": "per grammar",
       "animationType": "by computed value type",
+      "values": [
+        {
+          "name": "auto",
+          "prose": "Indicates to use the value of scroll-padding.",
+          "type": "value",
+          "value": "auto"
+        },
+        {
+          "name": "<length-percentage>",
+          "prose": "Like scroll-padding, defines an inward offset from the corresponding edge of the scrollport.",
+          "type": "value",
+          "value": "<length-percentage>"
+        }
+      ],
       "styleDeclaration": [
         "view-timeline-inset",
         "viewTimelineInset"
       ]
     },
-    "view-timeline": {
+    {
       "name": "view-timeline",
       "value": "[ <'view-timeline-name'> || <'view-timeline-axis'> ]#",
       "initial": "see individual properties",
@@ -109,7 +199,7 @@
         "viewTimeline"
       ]
     },
-    "animation-delay": {
+    {
       "name": "animation-delay",
       "value": "[ <'animation-delay-start'> <'animation-delay-end'>? | <timeline-range-name> ]#",
       "initial": "see individual properties",
@@ -124,7 +214,7 @@
         "animationDelay"
       ]
     },
-    "animation-range": {
+    {
       "name": "animation-range",
       "value": "[ <'animation-delay-start'> <'animation-delay-end'>? | <timeline-range-name> ]#",
       "initial": "see individual properties",
@@ -139,7 +229,7 @@
         "animationRange"
       ]
     },
-    "animation-delay-start": {
+    {
       "name": "animation-delay-start",
       "value": "[ <time> | <timeline-range-name> <percentage> ]#",
       "initial": "0s",
@@ -149,12 +239,26 @@
       "computedValue": "list, each item either a duration or a timeline range and progress percentage",
       "canonicalOrder": "per grammar",
       "animatable": "no",
+      "values": [
+        {
+          "name": "<time>",
+          "prose": "Defines the delay as a duration. See [CSS-ANIMATIONS-1].",
+          "type": "value",
+          "value": "<time>"
+        },
+        {
+          "name": "<timeline-range-name> <percentage>",
+          "prose": "Calculates the delay as the difference between the start of the animation and the specified point on the timeline.",
+          "type": "value",
+          "value": "<timeline-range-name> <percentage>"
+        }
+      ],
       "styleDeclaration": [
         "animation-delay-start",
         "animationDelayStart"
       ]
     },
-    "animation-delay-end": {
+    {
       "name": "animation-delay-end",
       "value": "[ <time> | <timeline-range-name> <percentage> ]",
       "initial": "0s",
@@ -164,29 +268,126 @@
       "computedValue": "list, each item either a duration or a timeline range and progress percentage",
       "canonicalOrder": "per grammar",
       "animatable": "no",
+      "values": [
+        {
+          "name": "<time>",
+          "prose": "Defines the delay as a duration. See [CSS-ANIMATIONS-1].",
+          "type": "value",
+          "value": "<time>"
+        },
+        {
+          "name": "<timeline-range-name> <percentage>",
+          "prose": "Calculates the delay as the difference between the start of the animation and the specified point on the timeline.",
+          "type": "value",
+          "value": "<timeline-range-name> <percentage>"
+        }
+      ],
       "styleDeclaration": [
         "animation-delay-end",
         "animationDelayEnd"
       ]
     }
-  },
-  "atrules": {},
-  "valuespaces": {
-    "<scroll()>": {
+  ],
+  "atrules": [],
+  "selectors": [],
+  "values": [
+    {
+      "name": "scroll()",
       "prose": "The scroll() functional notation can be used as a value of animation-timeline and specifies a scroll progress timeline. Its syntax is",
-      "value": "scroll( [ <scroller> || <axis> ]? )"
-    },
-    "<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."
+      "type": "function",
+      "value": "scroll( [ <scroller> || <axis> ]? )",
+      "values": [
+        {
+          "name": "block",
+          "prose": "Specifies to use the measure of progress along the block axis of the scroll container. (Default.)",
+          "type": "value",
+          "value": "block"
+        },
+        {
+          "name": "inline",
+          "prose": "Specifies to use the measure of progress along the inline axis of the scroll container.",
+          "type": "value",
+          "value": "inline"
+        },
+        {
+          "name": "vertical",
+          "prose": "Specifies to use the measure of progress along the vertical axis of the scroll container.",
+          "type": "value",
+          "value": "vertical"
+        },
+        {
+          "name": "horizontal",
+          "prose": "Specifies to use the measure of progress along the horizontal axis of the scroll container.",
+          "type": "value",
+          "value": "horizontal"
+        },
+        {
+          "name": "nearest",
+          "prose": "Specifies to use the nearest ancestor scroll container. (Default.)",
+          "type": "value",
+          "value": "nearest"
+        },
+        {
+          "name": "root",
+          "prose": "Specifies to use the document viewport as the scroll container.",
+          "type": "value",
+          "value": "root"
+        }
+      ]
     },
-    "<axis>": {
+    {
+      "name": "<axis>",
+      "type": "type",
       "value": "block | inline | vertical | horizontal"
     },
-    "<scroller>": {
+    {
+      "name": "<scroller>",
+      "type": "type",
       "value": "root | nearest"
     },
-    "<keyframe-selector>": {
+    {
+      "name": "<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.",
+      "type": "type"
+    }
+  ],
+  "warnings": [
+    {
+      "msg": "Missing definition",
+      "name": "<keyframe-selector>",
       "value": "from | to | <percentage> | <timeline-range-name> <percentage>"
+    },
+    {
+      "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.",
+      "type": "value",
+      "value": "cover",
+      "for": "animation-timeline-range"
+    },
+    {
+      "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.",
+      "type": "value",
+      "value": "contain",
+      "for": "animation-timeline-range"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "entry",
+      "prose": "Represents the range during which the principal box is entering the view progress visibility range. 0% is equivalent to 0% of the cover range. 100% is equivalent to 0% of the contain range. Should this be entry or enter?",
+      "type": "value",
+      "value": "entry",
+      "for": "animation-timeline-range"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "exit",
+      "prose": "Represents the range during which the principal box is exiting the view progress visibility range. 0% is equivalent to 100% of the contain range. 100% is equivalent to 100% of the cover range.",
+      "type": "value",
+      "value": "exit",
+      "for": "animation-timeline-range"
     }
-  }
+  ]
 }