Something went wrong. Try again.
[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
Something went wrong. Try again.
1.1 kB · 43 lines
Astro
at main
1234567891011121314151617181920212223242526272829303132333435363738394041424344---interface Props { title: string; class?: string;}
const { title, class: className } = Astro.props;---
<div class:list={[ "rounded-2xl bg-red-50 mb-6 dark:bg-red-500/5 p-4 dark:ring-1 dark:ring-red-500/10 not-prose max-w-full", className, ]}> <div class="flex"> <div class="flex-shrink-0"> <svg class="h-5 w-5 text-red-500" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true" > <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z" clip-rule="evenodd"></path> </svg> </div> <div class="ml-3 flex items-center flex-col"> <h3 class="text-sm font-medium text-red-800 dark:text-red-500"> {title ? title : <slot />} </h3> { title ? ( <div class="mt-2 text-sm text-red-700 dark:text-red-400"> <slot /> </div> ) : null } </div> </div></div>