Skip to content

Commit a0f8403

Browse files
committed
Add nesting proposal 5 to list
1 parent 3c5871b commit a0f8403

File tree

1 file changed

+20
-0
lines changed

1 file changed

+20
-0
lines changed

css-nesting-1/proposals.md

+20
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ To organize the discussion a bit, the options we're looking at are:
1414
1. Could add the rule block with an `@nest` rule
1515
2. Could add the rule block with special ASCII selector (e.g. `&&`) to indicate association of nested rules with the previous selector
1616
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.
1718

1819
------
1920

@@ -109,6 +110,23 @@ Arguments for each of the above options:
109110
- Can't mix properties and rules - all properties have to come first. (But this matches the data model anyway.)
110111
- If you are *only* nesting rules, and we are using bare parens (4.iii) you still need an empty declaration block (`{}`), which looks awkward
111112

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+
112130
</table>
113131

114132
## Twitter Polls
@@ -165,6 +183,8 @@ If it were up to you, what syntax would you prefer for CSS Nesting?
165183
only to have followed the [discussion](https://github.com/w3c/csswg-drafts/issues/7834)
166184
and considered the proposals (summarized above) carefully.*
167185

186+
***Note:** Proposal 5 was not considered in this poll.*
187+
168188
### Counts
169189

170190
23 participants voted.

0 commit comments

Comments
 (0)