scss: be more specific with :target highlight and its children

l-zeuch · l-zeuch · commit da9e522802c2 · 2025-10-01T12:34:16.000+02:00
Turns out that pseudo-classes need a selector. Yeah, that took me a bit
to figure out. Given that we really only care about tr:target, specify
the rule to be just about tr:target.

I also noticed that sometimes the background colour is doubled, making
it look a bit weird. Just applying to the td children makes that go
away, too.

Signed-off-by: Luca Zeuch &lt;l-zeuch@email.de&gt;
diff --git a/assets/scss/common/_custom.scss b/assets/scss/common/_custom.scss
@@ -9,9 +9,9 @@ a.broken {
     text-decoration: underline;
 }
 
-:target {
-  scroll-margin-top: 10rem;
-  * {
+tr:target {
+  scroll-margin-top: 10rem !important;
+  td {
     // slightly transparent yellow
     background: rgba(255, 255, 0, 0.3);
   }

Original file line number	Diff line number	Diff line change
`@@ -9,9 +9,9 @@ a.broken {`
`9`	`9`	`text-decoration: underline;`
`10`	`10`	`}`
`11`	`11`
`12`		`-:target {`
`13`		`- scroll-margin-top: 10rem;`
`14`		`- * {`
	`12`	`+tr:target {`
	`13`	`+ scroll-margin-top: 10rem !important;`
	`14`	`+ td {`
`15`	`15`	`// slightly transparent yellow`
`16`	`16`	`background: rgba(255, 255, 0, 0.3);`
`17`	`17`	`}`