public/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-11-23 23:00:42 +09:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix(web): small fixes for empty placeholder (#7859)

Browse Source
This commit is contained in:
Michel Heusschen
2024-03-12 02:18:47 +01:00
committed by GitHub
parent 4023c665cc
commit b7e5407822
9 changed files with 18 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
web/src/lib/components/shared-components/empty-placeholder.svelte
View File

@@ -1,28 +1,24 @@
<script lang="ts">
import empty1Url from '$lib/assets/empty-1.svg';
export let actionHandler: undefined | (() => unknown) = undefined;
export let text = '';
export let alt = '';
export let onClick: undefined | (() => unknown) = undefined;
export let text: string;
export let fullWidth = false;
export let src = empty1Url;
const noop = () => {};
$: width = fullWidth ? 'w-full' : 'w-1/2';
$: handler = actionHandler || noop;
$: width = fullWidth ? 'w-full' : 'w-[50%]';
const hoverClasses = actionHandler
? `border dark:border-immich-dark-gray hover:bg-immich-primary/5 dark:hover:bg-immich-dark-primary/25 hover:cursor-pointer`
const hoverClasses = onClick
? `border dark:border-immich-dark-gray hover:bg-immich-primary/5 dark:hover:bg-immich-dark-primary/25`
: '';
</script>
<!-- svelte-ignore a11y-no-static-element-interactions -->
<div
on:click={handler}
on:keydown={handler}
<svelte:element
this={onClick ? 'button' : 'div'}
on:click={onClick}
class="{width} m-auto mt-10 flex flex-col place-content-center place-items-center rounded-3xl bg-gray-50 p-5 dark:bg-immich-dark-gray {hoverClasses}"
>
<img {src} {alt} width="500" draggable="false" />
<p class="text-immich-text-gray-500 text-center dark:text-immich-dark-fg">{text}</p>
</div>
<img {src} alt="" width="500" draggable="false" />
<p class="text-immich-text-gray-500 dark:text-immich-dark-fg">{text}</p>
</svelte:element>