diff --git a/fluid-ui-svelte/src/app.css b/fluid-ui-svelte/src/app.css index fab02ed..f981fa3 100644 --- a/fluid-ui-svelte/src/app.css +++ b/fluid-ui-svelte/src/app.css @@ -109,7 +109,7 @@ /* Buttons ----------------------------*/ .fluid-button { - @apply w-full h-full p-1 + @apply size-full p-1 } .fluid-button.fluid-solid-button.fluid-primary-button { @@ -163,7 +163,7 @@ /* Tables ----------------------------*/ .fluid-table { - @apply w-full h-full border-1 border-primary-500 group-[.dark]:border-white text-center + @apply size-full border-1 border-primary-500 group-[.dark]:border-white text-center } .fluid-table-header { diff --git a/fluid-ui-svelte/src/lib/primitives/Image.svelte b/fluid-ui-svelte/src/lib/primitives/Image.svelte index c2e7a5e..3e27827 100644 --- a/fluid-ui-svelte/src/lib/primitives/Image.svelte +++ b/fluid-ui-svelte/src/lib/primitives/Image.svelte @@ -6,24 +6,26 @@ loadingSnippet, placeholderSnippet, overrideDefaultStyling = false, - rawElement, + rawElement = $bindable(), + src = $bindable(), ...restProps }: { class?: string; loadingSnippet?: Snippet; placeholderSnippet?: Snippet; noPlaceholders?: boolean; + src: string; overrideDefaultStyling?: boolean; rawElement?: HTMLElement; - } & Omit = $props(); + } & Omit = $props(); let status: "loading" | "done" | "failed" = $state("loading"); $effect(() => { - restProps.src ? (status = "loading") : ""; + src ? (status = "loading") : ""; }); -{#if status == "failed" || !restProps.src} +{#if status == "failed" || !src} {#if placeholderSnippet}
{@render placeholderSnippet()} diff --git a/fluid-ui-svelte/src/routes/containers/+page.svelte b/fluid-ui-svelte/src/routes/containers/+page.svelte index a0e1a7e..b6fa7de 100644 --- a/fluid-ui-svelte/src/routes/containers/+page.svelte +++ b/fluid-ui-svelte/src/routes/containers/+page.svelte @@ -5,7 +5,7 @@ - +