33 lines
872 B
Svelte
33 lines
872 B
Svelte
<script lang="ts">
|
|
import { Button } from 'bits-ui';
|
|
import IconPlus from '~icons/tabler/plus';
|
|
|
|
let { createHref = null, msgAdd = '', children } = $props();
|
|
</script>
|
|
|
|
{#if createHref}
|
|
<Button.Root
|
|
href={createHref}
|
|
class="fixed flex items-center sm:bottom-12 sm:right-12 bottom-6 right-6
|
|
bg-neutral-100 rounded-full shadow-xl sm:px-6 sm:py-2 p-4
|
|
transition-all duration-300 ease-in-out
|
|
hover:bg-neutral-300 hover:scale-105"
|
|
>
|
|
<span class="hidden sm:block">{msgAdd}</span>
|
|
<IconPlus class="sm:ml-2" />
|
|
</Button.Root>
|
|
{/if}
|
|
|
|
<div class="w-full sm:px-6 px-3 py-4 max-w-3xl mx-auto">
|
|
{#if children}
|
|
{@render children?.()}
|
|
{:else}
|
|
<div class="p-4 text-center text-neutral-700">
|
|
<p>Nothing here.</p>
|
|
{#if createHref}
|
|
<p>Get started by clicking "{msgAdd}".</p>
|
|
{/if}
|
|
</div>
|
|
{/if}
|
|
</div>
|