Valmor

Theme Controller

Controle segmentado de tema (claro/sepia/escuro) e contraste, integrado ao estado do site.

Variantes:
default showContrast sm

Theme Controller

Integrado ao tema do site — a escolha é aplicada e persistida. 
<!-- Theme Controller Component -->
<div class="theme-controller">
  Theme Controller content here
</div>
---
import Theme Controller from '@/components/ui/actions/Theme Controller/Theme Controller.astro';
---

<Theme Controller />

Variantes

default

default

Grupo segmentado com os três temas

showContrast

showContrast

Inclui o grupo de contraste (baixo/normal/alto)

sm

sm

Densidade compacta para barras e headers

Uso

Quando usar

  • Use Theme Controller para controle segmentado de tema (claro/sepia/escuro) e contraste, integrado ao estado do site.
  • Ideal para interfaces que precisam de ações

Boas práticas

  • Mantenha consistência com outros componentes da mesma categoria
  • Considere acessibilidade e estados de interação
  • Teste em diferentes tamanhos de tela