Skip to content

Commit b00acbb

Browse files
committed
[css-conditional-values-1] Expand motivation a little bit
1 parent a10ec8f commit b00acbb

File tree

1 file changed

+25
-6
lines changed

1 file changed

+25
-6
lines changed

css-conditional-values-1/Overview.bs

+25-6
Original file line numberDiff line numberDiff line change
@@ -19,15 +19,31 @@ Introduction {#intro}
1919

2020
<em>This section is not normative.</em>
2121

22-
Authors frequently need to set a property to different values based
23-
on the relation between certain values.
22+
Note: This section is a stub and needs to be expanded.
2423

25-
For example, a web component may support several keyword-based custom properties
26-
and may want to set several different property values based on each keyword value.
24+
Authors frequently need to set a property to different values based
25+
on the relation between certain values.
2726

28-
As another example, ...
2927

30-
Note: TODO expand motivation
28+
High level custom properties {#high-level-custom-properties}
29+
-----------------------------
30+
31+
A web component may support several custom properties which
32+
do not contain a value fragment verbatim, but set several properties across multiple rules indirectly.
33+
For example, a `--size` property with values `small`, `medium`, `large`,
34+
or an `--alignment` property with values `horizontal` and `vertical`.
35+
36+
37+
Relation between units of the same type {#relation-between-units}
38+
---------------------------------------
39+
40+
Author code often needs to branch based on the relation between different units of the same type.
41+
42+
For example:
43+
44+
* Comparing viewport and absolute units allows compact one-off viewport dimension media queries
45+
* Comparing font-relative units and absolute <<length>> units allows authors
46+
to apply different styling for small and large font sizes, enhancing readability.
3147

3248
Value Definitions {#values}
3349
---------------------------
@@ -65,6 +81,9 @@ Logical comparisons: The <<condition>> type {#condition}
6581
<dfn>&lt;comparison-operator></dfn> = [ '=' | '>=' | '>' | '<' | '<=' ]
6682
</pre>
6783

84+
Note: A future version of this module may expand <<comparison-operand>>
85+
to complex types, such as colors.
86+
6887
<<condition>> values are logical expressions that resolve to a <<boolean-constant>>
6988
by performing simple comparisons and following basic boolean operators.
7089
When using `and` or `or` operators, precedence must be enforced with parentheses.

0 commit comments

Comments
 (0)