<script lang="ts">

    import {goto} from "$app/navigation";
</script>

<div class="rooms">
    <h1>Salles</h1>
    <div class="btns">
        <button class="primary-btn" on:click={()=>{goto('/room/join')}}>Rejoindre</button>
        <button class="primary-btn" on:click={()=>{goto('/room/create')}}>Créer</button>
    </div>
</div>

<style lang="scss">
    h1{
        font-size: 4rem;
        margin-bottom: 1rem;
    }
    .rooms {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .btns {
        display: flex;
        gap: 20px;
    }
</style>