Skip to content

Commit 50ef062

Browse files
Sync svelte docs (#1301)
sync svelte docs Co-authored-by: svelte-docs-bot[bot] <196124396+svelte-docs-bot[bot]@users.noreply.github.com>
1 parent 31cbd48 commit 50ef062

File tree

2 files changed

+50
-2
lines changed

2 files changed

+50
-2
lines changed

apps/svelte.dev/content/docs/svelte/98-reference/.generated/compile-errors.md

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -235,7 +235,31 @@ A top-level `:global {...}` block can only contain rules, not declarations
235235
### css_global_block_invalid_list
236236

237237
```
238-
A `:global` selector cannot be part of a selector list with more than one item
238+
A `:global` selector cannot be part of a selector list with entries that don't contain `:global`
239+
```
240+
241+
The following CSS is invalid:
242+
243+
```css
244+
:global, x {
245+
y {
246+
color: red;
247+
}
248+
}
249+
```
250+
251+
This is mixing a `:global` block, which means "everything in here is unscoped", with a scoped selector (`x` in this case). As a result it's not possible to transform the inner selector (`y` in this case) into something that satisfies both requirements. You therefore have to split this up into two selectors:
252+
253+
```css
254+
:global {
255+
y {
256+
color: red;
257+
}
258+
}
259+
260+
x y {
261+
color: red;
262+
}
239263
```
240264

241265
### css_global_block_invalid_modifier

apps/svelte.dev/content/docs/svelte/98-reference/30-compiler-errors.md

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -240,7 +240,31 @@ A top-level `:global {...}` block can only contain rules, not declarations
240240
### css_global_block_invalid_list
241241

242242
```
243-
A `:global` selector cannot be part of a selector list with more than one item
243+
A `:global` selector cannot be part of a selector list with entries that don't contain `:global`
244+
```
245+
246+
The following CSS is invalid:
247+
248+
```css
249+
:global, x {
250+
y {
251+
color: red;
252+
}
253+
}
254+
```
255+
256+
This is mixing a `:global` block, which means "everything in here is unscoped", with a scoped selector (`x` in this case). As a result it's not possible to transform the inner selector (`y` in this case) into something that satisfies both requirements. You therefore have to split this up into two selectors:
257+
258+
```css
259+
:global {
260+
y {
261+
color: red;
262+
}
263+
}
264+
265+
x y {
266+
color: red;
267+
}
244268
```
245269

246270
### css_global_block_invalid_modifier

0 commit comments

Comments
 (0)