Padrão
<x-ui.cookie-consent class="static! w-full max-w-md shadow-none ring-1 ring-neutral-200" />
<x-ui.cookie-consent>
Aviso de cookies. Não bloqueia nada: registra que o visitante foi informado e some. Renderizado no servidor, então quem já aceitou nunca recebe o markup.
<x-ui.cookie-consent class="static! w-full max-w-md shadow-none ring-1 ring-neutral-200" />
Este site usa cookies para medir audiência. Ao continuar, você concorda com a política de privacidade.
<x-ui.cookie-consent name="aviso_lgpd" class="static! w-full max-w-md shadow-none ring-1 ring-neutral-200">
Este site usa cookies para medir audiência. Ao continuar, você concorda com a política de privacidade.
</x-ui.cookie-consent>
<x-ui.cookie-consent
policy="/termos"
class="static! w-full max-w-md shadow-none ring-1 ring-neutral-200"
/>
x-ui.cookie-consent
| Prop | Padrão | Aceita |
|---|---|---|
| policy | null | |
| name | null |
As três camadas estão explicadas em Começar aqui. Abaixo, o que este componente expõe a cada uma.
Ui::cookieConsent()
part()
e
replacePart()
aceitam:
base, text e actions.
Redefina no
@theme
do site:
--shadow-surface.
goognet-ui.cookie_consent.name. Por isso o nome se troca no config: com a prop name diferente, a exceção não acompanha e o banner não some.cookie_consent=accepted por um ano, em Path=/ e SameSite=Lax, e remove o card.sm para cima vira card no canto inferior esquerdo, longe do botão flutuante do WhatsApp.--cookie-consent-height com um ResizeObserver, e o ui.css usa isso dentro de body:has([data-cookie-consent]). O texto quebra em mais linhas em telas menores, então um deslocamento fixo erraria. Medido em 390px: barra de 183px, botão 12px acima dela; ao aceitar, a variável é removida e o botão volta para 12px do fundo.data-floating no elemento fixo. Outro botão flutuante que precise do mesmo tratamento é só marcar igual.privacy quando ela existe, e some quando não existe. Passe policy para apontar para outro lugar.static! tira o card do fixed só para ele aparecer dentro do catálogo.