Info Callout
El InfoCallout aclara un detalle justo donde importa: una renovación automática, un plazo por vencer o un beneficio del plan.
Plan TAG mensual
$4.990
JTRX-12
El plan se renueva automáticamente cada mes, salvo que lo canceles.
Anatomía
Una superficie suave con ícono y texto. La acción al final es opcional y sirve para resolver el aviso sin salir de la pantalla.
Tu SOAP vence en 12 días.
- Superficie
- Ícono
- Texto
- Acción opcional
Variantes
El tono dice qué tan importante es la nota. warning cambia también el ícono a una alerta.
El técnico llega en un bloque de 2 horas.
InfoAclaraciones neutras que conviene saber antes de seguir.
Tu revisión técnica vence en 12 días.
WarningAlgo que requiere atención o una acción pronto.
Tu plan incluye retiro y entrega gratis.
SecondaryBeneficios y detalles positivos del plan o servicio.
Opciones
Tu SOAP vence en 12 días.
Con acciónUn Button ghost pequeño en trailing para resolver el aviso ahí mismo.
Tu primera mantención tiene 15% de descuento.
Ícono propioReemplaza el ícono por defecto cuando otro explica mejor el mensaje.
Uso
El técnico llega en un bloque de 2 horas.
Una idea por callout, cerca de lo que explica.
El técnico llega en un bloque de 2 horas.
Ten a mano el padrón del auto.
Puedes reagendar sin costo.
Varios callouts seguidos. Junta lo importante o muévelo a otra pantalla.
Tu revisión técnica vence en 12 días.
warning solo cuando hay algo que hacer o un plazo que cuidar.
Atendemos de lunes a sábado.
warning para información neutra. Asusta sin motivo.
Código
import { InfoCallout } from '@carvuk/design-system/components/info-callout';
<InfoCallout>Tu plan TAG se renueva cada mes.</InfoCallout>
<InfoCallout tone='warning'>Tu SOAP vence en 12 días.</InfoCallout>