@webref/css 6.23.0 → 7.0.0-alpha

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (122) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/README.md +37 -22
  3. package/css.json +17754 -0
  4. package/index.js +2 -9
  5. package/package.json +1 -1
  6. package/CSS.json +0 -567
  7. package/SVG.json +0 -387
  8. package/compat.json +0 -784
  9. package/compositing.json +0 -178
  10. package/css-align.json +0 -559
  11. package/css-anchor-position.json +0 -1042
  12. package/css-animations-2.json +0 -377
  13. package/css-animations.json +0 -337
  14. package/css-backgrounds-4.json +0 -402
  15. package/css-backgrounds.json +0 -732
  16. package/css-borders.json +0 -1642
  17. package/css-box.json +0 -484
  18. package/css-break.json +0 -444
  19. package/css-cascade-6.json +0 -31
  20. package/css-cascade.json +0 -91
  21. package/css-color-5.json +0 -527
  22. package/css-color-6.json +0 -60
  23. package/css-color-adjust.json +0 -151
  24. package/css-color-hdr.json +0 -183
  25. package/css-color.json +0 -1759
  26. package/css-conditional-4.json +0 -23
  27. package/css-conditional-5.json +0 -505
  28. package/css-conditional.json +0 -50
  29. package/css-contain.json +0 -123
  30. package/css-content.json +0 -466
  31. package/css-counter-styles.json +0 -613
  32. package/css-display.json +0 -444
  33. package/css-easing.json +0 -149
  34. package/css-env.json +0 -109
  35. package/css-exclusions.json +0 -108
  36. package/css-extensions.json +0 -36
  37. package/css-flexbox.json +0 -259
  38. package/css-fonts-5.json +0 -385
  39. package/css-fonts.json +0 -1754
  40. package/css-forms.json +0 -281
  41. package/css-gaps.json +0 -544
  42. package/css-gcpm-4.json +0 -58
  43. package/css-gcpm.json +0 -138
  44. package/css-grid-3.json +0 -335
  45. package/css-grid.json +0 -824
  46. package/css-images-4.json +0 -367
  47. package/css-images-5.json +0 -43
  48. package/css-images.json +0 -373
  49. package/css-inline.json +0 -903
  50. package/css-layout-api.json +0 -21
  51. package/css-line-grid.json +0 -142
  52. package/css-link-params.json +0 -34
  53. package/css-lists.json +0 -337
  54. package/css-logical.json +0 -396
  55. package/css-masking.json +0 -717
  56. package/css-mixins.json +0 -58
  57. package/css-multicol.json +0 -253
  58. package/css-namespaces.json +0 -25
  59. package/css-nav.json +0 -121
  60. package/css-nesting.json +0 -17
  61. package/css-overflow-4.json +0 -428
  62. package/css-overflow-5.json +0 -226
  63. package/css-overflow.json +0 -379
  64. package/css-overscroll.json +0 -215
  65. package/css-page-floats.json +0 -296
  66. package/css-page.json +0 -382
  67. package/css-paint-api.json +0 -17
  68. package/css-position-4.json +0 -49
  69. package/css-position.json +0 -495
  70. package/css-properties-values-api.json +0 -39
  71. package/css-pseudo.json +0 -98
  72. package/css-regions.json +0 -59
  73. package/css-rhythm.json +0 -181
  74. package/css-round-display.json +0 -85
  75. package/css-ruby.json +0 -221
  76. package/css-scoping.json +0 -38
  77. package/css-scroll-anchoring.json +0 -43
  78. package/css-scroll-snap-2.json +0 -74
  79. package/css-scroll-snap.json +0 -643
  80. package/css-scrollbars.json +0 -82
  81. package/css-shadow-parts.json +0 -17
  82. package/css-shapes-2.json +0 -89
  83. package/css-shapes.json +0 -384
  84. package/css-size-adjust.json +0 -50
  85. package/css-sizing-4.json +0 -601
  86. package/css-sizing.json +0 -427
  87. package/css-speech.json +0 -985
  88. package/css-syntax.json +0 -263
  89. package/css-tables.json +0 -91
  90. package/css-text-4.json +0 -1516
  91. package/css-text-decor-4.json +0 -741
  92. package/css-text-decor.json +0 -337
  93. package/css-text.json +0 -670
  94. package/css-transforms-2.json +0 -329
  95. package/css-transforms.json +0 -213
  96. package/css-transitions-2.json +0 -47
  97. package/css-transitions.json +0 -119
  98. package/css-ui.json +0 -818
  99. package/css-values-5.json +0 -854
  100. package/css-values.json +0 -790
  101. package/css-variables.json +0 -29
  102. package/css-view-transitions-2.json +0 -152
  103. package/css-view-transitions.json +0 -77
  104. package/css-viewport.json +0 -43
  105. package/css-will-change.json +0 -64
  106. package/css-writing-modes.json +0 -256
  107. package/fill-stroke.json +0 -755
  108. package/filter-effects-2.json +0 -28
  109. package/filter-effects.json +0 -220
  110. package/html.json +0 -29
  111. package/mathml-core.json +0 -69
  112. package/mediaqueries-5.json +0 -915
  113. package/mediaqueries.json +0 -549
  114. package/motion.json +0 -303
  115. package/pointer-animations.json +0 -282
  116. package/scroll-animations.json +0 -519
  117. package/selectors-5.json +0 -22
  118. package/selectors.json +0 -604
  119. package/svg-strokes.json +0 -59
  120. package/upgrade-insecure-requests.json +0 -28
  121. package/webvtt.json +0 -33
  122. package/webxr-dom-overlays.json +0 -17
package/css-values-5.json DELETED
@@ -1,854 +0,0 @@
1
- {
2
- "spec": {
3
- "title": "CSS Values and Units Module Level 5",
4
- "url": "https://drafts.csswg.org/css-values-5/"
5
- },
6
- "properties": [
7
- {
8
- "name": "interpolate-size",
9
- "href": "https://drafts.csswg.org/css-values-5/#propdef-interpolate-size",
10
- "value": "numeric-only | allow-keywords",
11
- "initial": "numeric-only",
12
- "appliesTo": "all elements",
13
- "inherited": "yes",
14
- "percentages": "n/a",
15
- "computedValue": "as specified",
16
- "canonicalOrder": "per grammar",
17
- "animationType": "not animatable",
18
- "values": [
19
- {
20
- "name": "numeric-only",
21
- "prose": "An <intrinsic-size-keyword> cannot be interpolated.",
22
- "href": "https://drafts.csswg.org/css-values-5/#valdef-interpolate-size-numeric-only",
23
- "type": "value",
24
- "value": "numeric-only"
25
- },
26
- {
27
- "name": "allow-keywords",
28
- "prose": "Two values can also be interpolated if one of them is an <intrinsic-size-keyword> and the other is a <length-percentage>. This is done by treating the <intrinsic-size-keyword> keyword as though it is calc-size(keyword, size) and applying the rules in § 11.3 Interpolating calc-size(). In other cases, an <intrinsic-size-keyword> still cannot be interpolated.",
29
- "href": "https://drafts.csswg.org/css-values-5/#valdef-interpolate-size-allow-keywords",
30
- "type": "value",
31
- "value": "allow-keywords"
32
- }
33
- ],
34
- "styleDeclaration": [
35
- "interpolate-size",
36
- "interpolateSize"
37
- ]
38
- }
39
- ],
40
- "atrules": [],
41
- "selectors": [],
42
- "values": [
43
- {
44
- "name": "<boolean-expr>",
45
- "prose": "Several contexts (such as @media, @supports, if(), ...) specify conditions, and allow combining those conditions with boolean logic (and/or/not/grouping). Because they use the same non-trivial recursive syntax structure, the special <boolean-expr> production represents this pattern generically.",
46
- "href": "https://drafts.csswg.org/css-values-5/#typedef-boolean-expr",
47
- "type": "type"
48
- },
49
- {
50
- "name": "<syntax>",
51
- "href": "https://drafts.csswg.org/css-values-5/#typedef-syntax",
52
- "type": "type",
53
- "value": "'*' | <syntax-component> [ <syntax-combinator> <syntax-component> ]* | <syntax-string>"
54
- },
55
- {
56
- "name": "<syntax-component>",
57
- "href": "https://drafts.csswg.org/css-values-5/#typedef-syntax-component",
58
- "type": "type",
59
- "value": "<syntax-single-component> <syntax-multiplier>? | '<' transform-list '>'"
60
- },
61
- {
62
- "name": "<syntax-single-component>",
63
- "href": "https://drafts.csswg.org/css-values-5/#typedef-syntax-single-component",
64
- "type": "type",
65
- "value": "'<' <syntax-type-name> '>' | <ident>"
66
- },
67
- {
68
- "name": "<syntax-type-name>",
69
- "href": "https://drafts.csswg.org/css-values-5/#typedef-syntax-type-name",
70
- "type": "type",
71
- "value": "angle | color | custom-ident | image | integer | length | length-percentage | number | percentage | resolution | string | time | url | transform-function"
72
- },
73
- {
74
- "name": "<syntax-combinator>",
75
- "href": "https://drafts.csswg.org/css-values-5/#typedef-syntax-combinator",
76
- "type": "type",
77
- "value": "'|'"
78
- },
79
- {
80
- "name": "<syntax-multiplier>",
81
- "href": "https://drafts.csswg.org/css-values-5/#typedef-syntax-multiplier",
82
- "type": "type",
83
- "value": "[ '#' | '+' ]"
84
- },
85
- {
86
- "name": "<syntax-string>",
87
- "href": "https://drafts.csswg.org/css-values-5/#typedef-syntax-string",
88
- "type": "type",
89
- "value": "<string>"
90
- },
91
- {
92
- "name": "<request-url-modifier>",
93
- "prose": "<request-url-modifier>s are <url-modifier>s that affect the <url>’s resource request by applying associated URL request modifier steps. See CSS Values 4 § 4.5.4 URL Processing Model.",
94
- "href": "https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier",
95
- "type": "type",
96
- "value": "<crossorigin-modifier> | <integrity-modifier> | <referrerpolicy-modifier>",
97
- "values": [
98
- {
99
- "name": "<crossorigin-modifier>",
100
- "value": "crossorigin(anonymous | use-credentials)",
101
- "href": "https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-crossorigin-modifier",
102
- "type": "type"
103
- },
104
- {
105
- "name": "crossorigin()",
106
- "prose": "<crossorigin-modifier> = crossorigin(anonymous | use-credentials)",
107
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-request-url-modifier-crossorigin",
108
- "type": "function"
109
- },
110
- {
111
- "name": "anonymous",
112
- "prose": "<crossorigin-modifier> = crossorigin(anonymous | use-credentials)",
113
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-anonymous",
114
- "type": "value",
115
- "value": "anonymous"
116
- },
117
- {
118
- "name": "use-credentials",
119
- "prose": "<crossorigin-modifier> = crossorigin(anonymous | use-credentials)",
120
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-use-credentials",
121
- "type": "value",
122
- "value": "use-credentials"
123
- },
124
- {
125
- "name": "<integrity-modifier>",
126
- "value": "integrity(<string>)",
127
- "href": "https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-integrity-modifier",
128
- "type": "type"
129
- },
130
- {
131
- "name": "integrity()",
132
- "prose": "<integrity-modifier> = integrity(<string>)",
133
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-request-url-modifier-integrity",
134
- "type": "function"
135
- },
136
- {
137
- "name": "<referrerpolicy-modifier>",
138
- "value": "referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
139
- "href": "https://drafts.csswg.org/css-values-5/#typedef-request-url-modifier-referrerpolicy-modifier",
140
- "type": "type"
141
- },
142
- {
143
- "name": "referrerpolicy()",
144
- "prose": "<referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
145
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-request-url-modifier-referrerpolicy",
146
- "type": "function"
147
- },
148
- {
149
- "name": "no-referrer",
150
- "prose": "<referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
151
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-no-referrer",
152
- "type": "value",
153
- "value": "no-referrer"
154
- },
155
- {
156
- "name": "no-referrer-when-downgrade",
157
- "prose": "<referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
158
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-no-referrer-when-downgrade",
159
- "type": "value",
160
- "value": "no-referrer-when-downgrade"
161
- },
162
- {
163
- "name": "same-origin",
164
- "prose": "<referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
165
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-same-origin",
166
- "type": "value",
167
- "value": "same-origin"
168
- },
169
- {
170
- "name": "origin",
171
- "prose": "<referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
172
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-origin",
173
- "type": "value",
174
- "value": "origin"
175
- },
176
- {
177
- "name": "strict-origin",
178
- "prose": "<referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
179
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-strict-origin",
180
- "type": "value",
181
- "value": "strict-origin"
182
- },
183
- {
184
- "name": "origin-when-cross-origin",
185
- "prose": "<referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
186
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-origin-when-cross-origin",
187
- "type": "value",
188
- "value": "origin-when-cross-origin"
189
- },
190
- {
191
- "name": "strict-origin-when-cross-origin",
192
- "prose": "<referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
193
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-strict-origin-when-cross-origin",
194
- "type": "value",
195
- "value": "strict-origin-when-cross-origin"
196
- },
197
- {
198
- "name": "unsafe-url",
199
- "prose": "<referrerpolicy-modifier> = referrerpolicy(no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url)",
200
- "href": "https://drafts.csswg.org/css-values-5/#valdef-request-url-modifier-unsafe-url",
201
- "type": "value",
202
- "value": "unsafe-url"
203
- }
204
- ]
205
- },
206
- {
207
- "name": "<position>",
208
- "prose": "The <position> value specifies the position of an alignment subject (e.g. a background image) inside an alignment container (e.g. its background positioning area) as a pair of offsets between the specified edges (defaulting to the left and top). Its syntax is:",
209
- "href": "https://drafts.csswg.org/css-values-5/#typedef-position",
210
- "type": "type",
211
- "value": "<position-one> | <position-two> | <position-four>",
212
- "values": [
213
- {
214
- "name": "<length-percentage>",
215
- "prose": "A <length-percentage> value specifies the size of the offset between the specified edges of the alignment subject and alignment container. For example, for background-position: 2cm 1cm, the top left corner of the background image is placed 2cm to the right and 1cm below the top left corner of the background positioning area. A <percentage> for the horizontal offset is relative to (width of alignment container - width of alignment subject). A <percentage> for the vertical offset is relative to (height of alignment container - height of alignment subject). For example, with a value pair of 0% 0%, the upper left corner of the alignment subject is aligned with the upper left corner of the alignment container A value pair of 100% 100% places the lower right corner of the alignment subject in the lower right corner of the alignment container. With a value pair of 75% 50%, the point 75% across and 50% down the alignment subject is to be placed at the point 75% across and 50% down the alignment container. Diagram of the meaning of background-position: 75% 50%.",
216
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-length-percentage",
217
- "type": "value",
218
- "value": "<length-percentage>"
219
- },
220
- {
221
- "name": "top",
222
- "prose": "Offsets the top/left/right/bottom edges (respectively) of the alignment subject and alignment container by the specified amount (defaulting to 0%) in the corresponding axis.",
223
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-top",
224
- "type": "value",
225
- "value": "top"
226
- },
227
- {
228
- "name": "right",
229
- "prose": "Offsets the top/left/right/bottom edges (respectively) of the alignment subject and alignment container by the specified amount (defaulting to 0%) in the corresponding axis.",
230
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-right",
231
- "type": "value",
232
- "value": "right"
233
- },
234
- {
235
- "name": "bottom",
236
- "prose": "Offsets the top/left/right/bottom edges (respectively) of the alignment subject and alignment container by the specified amount (defaulting to 0%) in the corresponding axis.",
237
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-bottom",
238
- "type": "value",
239
- "value": "bottom"
240
- },
241
- {
242
- "name": "left",
243
- "prose": "Offsets the top/left/right/bottom edges (respectively) of the alignment subject and alignment container by the specified amount (defaulting to 0%) in the corresponding axis.",
244
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-left",
245
- "type": "value",
246
- "value": "left"
247
- },
248
- {
249
- "name": "y-start",
250
- "prose": "Computes the same as the physical edge keyword corresponding to the start/end side in the y/x axis.",
251
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-y-start",
252
- "type": "value",
253
- "value": "y-start"
254
- },
255
- {
256
- "name": "y-end",
257
- "prose": "Computes the same as the physical edge keyword corresponding to the start/end side in the y/x axis.",
258
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-y-end",
259
- "type": "value",
260
- "value": "y-end"
261
- },
262
- {
263
- "name": "x-start",
264
- "prose": "Computes the same as the physical edge keyword corresponding to the start/end side in the y/x axis.",
265
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-x-start",
266
- "type": "value",
267
- "value": "x-start"
268
- },
269
- {
270
- "name": "x-end",
271
- "prose": "Computes the same as the physical edge keyword corresponding to the start/end side in the y/x axis.",
272
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-x-end",
273
- "type": "value",
274
- "value": "x-end"
275
- },
276
- {
277
- "name": "block-start",
278
- "prose": "Computes the same as the physical edge keyword corresponding to the start/end side in the block/inline axis.",
279
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-block-start",
280
- "type": "value",
281
- "value": "block-start"
282
- },
283
- {
284
- "name": "block-end",
285
- "prose": "Computes the same as the physical edge keyword corresponding to the start/end side in the block/inline axis.",
286
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-block-end",
287
- "type": "value",
288
- "value": "block-end"
289
- },
290
- {
291
- "name": "inline-start",
292
- "prose": "Computes the same as the physical edge keyword corresponding to the start/end side in the block/inline axis.",
293
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-inline-start",
294
- "type": "value",
295
- "value": "inline-start"
296
- },
297
- {
298
- "name": "inline-end",
299
- "prose": "Computes the same as the physical edge keyword corresponding to the start/end side in the block/inline axis.",
300
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-inline-end",
301
- "type": "value",
302
- "value": "inline-end"
303
- },
304
- {
305
- "name": "center",
306
- "prose": "Computes to a 50% offset in the corresponding axis.",
307
- "href": "https://drafts.csswg.org/css-values-5/#valdef-position-center",
308
- "type": "value",
309
- "value": "center"
310
- }
311
- ]
312
- },
313
- {
314
- "name": "<position-one>",
315
- "href": "https://drafts.csswg.org/css-values-5/#typedef-position-one",
316
- "type": "type",
317
- "value": "[ left | center | right | top | bottom | x-start | x-end | y-start | y-end | block-start | block-end | inline-start | inline-end | <length-percentage> ]"
318
- },
319
- {
320
- "name": "<position-two>",
321
- "href": "https://drafts.csswg.org/css-values-5/#typedef-position-two",
322
- "type": "type",
323
- "value": "[ [ left | center | right | x-start | x-end ] && [ top | center | bottom | y-start | y-end ] | [ left | center | right | x-start | x-end | <length-percentage> ] [ top | center | bottom | y-start | y-end | <length-percentage> ] | [ block-start | center | block-end ] && [ inline-start | center | inline-end ] | [ start | center | end ]{2} ]"
324
- },
325
- {
326
- "name": "<position-four>",
327
- "href": "https://drafts.csswg.org/css-values-5/#typedef-position-four",
328
- "type": "type",
329
- "value": "[ [ [ left | right | x-start | x-end ] <length-percentage> ] && [ [ top | bottom | y-start | y-end ] <length-percentage> ] | [ [ block-start | block-end ] <length-percentage> ] && [ [ inline-start | inline-end ] <length-percentage> ] | [ [ start | end ] <length-percentage> ]{2} ]"
330
- },
331
- {
332
- "name": "progress()",
333
- "prose": "The progress() functional notation represents the proportional distance of a given value (the progress value) from one value (the progress start value) to another value (the progress end value), each represented as a calculation. It is a math function, and can be input into other calculations such as a math function or a mix notation.",
334
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-progress",
335
- "type": "function",
336
- "value": "progress(<calc-sum>, <calc-sum>, <calc-sum>)"
337
- },
338
- {
339
- "name": "calc-mix()",
340
- "prose": "The calc-mix() mix notation represents a weighted average of numeric or dimensional value. Like calc(), it is a math function, with the following syntactic form:",
341
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-calc-mix",
342
- "type": "function",
343
- "value": "calc-mix( [ <calc-sum> <percentage [0,100]>? ]# )"
344
- },
345
- {
346
- "name": "transform-mix()",
347
- "prose": "The transform-mix() mix notation represents a weighted average of <transform-list>, with the following syntactic form:",
348
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-transform-mix",
349
- "type": "function",
350
- "value": "transform-mix( [ <transform-list> && <percentage [0,100]> ]# )"
351
- },
352
- {
353
- "name": "<progress-source>",
354
- "prose": "The <progress-source> value type represents the interpolation progress in an interpolation notation. Its syntax is:",
355
- "href": "https://drafts.csswg.org/css-values-5/#typedef-progress-source",
356
- "type": "type",
357
- "value": "<percentage> | <number> | <dimension> | <'animation-timeline'>",
358
- "values": [
359
- {
360
- "name": "<percentage>",
361
- "prose": "Represents the interpolation progress as a percentage, with 0% computing to zero and 100% computing to 1.",
362
- "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-percentage",
363
- "type": "value",
364
- "value": "<percentage>"
365
- },
366
- {
367
- "name": "<number>",
368
- "prose": "Represents the interpolation progress as a number directly.",
369
- "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-number",
370
- "type": "value",
371
- "value": "<number>"
372
- },
373
- {
374
- "name": "<dimension>",
375
- "prose": "Represents the interpolation progress as a dimension, which is converted to a number as specified in § 7.2 Validation and Normalization.",
376
- "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-dimension",
377
- "type": "value",
378
- "value": "<dimension>"
379
- },
380
- {
381
- "name": "<'animation-timeline'>",
382
- "prose": "Represents the interpolation progress as the progress of the specified animation timeline. The values none and auto are invalid. [CSS-ANIMATIONS-2] [WEB-ANIMATIONS-2]",
383
- "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-animation-timeline",
384
- "type": "value",
385
- "value": "<'animation-timeline'>"
386
- }
387
- ]
388
- },
389
- {
390
- "name": "calc-interpolate()",
391
- "prose": "The calc-interpolate() interpolation notation represents an interpolated numeric or dimensional value. Like calc(), it is a math function, with the following syntax:",
392
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-calc-interpolate",
393
- "type": "function",
394
- "value": "calc-interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>?, <input-position>{1,2} : <calc-sum> , [ <easing-function>? , <input-position>{1,2} : <calc-sum> ]# )",
395
- "values": [
396
- {
397
- "name": "by",
398
- "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
399
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
400
- "type": "value",
401
- "value": "by"
402
- },
403
- {
404
- "name": "<input-position>",
405
- "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
406
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
407
- "type": "type"
408
- },
409
- {
410
- "name": "<easing-function>",
411
- "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
412
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
413
- "type": "value",
414
- "value": "<easing-function>"
415
- },
416
- {
417
- "name": "<segment-options>",
418
- "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
419
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
420
- "type": "type"
421
- }
422
- ]
423
- },
424
- {
425
- "name": "color-interpolate()",
426
- "prose": "The color-interpolate() interpolation notation represents an interpolated <color> value, with the following syntax:",
427
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-color-interpolate",
428
- "type": "function",
429
- "value": "color-interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>? && <color-interpolation-method>?, <input-position>{1,2} : <color>, [ [ <easing-function> || <color-interpolation-method> ], <input-position>{1,2} : <color> ]# )",
430
- "values": [
431
- {
432
- "name": "by",
433
- "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
434
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
435
- "type": "value",
436
- "value": "by"
437
- },
438
- {
439
- "name": "<input-position>",
440
- "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
441
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
442
- "type": "type"
443
- },
444
- {
445
- "name": "<easing-function>",
446
- "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
447
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
448
- "type": "value",
449
- "value": "<easing-function>"
450
- },
451
- {
452
- "name": "<segment-options>",
453
- "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
454
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
455
- "type": "type"
456
- }
457
- ]
458
- },
459
- {
460
- "name": "transform-interpolate()",
461
- "prose": "The transform-interpolate() interpolation notation represents an interpolated <transform-list>, with the following syntax:",
462
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-transform-interpolate",
463
- "type": "function",
464
- "value": "transform-interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>?, <input-position>{1,2} : <transform-list>, [ <easing-function>?, <input-position>{1,2} : <transform-list> ]# )",
465
- "values": [
466
- {
467
- "name": "by",
468
- "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
469
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
470
- "type": "value",
471
- "value": "by"
472
- },
473
- {
474
- "name": "<input-position>",
475
- "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
476
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
477
- "type": "type"
478
- },
479
- {
480
- "name": "<easing-function>",
481
- "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
482
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
483
- "type": "value",
484
- "value": "<easing-function>"
485
- },
486
- {
487
- "name": "<segment-options>",
488
- "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
489
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
490
- "type": "type"
491
- }
492
- ]
493
- },
494
- {
495
- "name": "interpolate()",
496
- "prose": "The interpolate() interpolation notation represents the interpolation of entire property values, which supports two alternative syntax patterns:",
497
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-interpolate",
498
- "type": "function",
499
- "value": "interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>?, <input-position>{1,2} : <whole-value>, [ <easing-function>?, <input-position>{1,2} : <whole-value> ]# ) | interpolate( <progress-source> && [ by <easing-function> ]? && <easing-function>? of <keyframes-name> )",
500
- "values": [
501
- {
502
- "name": "by",
503
- "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
504
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
505
- "type": "value",
506
- "value": "by"
507
- },
508
- {
509
- "name": "<input-position>",
510
- "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
511
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
512
- "type": "type"
513
- },
514
- {
515
- "name": "<easing-function>",
516
- "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
517
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
518
- "type": "value",
519
- "value": "<easing-function>"
520
- },
521
- {
522
- "name": "<segment-options>",
523
- "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
524
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
525
- "type": "type"
526
- }
527
- ]
528
- },
529
- {
530
- "name": "first-valid()",
531
- "prose": "The first-valid() functional notation inlines the fallback behavior intrinsic to parsing declarations. Unlike most notations, it can accept any valid or invalid syntax in its arguments, and represents the first value among its arguments that is supported (parsed as valid) by the UA as the whole value of the property it’s used in.",
532
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-first-valid",
533
- "type": "function",
534
- "value": "first-valid( <declaration-value># )"
535
- },
536
- {
537
- "name": "if()",
538
- "prose": "The if() function is an arbitrary substitution function that represents conditional values. Its argument consists of an ordered semi-colon–separated list of statements, each consisting of a condition followed by a colon followed by a value. An if() function represents the value corresponding to the first condition in its argument list to be true; if no condition matches, then the if() function represents an empty token stream.",
539
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-if",
540
- "type": "function",
541
- "value": "if( [ <if-branch> ; ]* <if-branch> ;? )",
542
- "values": [
543
- {
544
- "name": "else",
545
- "prose": "The else keyword represents a condition that is always true.",
546
- "href": "https://drafts.csswg.org/css-values-5/#valdef-if-else",
547
- "type": "value",
548
- "value": "else"
549
- }
550
- ]
551
- },
552
- {
553
- "name": "<if-branch>",
554
- "href": "https://drafts.csswg.org/css-values-5/#typedef-if-branch",
555
- "type": "type",
556
- "value": "<if-condition> : <declaration-value>?"
557
- },
558
- {
559
- "name": "<if-condition>",
560
- "href": "https://drafts.csswg.org/css-values-5/#typedef-if-condition",
561
- "type": "type",
562
- "value": "<boolean-expr[ <if-test> ]> | else"
563
- },
564
- {
565
- "name": "<if-test>",
566
- "href": "https://drafts.csswg.org/css-values-5/#typedef-if-test",
567
- "type": "type",
568
- "value": "supports( [ <ident> : <declaration-value> ] | <supports-condition> ) | media( <media-feature> | <media-condition> ) | style( <style-query> )"
569
- },
570
- {
571
- "name": "<if-args>",
572
- "href": "https://drafts.csswg.org/css-values-5/#typedef-if-args",
573
- "type": "type",
574
- "value": "if( [ <if-args-branch> ; ]* <if-args-branch> ;? )"
575
- },
576
- {
577
- "name": "<if-args-branch>",
578
- "href": "https://drafts.csswg.org/css-values-5/#typedef-if-args-branch",
579
- "type": "type",
580
- "value": "<declaration-value> : <declaration-value>?"
581
- },
582
- {
583
- "name": "toggle()",
584
- "prose": "The toggle() expression allows descendant elements to cycle over a list of values instead of inheriting the same value.",
585
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-toggle",
586
- "type": "function",
587
- "value": "toggle( <whole-value># )"
588
- },
589
- {
590
- "name": "inherit()",
591
- "prose": "Like the inherit keyword, the inherit() functional notation resolves to the computed value of a property on the parent. Rather than resolving to the value of the same property, however, it resolves to a sequence of component values representing the computed value of the property specified as its first argument. Its second argument, if present, is used as a fallback in case the first argument resolves to the guaranteed-invalid value.",
592
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-inherit",
593
- "type": "function",
594
- "value": "inherit( <custom-property-name>, <declaration-value>? )"
595
- },
596
- {
597
- "name": "<inherit-args>",
598
- "href": "https://drafts.csswg.org/css-values-5/#typedef-inherit-args",
599
- "type": "type",
600
- "value": "inherit( <declaration-value>, <declaration-value>? )"
601
- },
602
- {
603
- "name": "attr()",
604
- "prose": "The attr() function substitutes the value of an attribute on an element into a property, similar to how the var() function substitutes a custom property value into a function.",
605
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-attr",
606
- "type": "function",
607
- "value": "attr( <attr-name> <attr-type>? , <declaration-value>?)",
608
- "values": [
609
- {
610
- "name": "type()",
611
- "value": "type( <syntax> )",
612
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-attr-type",
613
- "type": "function"
614
- }
615
- ]
616
- },
617
- {
618
- "name": "<attr-name>",
619
- "href": "https://drafts.csswg.org/css-values-5/#typedef-attr-name",
620
- "type": "type",
621
- "value": "[ <ident-token>? '|' ]? <ident-token>"
622
- },
623
- {
624
- "name": "<attr-type>",
625
- "href": "https://drafts.csswg.org/css-values-5/#typedef-attr-type",
626
- "type": "type",
627
- "value": "type( <syntax> ) | raw-string | <attr-unit>"
628
- },
629
- {
630
- "name": "<attr-args>",
631
- "href": "https://drafts.csswg.org/css-values-5/#typedef-attr-args",
632
- "type": "type",
633
- "value": "attr( <declaration-value>, <declaration-value>? )"
634
- },
635
- {
636
- "name": "<attr-unit>",
637
- "prose": "The <attr-unit> production matches any identifier that is an ASCII case-insensitive match for the name of a CSS dimension unit, such as px, or the <delim-token> %. It is not expanded literally here, as the set of units expands over time.",
638
- "href": "https://drafts.csswg.org/css-values-5/#typedef-attr-unit",
639
- "type": "type"
640
- },
641
- {
642
- "name": "ident()",
643
- "prose": "The ident() function represents an <ident>, and can be used to manually construct <custom-ident> values from several parts.",
644
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-ident",
645
- "type": "function",
646
- "value": "ident( <ident-arg>+ )"
647
- },
648
- {
649
- "name": "<ident-arg>",
650
- "href": "https://drafts.csswg.org/css-values-5/#typedef-ident-arg",
651
- "type": "type",
652
- "value": "<string> | <integer> | <ident>"
653
- },
654
- {
655
- "name": "random()",
656
- "prose": "The random() function is a math function that represents a random value between a minimum and maximum value, drawn from a uniform distribution, optionally limiting the possible values to a step between those limits:",
657
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-random",
658
- "type": "function",
659
- "value": "random( <random-value-sharing>? , <calc-sum>, <calc-sum>, <calc-sum>? )"
660
- },
661
- {
662
- "name": "<random-value-sharing>",
663
- "href": "https://drafts.csswg.org/css-values-5/#typedef-random-value-sharing",
664
- "type": "type",
665
- "value": "[ [ auto | <dashed-ident> ] || element-shared ] | fixed <number [0,1]>",
666
- "values": [
667
- {
668
- "name": "auto",
669
- "prose": "Each random function in an element’s styles will use a distinct random base value. (But see the note below for a small wrinkle about this.) If neither auto nor <dashed-ident> are specified, it behaves as auto.",
670
- "href": "https://drafts.csswg.org/css-values-5/#valdef-random-auto",
671
- "type": "value",
672
- "value": "auto"
673
- },
674
- {
675
- "name": "<dashed-ident>",
676
- "prose": "Each random function in an element’s styles with the same <dashed-ident> will share the same random base value; ones with different <dashed-ident>s will use distinct random base values.",
677
- "href": "https://drafts.csswg.org/css-values-5/#valdef-random-dashed-ident",
678
- "type": "value",
679
- "value": "<dashed-ident>"
680
- },
681
- {
682
- "name": "element-shared",
683
- "prose": "If element-shared is omitted, random functions on different elements will use distinct random base values. If specified, random functions on different elements will share the same random base value if they have the same <dashed-ident> (if specified) or if they’re used in the same style in the same way (if not). (Again, see the note below for a small wrinkle about this.)",
684
- "href": "https://drafts.csswg.org/css-values-5/#valdef-random-element-shared",
685
- "type": "value",
686
- "value": "element-shared"
687
- },
688
- {
689
- "name": "<number>",
690
- "prose": "If fixed <number> is specified, the <number> is used as the random function’s random base value, rather than allowing the UA to generate a random base value and controlling how it’s shared. While 1 is technically allowed as a valid value (because CSS grammars can only express closed ranges), the random base value is clamped to the highest representable value less than 1, so random base values remain in the half-open range `[0, 1)`.",
691
- "href": "https://drafts.csswg.org/css-values-5/#valdef-random-fixed",
692
- "type": "value",
693
- "value": "<number>"
694
- }
695
- ]
696
- },
697
- {
698
- "name": "random-item()",
699
- "prose": "The random-item() function resolves to a random item from among its list of items.",
700
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-random-item",
701
- "type": "function",
702
- "value": "random-item( <random-value-sharing> , [ <declaration-value>? ]# )"
703
- },
704
- {
705
- "name": "<random-item-args>",
706
- "href": "https://drafts.csswg.org/css-values-5/#typedef-random-item-args",
707
- "type": "type",
708
- "value": "random-item( <declaration-value>, [ <declaration-value>? ]# )"
709
- },
710
- {
711
- "name": "sibling-count()",
712
- "prose": "The sibling-count() functional notation represents, as an <integer>, the total number of child elements in the parent of the element on which the notation is used.",
713
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-sibling-count",
714
- "type": "function"
715
- },
716
- {
717
- "name": "sibling-index()",
718
- "prose": "The sibling-index() functional notation represents, as an <integer>, the index of the element on which the notation is used among its inclusive siblings. Like :nth-child(), sibling-index() is 1-indexed.",
719
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-sibling-index",
720
- "type": "function"
721
- },
722
- {
723
- "name": "calc-size()",
724
- "href": "https://drafts.csswg.org/css-values-5/#funcdef-calc-size",
725
- "type": "function",
726
- "value": "calc-size( <calc-size-basis>, <calc-sum> )",
727
- "values": [
728
- {
729
- "name": "size",
730
- "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.",
731
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-size",
732
- "type": "value",
733
- "value": "size"
734
- },
735
- {
736
- "name": "any",
737
- "prose": "(If the calc-size basis is any, the calc-size() is a definite length, equal to its calc-size calculation.)",
738
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-any",
739
- "type": "value",
740
- "value": "any"
741
- }
742
- ]
743
- },
744
- {
745
- "name": "<calc-size-basis>",
746
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-size-basis",
747
- "type": "type",
748
- "value": "[ <size-keyword> | <calc-size()> | any | <calc-sum> ]"
749
- },
750
- {
751
- "name": "<size-keyword>",
752
- "prose": "The <size-keyword> production matches any sizing keywords allowed in the context. For example, in width, it matches auto, min-content, stretch, etc.",
753
- "href": "https://drafts.csswg.org/css-values-5/#typedef-size-keyword",
754
- "type": "type"
755
- }
756
- ],
757
- "warnings": [
758
- {
759
- "msg": "Missing definition",
760
- "name": "]>",
761
- "value": "not <boolean-expr-group> | <boolean-expr-group> [ [ and <boolean-expr-group> ]* | [ or <boolean-expr-group> ]* ]"
762
- },
763
- {
764
- "msg": "Missing definition",
765
- "name": "<boolean-expr-group>",
766
- "value": "<test> | ( <boolean-expr[ <test> ]> ) | <general-enclosed>"
767
- },
768
- {
769
- "msg": "Missing definition",
770
- "name": "*mix()",
771
- "value": "*mix( options? , [ value && <percentage>? ]# )"
772
- },
773
- {
774
- "msg": "Missing definition",
775
- "name": "*interpolate()",
776
- "value": "*interpolate( progress && global-options?, stop, [ between-options? , stop ]# )"
777
- },
778
- {
779
- "msg": "Missing definition",
780
- "name": "interpolate-function()",
781
- "value": "interpolate-function( <progress-source> && [ by <easing-function> ]? && <easing-function>? && <segment-options>?, <input-position>{1,2} : <output-value> , [ [ <easing-function> || <segment-options> , ]? <input-position>{1,2} : <output-value> ]* )"
782
- },
783
- {
784
- "msg": "Dangling value",
785
- "name": "<percentage>",
786
- "prose": "Represents the interpolation progress as a percentage, with 0% computing to zero and 100% computing to 1.",
787
- "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-percentage",
788
- "type": "value",
789
- "value": "<percentage>",
790
- "for": "palette-interpolate()"
791
- },
792
- {
793
- "msg": "Dangling value",
794
- "name": "<number>",
795
- "prose": "Represents the interpolation progress as a number directly.",
796
- "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-number",
797
- "type": "value",
798
- "value": "<number>",
799
- "for": "palette-interpolate()"
800
- },
801
- {
802
- "msg": "Dangling value",
803
- "name": "<dimension>",
804
- "prose": "Represents the interpolation progress as a dimension, which is converted to a number as specified in § 7.2 Validation and Normalization.",
805
- "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-dimension",
806
- "type": "value",
807
- "value": "<dimension>",
808
- "for": "palette-interpolate()"
809
- },
810
- {
811
- "msg": "Dangling value",
812
- "name": "<'animation-timeline'>",
813
- "prose": "Represents the interpolation progress as the progress of the specified animation timeline. The values none and auto are invalid. [CSS-ANIMATIONS-2] [WEB-ANIMATIONS-2]",
814
- "href": "https://drafts.csswg.org/css-values-5/#valdef-progress-source-animation-timeline",
815
- "type": "value",
816
- "value": "<'animation-timeline'>",
817
- "for": "palette-interpolate()"
818
- },
819
- {
820
- "msg": "Dangling value",
821
- "name": "by",
822
- "prose": "The interpolation progress given by <progress-source> may be optionally modified by the <easing-function> specified after the by keyword. It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to the interpolation map, analogous to animation-easing.",
823
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-by",
824
- "type": "value",
825
- "value": "by",
826
- "for": "palette-interpolate()"
827
- },
828
- {
829
- "msg": "Dangling value",
830
- "name": "<input-position>",
831
- "prose": "Represents an interpolation stop associating the specified input position(s) with the specified output values. As with the gradient functions, if two <input-position>s are specified, it is treated the same as two stops with the same <output-value>.",
832
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-input-position",
833
- "type": "type",
834
- "for": "palette-interpolate()"
835
- },
836
- {
837
- "msg": "Dangling value",
838
- "name": "<easing-function>",
839
- "prose": "When appearing in the first argument, specifies the “default” easing function to be used between each stop. When appearing between stops, specifies the easing function to be used between the two surrounding stops, overriding any default provided by a global <easing-function> argument. (It is analogous to animation-timing-function.) The input progress value to this easing function is the segment interpolation progress—​how far the interpolation progress is between the input positions of the nearest stops preceding and following it. For example, in color-interpolate(20%, 0%: red, ease-in-out, 80%: green, 100%: blue), the 20% interpolation progress becomes a 25% segment interpolation progress, as 20% is 25% of the way between 0% and 80%, the surrounding input positions.",
840
- "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function",
841
- "type": "value",
842
- "value": "<easing-function>",
843
- "for": "palette-interpolate()"
844
- },
845
- {
846
- "msg": "Dangling value",
847
- "name": "<segment-options>",
848
- "prose": "When appearing in the first argument, provides any type-specific interpolation options that apply to every segment in the interpolation map. When appearing between stops, provides any type-specific interpolation options that apply to the interpolation segment between the stops on either side of this argument, overriding any default provided by a corresponding global <segment-options> argument.",
849
- "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-interpolate-segment-options",
850
- "type": "type",
851
- "for": "palette-interpolate()"
852
- }
853
- ]
854
- }