26 lines
893 B
Svelte
26 lines
893 B
Svelte
<script lang="ts">
|
|
export let headerLeft: string = "";
|
|
export let headerRight: string = "";
|
|
export let headerColour: string = "text-red-500";
|
|
export let footer: string = "";
|
|
</script>
|
|
|
|
<div class="bg-slate-100/10 dark:bg-slate-100/10 rounded-2xl shadow-2xl p-6 flex flex-col h-full w-full">
|
|
<div class="{headerColour} flex flex-row justify-between items-center mb-4">
|
|
<p class="text-2xl md:text-3xl font-bold truncate">{headerLeft}</p>
|
|
|
|
{#if headerRight}
|
|
<p class="max-md:hidden text-xl md:text-2xl truncate">{@html headerRight}</p>
|
|
{/if}
|
|
</div>
|
|
<hr class="mb-4 border-1" />
|
|
<div class="flex-1 flex flex-col justify-center p-5">
|
|
<slot />
|
|
</div>
|
|
{#if footer}
|
|
<hr class="my-4 border-1" />
|
|
<div class="mt-2 text-base opacity-90">
|
|
{@html footer}
|
|
</div>
|
|
{/if}
|
|
</div> |