You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: css-nesting-1/proposals.md
+20
Original file line number
Diff line number
Diff line change
@@ -14,6 +14,7 @@ To organize the discussion a bit, the options we're looking at are:
14
14
1. Could add the rule block with an `@nest` rule
15
15
2. Could add the rule block with special ASCII selector (e.g. `&&`) to indicate association of nested rules with the previous selector
16
16
3. Could [add the rule block with bare braces](https://github.com/w3c/csswg-drafts/issues/7834#issuecomment-1282630354), essentially giving the selector prelude associated two blocks (one declaration block, one optional rule block).
17
+
5.[Top-level nesting container](https://github.com/w3c/csswg-drafts/issues/7970) - Top-level `@nest` rule having one or more selectors and a block of nested rules, no `&` needed in nested selectors except for attaching psuedos to the parent slector. No mixing of properties and rules.
17
18
18
19
------
19
20
@@ -109,6 +110,23 @@ Arguments for each of the above options:
109
110
- Can't mix properties and rules - all properties have to come first. (But this matches the data model anyway.)
110
111
- If you are *only* nesting rules, and we are using bare parens (4.iii) you still need an empty declaration block (`{}`), which looks awkward
111
112
113
+
<tr>
114
+
<th>(5)
115
+
<td>
116
+
117
+
- Blocks contain only style rules (& at-rules), style rules contain only properties
118
+
- Easier to understand and teach, no special rules for when `&` is needed or understanding what an ident is
119
+
- No changes to parsing or OM
120
+
- No `&` for selectors that do not require it
121
+
- Similar to `@scope` and @layer
122
+
- Existing rules can be pasted into a `@nest` block without modification
123
+
- Can tranparently handle multiple levels of nesting
124
+
125
+
<td>
126
+
127
+
- Requires an additional block of scope for properties on the primary sleector(s)
128
+
- Requires non-local edits when refactoring existing code
129
+
112
130
</table>
113
131
114
132
## Twitter Polls
@@ -165,6 +183,8 @@ If it were up to you, what syntax would you prefer for CSS Nesting?
165
183
only to have followed the [discussion](https://github.com/w3c/csswg-drafts/issues/7834)
166
184
and considered the proposals (summarized above) carefully.*
167
185
186
+
***Note:** Proposal 5 was not considered in this poll.*
0 commit comments