Files
housesof/src/molecules/PaginationDots.svelte
Félix Péault e27e8a16db Code clean
- Imports/exports always at top
- Sapper template not needing a div to execute
- NPM packages updates: @rollup/plugin-commonjs 11.1.0 has a bug about import/exports
2020-04-12 11:54:08 +02:00

23 lines
623 B
Svelte

<script>
import { createEventDispatcher } from 'svelte'
// Props
export let className = ''
export let photos
export let currentIndex
const dispatch = createEventDispatcher()
</script>
<ol class={className}>
{#each photos as dot, index}
<li
class:active={index === currentIndex}
class:small={index < currentIndex - 2 || index > currentIndex + 2}
class:hidden={index < currentIndex - 3 || index > currentIndex + 3}
on:click={() => dispatch('goToIndex', index)}
>
<button aria-label="Go to photo #{index + 1}"></button>
</li>
{/each}
</ol>