Skip to content

Alert

Argument Required Type Default Description
type No string null Specifies the type of the alert. Options are: info, success, warning, error.
title No string null The title of the alert. Appears in bold above the description text.
description No string null A brief description or additional information about the alert.
shadow No boolean true Adds a shadow effect to the alert box. Can be set to false to remove the shadow.
text No string "white" Sets the text color of the alert. Accepts any valid text color class, e.g., text-black.

Component from DaisyUI

https://daisyui.com/components/alert/

Installation

cotton-daisy add alert

Usage

<c-alert title="Info Alert" description="Info alert description"/>

<c-alert type="info" title="Info Alert" description="Info alert description"/>

<c-alert type="success" title="Success Alert" description="Success alert description"/>

<c-alert type="warning" title="Warning Alert" description="Warning alert description"/>

<c-alert type="error" title="Error Alert" description="Error alert description"/>

<c-alert type="info">
    <h2>Custom content</h2>
</c-alert>

<c-alert type="info">
    <c-slot name="title">
        <h2>Custom title</h2>
    </c-slot>
    <c-slot name="description">
        <p>Custom description</p>
</c-alert>