@webref/css 6.11.1 → 6.11.2

package/css-anchor-position.json

@@ -73,7 +73,7 @@
         },
         {
           "name": "<inset-area>",
-          "prose": "If the element does not have a default anchor element, or is not an absolutely-positioned element, this value has no effect. Otherwise, the property selects a region of the inset-area grid, and makes that the element’s containing block. Additionally, the normal value for the self-alignment properties behaves as either start, end, or anchor-center, depending on the positioning of the region, to give a good default alignment for the positioned element. See § 3.1.1 Resolving <inset-area-span>s for details on both of these effects. If the two <inset-area-span>s do not define a valid region, this property is invalid. Also, any auto inset properties resolve to 0.",
+          "prose": "If the element does not have a default anchor element, or is not an absolutely-positioned element, this value has no effect. Otherwise, the property selects a region of the inset-area grid, and makes that the element’s containing block. Additionally, the normal value for the self-alignment properties behaves as either start, end, or anchor-center, depending on the positioning of the region, to give a good default alignment for the positioned element. See § 3.1.1 Resolving <inset-area>s for details on both of these effects. If the two <inset-area-span>s do not define a valid region, this property is invalid. Also, any auto inset properties resolve to 0.",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-inset-area-inset-area",
           "type": "value",
           "value": "<inset-area>"
@@ -155,7 +155,7 @@
     {
       "name": "position-try-options",
       "href": "https://drafts.csswg.org/css-anchor-position-1/#propdef-position-try-options",
-      "value": "none | [ <dashed-ident> | <try-tactic> ]#",
+      "value": "none | [ <dashed-ident> || <try-tactic> ]#",
       "initial": "none",
       "appliesTo": "absolutely-positioned elements",
       "inherited": "no",
@@ -210,6 +210,13 @@
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-try-options-flip-start",
           "type": "value",
           "value": "flip-start"
+        },
+        {
+          "name": "<dashed-ident> || <try-tactic>",
+          "prose": "Combines the effects of the previous two options: if there is a @position-try rule with the given name, then applies its position option to the element’s base style, transforms it according to the specified <try-tactic>, and then adds the result to the element’s position options list. Otherwise, does nothing.",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-try-options-dashed-ident--try-tactic",
+          "type": "value",
+          "value": "<dashed-ident> || <try-tactic>"
         }
       ],
       "styleDeclaration": [
@@ -238,28 +245,28 @@
         },
         {
           "name": "most-width",
-          "prose": "For each entry in the position options list, determine the position fallback styles, and find the specified inset-modified containing block size that results from those styles. Stably sort the position options list according to this size, with the largest coming first.",
+          "prose": "For each entry in the position options list, apply a position option using that option to the element, and find the specified inset-modified containing block size that results from those styles. Stably sort the position options list according to this size, with the largest coming first.",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-try-order-most-width",
           "type": "value",
           "value": "most-width"
         },
         {
           "name": "most-height",
-          "prose": "For each entry in the position options list, determine the position fallback styles, and find the specified inset-modified containing block size that results from those styles. Stably sort the position options list according to this size, with the largest coming first.",
+          "prose": "For each entry in the position options list, apply a position option using that option to the element, and find the specified inset-modified containing block size that results from those styles. Stably sort the position options list according to this size, with the largest coming first.",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-try-order-most-height",
           "type": "value",
           "value": "most-height"
         },
         {
           "name": "most-block-size",
-          "prose": "For each entry in the position options list, determine the position fallback styles, and find the specified inset-modified containing block size that results from those styles. Stably sort the position options list according to this size, with the largest coming first.",
+          "prose": "For each entry in the position options list, apply a position option using that option to the element, and find the specified inset-modified containing block size that results from those styles. Stably sort the position options list according to this size, with the largest coming first.",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-try-order-most-block-size",
           "type": "value",
           "value": "most-block-size"
         },
         {
           "name": "most-inline-size",
-          "prose": "For each entry in the position options list, determine the position fallback styles, and find the specified inset-modified containing block size that results from those styles. Stably sort the position options list according to this size, with the largest coming first.",
+          "prose": "For each entry in the position options list, apply a position option using that option to the element, and find the specified inset-modified containing block size that results from those styles. Stably sort the position options list according to this size, with the largest coming first.",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-try-order-most-inline-size",
           "type": "value",
           "value": "most-inline-size"
@@ -270,6 +277,22 @@
         "positionTryOrder"
       ]
     },
+    {
+      "name": "position-try",
+      "href": "https://drafts.csswg.org/css-anchor-position-1/#propdef-position-try",
+      "value": "<'position-try-order'>? <'position-try-options'>",
+      "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": [
+        "position-try",
+        "positionTry"
+      ]
+    },
     {
       "name": "position-fallback-bounds",
       "href": "https://drafts.csswg.org/css-anchor-position-1/#propdef-position-fallback-bounds",
@@ -294,6 +317,38 @@
         "position-fallback-bounds",
         "positionFallbackBounds"
       ]
+    },
+    {
+      "name": "position-animation",
+      "href": "https://drafts.csswg.org/css-anchor-position-1/#propdef-position-animation",
+      "value": "normal | magic",
+      "initial": "normal",
+      "appliesTo": "absolutely positioned elements",
+      "inherited": "no",
+      "percentages": "n/a",
+      "computedValue": "normal, or an overriding position rectangle (see prose)",
+      "canonicalOrder": "per grammar",
+      "animationType": "(see prose)",
+      "values": [
+        {
+          "name": "normal",
+          "prose": "This value has no effect.",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-animation-normal",
+          "type": "value",
+          "value": "normal"
+        },
+        {
+          "name": "magic",
+          "prose": "At computed value time, resolves to a overriding position rectangle, using interleaving. At used value time, overrides the position and size of the element’s margin box, setting it to match the computed overriding position rectangle.",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-animation-magic",
+          "type": "value",
+          "value": "magic"
+        }
+      ],
+      "styleDeclaration": [
+        "position-animation",
+        "positionAnimation"
+      ]
     }
   ],
   "atrules": [

package/css-display.json

@@ -31,47 +31,9 @@
     {
       "name": "order",
       "href": "https://drafts.csswg.org/css-display-4/#propdef-order",
-      "value": "[ <'layout-order'> <'reading-order'>? ] | [ [ reading || layout ] && <integer> ]",
-      "initial": "see individual properties",
-      "appliesTo": "flex items and grid items",
-      "inherited": "no",
-      "percentages": "see individual properties",
-      "computedValue": "see individual properties",
-      "animationType": "see individual properties",
-      "canonicalOrder": "per grammar",
-      "values": [
-        {
-          "name": "<integer>",
-          "prose": "If one integer and no keyword is specified, then sets layout-order to the specified integer, and sets reading-order to its initial value. If two integers are specified, the first sets layout-order and the second sets reading-order. Otherwise sets the appropriate longhand(s) to the specified integer(s).",
-          "href": "https://drafts.csswg.org/css-display-4/#valdef-order-integer",
-          "type": "value",
-          "value": "<integer>"
-        },
-        {
-          "name": "layout",
-          "prose": "Indicates setting layout-order to the specified integer. If reading is not specified, reading-order is set to its initial value.",
-          "href": "https://drafts.csswg.org/css-display-4/#valdef-order-layout",
-          "type": "value",
-          "value": "layout"
-        },
-        {
-          "name": "reading",
-          "prose": "Indicates setting reading-order to the specified integer. If layout is not specified, layout-order is set to its initial value.",
-          "href": "https://drafts.csswg.org/css-display-4/#valdef-order-reading",
-          "type": "value",
-          "value": "reading"
-        }
-      ],
-      "styleDeclaration": [
-        "order"
-      ]
-    },
-    {
-      "name": "reading-order",
-      "href": "https://drafts.csswg.org/css-display-4/#propdef-reading-order",
       "value": "<integer>",
       "initial": "0",
-      "appliesTo": "all elements",
+      "appliesTo": "flex items and grid items",
       "inherited": "no",
       "percentages": "n/a",
       "computedValue": "specified integer",
@@ -80,40 +42,74 @@
       "values": [
         {
           "name": "<integer>",
-          "prose": "The reading-order property controls the order in which elements are rendered to speech or are navigated to when using (linear) sequential navigation methods. It takes a single <integer> value, which specifies which ordinal group the item belongs to. Sibling elements are ordered starting from the lowest numbered ordinal group and going up; elements with the same ordinal group are keep the order they appear in the source document.",
-          "href": "https://drafts.csswg.org/css-display-4/#valdef-reading-order-integer",
+          "prose": "Specifically, the order property controls the order in which flex items or grid items appear within their container, by assigning them to ordinal groups. It takes a single <integer> value, which specifies which ordinal group the item belongs to.",
+          "href": "https://drafts.csswg.org/css-display-4/#valdef-order-integer",
           "type": "value",
           "value": "<integer>"
         }
       ],
       "styleDeclaration": [
-        "reading-order",
-        "readingOrder"
+        "order"
       ]
     },
     {
-      "name": "layout-order",
-      "href": "https://drafts.csswg.org/css-display-4/#propdef-layout-order",
-      "value": "<integer>",
-      "initial": "0",
-      "appliesTo": "flex items and grid items",
+      "name": "reading-order-items",
+      "href": "https://drafts.csswg.org/css-display-4/#propdef-reading-order-items",
+      "value": "normal | flex-visual | flex-flow | grid-rows | grid-columns | grid-order",
+      "initial": "normal",
+      "appliesTo": "flex and grid containers",
       "inherited": "no",
       "percentages": "n/a",
-      "computedValue": "specified integer",
+      "computedValue": "as specified",
       "canonicalOrder": "per grammar",
-      "animationType": "by computed value type",
+      "animationType": "not animatable",
       "values": [
         {
-          "name": "<integer>",
-          "prose": "Specifically, the layout-order property controls the order in which flex items or grid items appear within their container by assigning them to the ordinal groups, as specified by its <integer> value.",
-          "href": "https://drafts.csswg.org/css-display-4/#valdef-layout-order-integer",
+          "name": "normal",
+          "prose": "Follow the order of elements in the DOM.",
+          "href": "https://drafts.csswg.org/css-display-4/#valdef-reading-order-items-normal",
           "type": "value",
-          "value": "<integer>"
+          "value": "normal"
+        },
+        {
+          "name": "flex-visual",
+          "prose": "Only takes effect on flex containers. Follows the visual reading order of flex items, taking the writing mode into account. Therefore, a document in English, with a flex-direction of row-reverse and reading-order-items of 'flex visual' would have a reading order of left to right.",
+          "href": "https://drafts.csswg.org/css-display-4/#valdef-reading-order-items-flex-visual",
+          "type": "value",
+          "value": "flex-visual"
+        },
+        {
+          "name": "flex-flow",
+          "prose": "Only takes effect on flex containers. Follows the flex-flow direction.",
+          "href": "https://drafts.csswg.org/css-display-4/#valdef-reading-order-items-flex-flow",
+          "type": "value",
+          "value": "flex-flow"
+        },
+        {
+          "name": "grid-rows",
+          "prose": "Only takes effect on grid containers. Follows the visual order of grid items by row, taking the writing mode into account.",
+          "href": "https://drafts.csswg.org/css-display-4/#valdef-reading-order-items-grid-rows",
+          "type": "value",
+          "value": "grid-rows"
+        },
+        {
+          "name": "grid-columns",
+          "prose": "Only takes effect on grid containers. Follows the visual order of grid items by column, taking the writing mode into account.",
+          "href": "https://drafts.csswg.org/css-display-4/#valdef-reading-order-items-grid-columns",
+          "type": "value",
+          "value": "grid-columns"
+        },
+        {
+          "name": "grid-order",
+          "prose": "Follows the order-modified document order. Therefore, as normal unless the order property has been used to change the order of items.",
+          "href": "https://drafts.csswg.org/css-display-4/#valdef-reading-order-items-grid-order",
+          "type": "value",
+          "value": "grid-order"
         }
       ],
       "styleDeclaration": [
-        "layout-order",
-        "layoutOrder"
+        "reading-order-items",
+        "readingOrderItems"
       ]
     },
     {
@@ -181,7 +177,7 @@
         },
         {
           "name": "run-in",
-          "prose": "The element generates an run-in box, which is a type of inline-level box with special behavior that attempts to merge it into a subsequent block container. See § 5 Run-In Layout for details.",
+          "prose": "The element generates an run-in box, which is a type of inline-level box with special behavior that attempts to merge it into a subsequent block container. See § 6 Run-In Layout for details.",
           "href": "https://drafts.csswg.org/css-display-4/#valdef-display-run-in",
           "type": "value",
           "value": "run-in"

package/css-images-4.json

@@ -155,7 +155,7 @@
       "name": "<cf-image>",
       "href": "https://drafts.csswg.org/css-images-4/#typedef-cf-image",
       "type": "type",
-      "value": "<percentage [0,100]>? && [ <image> | <color> ]"
+      "value": "[ <image> | <color> ] && <percentage [0,100]>?"
     },
     {
       "name": "element()",

package/css-ui.json

@@ -384,6 +384,38 @@
         "caretColor"
       ]
     },
+    {
+      "name": "caret-animation",
+      "href": "https://drafts.csswg.org/css-ui-4/#propdef-caret-animation",
+      "value": "auto | manual",
+      "initial": "auto",
+      "appliesTo": "elements that accept input",
+      "inherited": "yes",
+      "percentages": "N/A",
+      "computedValue": "specified keyword",
+      "canonicalOrder": "per grammar",
+      "animationType": "discrete",
+      "values": [
+        {
+          "name": "auto",
+          "prose": "The UA determines how the caret should be animated, if at all. It should match platform conventions, and may be adjusted based on context.",
+          "href": "https://drafts.csswg.org/css-ui-4/#valdef-caret-animation-auto",
+          "type": "value",
+          "value": "auto"
+        },
+        {
+          "name": "manual",
+          "prose": "The UA must not animate the caret.",
+          "href": "https://drafts.csswg.org/css-ui-4/#valdef-caret-animation-manual",
+          "type": "value",
+          "value": "manual"
+        }
+      ],
+      "styleDeclaration": [
+        "caret-animation",
+        "caretAnimation"
+      ]
+    },
     {
       "name": "caret-shape",
       "href": "https://drafts.csswg.org/css-ui-4/#propdef-caret-shape",
@@ -433,7 +465,7 @@
     {
       "name": "caret",
       "href": "https://drafts.csswg.org/css-ui-4/#propdef-caret",
-      "value": "<'caret-color'> || <'caret-shape'>",
+      "value": "<'caret-color'> || <'caret-animation'> || <'caret-shape'>",
       "initial": "auto",
       "appliesTo": "elements that accept input",
       "inherited": "yes",

package/css-values-5.json

@@ -397,6 +397,40 @@
       "prose": "The sibling-index() functional notation represents, as an <integer>, the index of the element on which the notation is used among the children of its parent. Like :nth-child(), sibling-index() is 1-indexed.",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-sibling-index",
       "type": "function"
+    },
+    {
+      "name": "calc-size()",
+      "href": "https://drafts.csswg.org/css-values-5/#funcdef-calc-size",
+      "type": "function",
+      "value": "calc-size( <calc-size-basis>, <calc-sum>? )",
+      "values": [
+        {
+          "name": "size",
+          "prose": "Within the calc-size calculation, if the calc-size basis is not any, the keyword size is allowed. This keyword is a <length>, and resolves at used value time.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-size",
+          "type": "value",
+          "value": "size"
+        },
+        {
+          "name": "any",
+          "prose": "(If the calc-size basis is any, the calc-size() is a definite length, equal to its calc-size calculation.)",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-any",
+          "type": "value",
+          "value": "any"
+        }
+      ]
+    },
+    {
+      "name": "<calc-size-basis>",
+      "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-size-basis",
+      "type": "type",
+      "value": "[ <intrinsic-size-keyword> | <calc-size()> | any | <calc-sum> ]"
+    },
+    {
+      "name": "<intrinsic-size-keyword>",
+      "prose": "The <intrinsic-size-keyword> production matches any intrinsic size keywords allowed in the context. For example, in width, it matches auto, min-content, stretch, etc.",
+      "href": "https://drafts.csswg.org/css-values-5/#typedef-intrinsic-size-keyword",
+      "type": "type"
     }
   ],
   "warnings": [

package/mediaqueries-5.json

@@ -145,7 +145,7 @@
           "name": "display-mode",
           "href": "https://drafts.csswg.org/mediaqueries-5/#descdef-media-display-mode",
           "for": "@media",
-          "value": "fullscreen | standalone | minimal-ui | browser",
+          "value": "fullscreen | standalone | minimal-ui | browser | picture-in-picture",
           "type": "discrete"
         },
         {

package/package.json

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