<script>
    import { fly } from 'svelte/transition'
    let show = false;

    function scrollUp() {
        document.body.scrollIntoView({behavior: "smooth"})
    }

    function hide() {
        if (window.scrollY > 60) {
            show = true
        } else {
            show = false
        }
    }
</script>

<style>
    #backtotop {
        border-radius: 100%;
        width: 50px;
        height: 50px;
        position: fixed;
        right: 4%;
        bottom: 10%;
    }

</style>

<svelte:window on:scroll={hide}></svelte:window>

{#if (show)}
    <button id="backtotop"
    transition:fly="{{ y : 200, duration:400}}"
    on:click={scrollUp}>
        ▲
    </button>
{/if}