e96ffd43e7
* Squash - feature complete * remove need to init assetstore * More optimizations. No need to init. Fix tests * lint * add missing selector for e2e * e2e selectors again * Update: fully reactive store, some transitions, bugfixes * merge fallout * Test fallout * safari quirk * security * lint * lint * Bug fixes * lint/format * accidental commit * lock * null check, more throttle * revert long duration * Fix intersection bounds * Fix bugs in intersection calculation * lint, tweak scrubber ui a tiny bit * bugfix - deselecting asset doesnt work * fix not loading bucket, scroll off-by-1 error, jsdoc, naming
40 lines
991 B
Svelte
40 lines
991 B
Svelte
<script lang="ts">
|
|
interface Props {
|
|
height: number;
|
|
title: string;
|
|
}
|
|
|
|
let { height = 0, title }: Props = $props();
|
|
</script>
|
|
|
|
<div class="overflow-clip" style:height={height + 'px'}>
|
|
<div
|
|
class="flex z-[100] pt-[calc(1.75rem+1px)] pb-5 h-6 place-items-center text-xs font-medium text-immich-fg bg-immich-bg dark:bg-immich-dark-bg dark:text-immich-dark-fg md:text-sm"
|
|
>
|
|
{title}
|
|
</div>
|
|
<div class="animate-pulse absolute w-full h-full" data-skeleton="true"></div>
|
|
</div>
|
|
|
|
<style>
|
|
[data-skeleton] {
|
|
background-image: url('/light_skeleton.png');
|
|
background-repeat: repeat;
|
|
background-size: 235px, 235px;
|
|
}
|
|
:global(.dark) [data-skeleton] {
|
|
background-image: url('/dark_skeleton.png');
|
|
}
|
|
@keyframes delayedVisibility {
|
|
to {
|
|
visibility: visible;
|
|
}
|
|
}
|
|
[data-skeleton] {
|
|
visibility: hidden;
|
|
animation:
|
|
0s linear 0.1s forwards delayedVisibility,
|
|
pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
|
}
|
|
</style>
|