Hide light/dark word on mobile

[Regenhardt]

On mobile the Dark/Light word of the dark mode toggle goes into the actual content. I think it would work to just hide it and rely on the symbol alone to serve as sufficient hint about what it does:

[Regenhardt]

Tried the following but it didn't work, not sure why:

@media(max-width: 1080px) {
  dark-mode span.wrapper > span:nth-last-child() {
    display: none;
  }
}

[jaywcjlove]

@Regenhardt Updated 5.0.3: You can use the following CSS selectors to hide the text and icon parts of the dark-mode component:

dark-mode::part(text) {
    display: none;
}
dark-mode::part(icon) {
    display: none;
}

[Regenhardt]

Very nice, thank you.