Injetar Stylus em shadowRoots

injeta estilos do stylus-addon em shadowRoot

Versão de: 29/06/2025. Veja: a última versão.

Autor
hdyzen
Avaliações
0 0 0
Versão
1.1
Criado
29/06/2025
Atualizado
29/06/2025
Tamanho
1,57 KB
Licença
GPL-3.0-only
Aplicável a
Todos os sites

Injetar Stylus em shadowRoots

Este userscript injeta estilos da extensão Stylus diretamente em instâncias de shadowRoot, permitindo que você estilize o conteúdo de web components.


Como estilizar conteúdo dentro de um shadowRoot

:host

Para aplicar estilos apenas ao conteúdo dentro de um shadowRoot, use o pseudo‑selector :host nos seus estilos Stylus. :host se refere ao elemento que contém o shadowRoot (o shadow host).

/* Todos os elementos */
* {
  border: 1px violet;
}
/* Apenas elementos dentro do shadowRoot */
:host * {
  border: 1px solid mediumpurple;
}

Formas similares: