ivy.rs/src/components/ui/Notif.astro
2025-04-27 20:37:04 +01:00

30 lines
617 B
Text

---
import { clsx } from "clsx";
interface Props {
level: number;
icon?: string;
heading?: string;
xstyle?: string;
}
// level 0: info/note
// level 1: warning
// level 2: attn needed: oh fuck
const { level, icon, heading, xstyle } = Astro.props;
---
<div
class={clsx(`text-black ${xstyle}`, {
"bg-light-ye dark:bg-dark-ye": level === 0,
"bg-light-or dark:bg-dark-or": level === 1,
"bg-light-re dark:bg-dark-re": level === 2,
})}
>
<div class="flex items-center">
{icon && <i class={`${icon} text-xl mr-2`}></i>}
{heading && <h2 class="text-xl font-bold">{heading}</h2>}
</div>
<slot />
</div>