flo-bit.dev
[READ-ONLY] Mirror of https://github.com/flo-bit/tiny-docs. quick setup, simple, minimalistic docs for your github project
flo-bit.dev/tiny-docs/
1---
2interface Props {
3 title: string;
4 class?: string;
5}
6
7const { title, class: className } = Astro.props;
8---
9
10<div
11 class:list={[
12 "rounded-2xl bg-red-50 mb-6 dark:bg-red-950/10 p-4 dark:ring-1 dark:ring-red-500/10 not-prose max-w-full",
13 className,
14 ]}
15>
16 <div class="flex">
17 <div class="flex-shrink-0">
18 <svg
19 xmlns="http://www.w3.org/2000/svg"
20 fill="none"
21 viewBox="0 0 24 24"
22 stroke-width="1.5"
23 stroke="currentColor"
24 class="size-5 text-red-500"
25 >
26 <path
27 stroke-linecap="round"
28 stroke-linejoin="round"
29 d="M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z"
30 ></path>
31 </svg>
32 </div>
33 <div class="ml-3 flex items-start flex-col">
34 <h3 class="text-sm font-medium text-red-800 dark:text-red-500">
35 Caution
36 </h3>
37
38 <div
39 class="text-sm text-red-700 dark:text-red-400 [&_p]:mt-2 [&_a]:font-bold [&_a]:text-red-700 dark:[&_a]:text-red-300"
40 >
41 <slot />
42 </div>
43 </div>
44 </div>
45</div>