Coves frontend - a photon fork
1<script lang="ts">
2 import { Material } from 'mono-svelte'
3 import { Icon, InformationCircle } from 'svelte-hero-icons/dist'
4 import type { ClassValue } from 'svelte/elements'
5
6 interface Props {
7 content?: string | undefined
8 children?: import('svelte').Snippet
9 class?: ClassValue
10 }
11
12 let { content = undefined, children, class: clazz = '' }: Props = $props()
13</script>
14
15<Material
16 color="info"
17 rounding="2xl"
18 class={['flex flex-row items-center px-3 py-2.5', clazz]}
19>
20 <Icon
21 src={InformationCircle}
22 size="20"
23 micro
24 class="inline-block rounded-lg clear-both float-left mr-2"
25 />
26 <div class="flex flex-col md:flex-row items-center w-full">
27 {#if children}
28 {@render children?.()}
29 {:else if content}
30 <p class="text-left justify-self-start">
31 {content}
32 </p>
33 {/if}
34 </div>
35</Material>