starred/reiverr
1
0
Fork 0
mirror of https://github.com/aleksilassila/reiverr.git synced 2026-04-28 03:25:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

Bug fixes and refactoring regarding

Browse Source
This commit is contained in:
Aleksi Lassila
2024-01-27 20:33:23 +02:00
parent 14eae0fa9b
commit b14bf78292
14 changed files with 252 additions and 295 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/lib/components/Carousel/CarouselPlaceholderItems.svelte
View File

@@ -1,31 +1,30 @@
<script lang="ts">
import CardPlaceholder from '../Card/CardPlaceholder.svelte';
import classNames from 'classnames';
import Container from '../../../Container.svelte';
import type { Readable } from 'svelte/store';
export let size: 'dynamic' | 'md' | 'lg' = 'md';
export let orientation: 'landscape' | 'portrait' = 'landscape';
let focusIndex: Readable<number>;
let focusWithin: Readable<boolean>;
</script>
<p
class={classNames({
'bg-blue-500': $focusWithin
})}
>
Index: {$focusIndex}
</p>
{#each Array(10) as _, i (i)}
<Container
bind:focusIndex
bind:focusWithin
class={classNames({
'bg-red-500': $focusIndex === i && $focusWithin
})}
>
<CardPlaceholder {size} index={i} {orientation} />
</Container>
{/each}
<script lang="ts">
import CardPlaceholder from '../Card/CardPlaceholder.svelte';
import classNames from 'classnames';
import Container from '../../../Container.svelte';
import type { Readable, Writable } from 'svelte/store';
export let size: 'dynamic' | 'md' | 'lg' = 'md';
export let orientation: 'landscape' | 'portrait' = 'landscape';
export let focusIndex: Readable<number>;
let focusWithin: Writable<boolean>;
</script>
<p
class={classNames({
'bg-blue-500': $focusWithin
})}
>
Index: {$focusIndex}
</p>
{#each Array(10) as _, i (i)}
<Container
bind:focusWithin
class={classNames({
'bg-red-500': $focusIndex === i && $focusWithin
})}
>
<CardPlaceholder {size} index={i} {orientation} />
</Container>
{/each}