fix: mark selectors as global to workaround Svelte CSS bug (sveltejs#508)

dummdidumm · web-flow · commit eb21df71c56d · 2024-10-22T17:47:09.000+02:00
related to sveltejs#482
diff --git a/apps/svelte.dev/src/routes/docs/[...path]/OnThisPage.svelte b/apps/svelte.dev/src/routes/docs/[...path]/OnThisPage.svelte
@@ -81,7 +81,8 @@
 		@media (max-width: 1199px) {
 			margin: 4rem 0;
 
-			&:not(:has(li:nth-child(2))) {
+			/* TODO remove :global once https://github.com/sveltejs/svelte/issues/13779 is fixed */
+			:global(&:not(:has(li:nth-child(2)))) {
 				/* hide widget if there are no subheadings */
 				display: none;
 			}
@@ -155,7 +156,8 @@
 					rotate: 90deg;
 				}
 
-				& + nav {
+				/* TODO remove :global once https://github.com/sveltejs/svelte/issues/13779 is fixed */
+				:global(& + nav) {
 					display: block;
 				}
 			}

Original file line number	Diff line number	Diff line change
`@@ -81,7 +81,8 @@`
`81`	`81`	`@media (max-width: 1199px) {`
`82`	`82`	`margin: 4rem 0;`
`83`	`83`
`84`		`- &:not(:has(li:nth-child(2))) {`
	`84`	`+ /* TODO remove :global once https://github.com/sveltejs/svelte/issues/13779 is fixed */`
	`85`	`+ :global(&:not(:has(li:nth-child(2)))) {`
`85`	`86`	`/* hide widget if there are no subheadings */`
`86`	`87`	`display: none;`
`87`	`88`	`}`
`@@ -155,7 +156,8 @@`
`155`	`156`	`rotate: 90deg;`
`156`	`157`	`}`
`157`	`158`
`158`		`- & + nav {`
	`159`	`+ /* TODO remove :global once https://github.com/sveltejs/svelte/issues/13779 is fixed */`
	`160`	`+ :global(& + nav) {`
`159`	`161`	`display: block;`
`160`	`162`	`}`
`161`	`163`	`}`