generateur_v3/frontend/src/routes/room/join/+page.svelte

<script lang="ts">
  import { goto } from "$app/navigation";
  import InputWithLabel from "../../../components/forms/InputWithLabel.svelte";


  let room = "";
</script>

<div class="container">
  <div class="form">
    <h1>Rejoindre une salle</h1>
    <InputWithLabel label="Code de la salle" bind:value={room} required/>
    <button class="primary-btn" on:click={()=>{goto('/room/' + room.replace('#', ""))}}>
      Rejoindre
    </button>
  </div>
</div>

<style lang="scss">
  h1 {
    font-size: 3em;
    margin-top: 20px;
  }

  .form {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: min(100%, 666px);
    padding: 7px 20px;
  }

  .container {
    display: flex;
    justify-content: center;
  }
</style>