Components
Loading preview...
Alert in shadcn/ui format
npx shadcn@latest add https://21st.dev/r/serafimcloud/alertimport { Alert, AlertContent, AlertTitle } from "@/components/ui/alert"
import { CircleAlert } from "lucide-react"
function AlertWithList() {
return (
<Alert
layout="complex"
variant="error"
icon={<CircleAlert className="opacity-60" size={16} strokeWidth={2} />}
>
<AlertContent>
<AlertTitle>Password does not meet requirements:</AlertTitle>
<ul className="list-inside list-disc text-sm opacity-80">
<li>Minimum 8 characters</li>
<li>Include a special character</li>
</ul>
</AlertContent>
</Alert>
)
}
export { AlertWithList }