Add event handlers
This commit is contained in:
@@ -1,22 +1,42 @@
|
|||||||
<script>
|
<script>
|
||||||
|
import { onMount } from 'svelte'
|
||||||
/**
|
/**
|
||||||
* Enable Next/Previos arrows
|
* Enable Next/Previos arrows
|
||||||
*/
|
*/
|
||||||
export let arrows = true;
|
export let arrows = true;
|
||||||
|
|
||||||
|
let contentContainerElement
|
||||||
|
let children
|
||||||
|
onMount(() => {
|
||||||
|
children = contentContainerElement.children
|
||||||
|
})
|
||||||
|
|
||||||
|
function handleLeftClick() {
|
||||||
|
// TODO: implement
|
||||||
|
}
|
||||||
|
function handleRightClick() {
|
||||||
|
// TODO: implement
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="main-container">
|
<div class="main-container">
|
||||||
{#if arrows}
|
{#if arrows}
|
||||||
<div class="side-container">
|
<div class="side-container">
|
||||||
<span class="clickable"><</span>
|
<span
|
||||||
|
class="clickable"
|
||||||
|
on:click={handleLeftClick}
|
||||||
|
><</span>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
<div class="content-container">
|
<div class="content-container" bind:this={contentContainerElement}>
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
{#if arrows}
|
{#if arrows}
|
||||||
<div class="side-container">
|
<div class="side-container">
|
||||||
<span class="clickable">></span>
|
<span
|
||||||
|
class="clickable"
|
||||||
|
on:click={handleRightClick}
|
||||||
|
>></span>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
@@ -28,6 +48,7 @@
|
|||||||
}
|
}
|
||||||
.content-container {
|
.content-container {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
}
|
}
|
||||||
.side-container {
|
.side-container {
|
||||||
background-color: cornflowerblue;
|
background-color: cornflowerblue;
|
||||||
|
|||||||
Reference in New Issue
Block a user