team-1/frontend/src/routes/+page.svelte

<script lang="ts">
    import RoomComponent from "$lib/components/Room.svelte"
    import { parseRoom, type Room } from "$lib/types"

    let room: Room = { id: "asd", coords: [0.123, 0.456], name: "scatolame party", private: true, range: 124 }
</script>

<div class="h-full w-full flex-row justify-center p-4">
    <div class="relative min-h-screen justify-center justify-items-center">
        <h1>Scan your nearby rooms</h1>
        <img src="/smerdoradar.gif" alt="radar" class="h-64 w-64" />
        <div class="max-h-50 w-full overflow-y-auto">
            <RoomComponent {room} />
            <RoomComponent {room} />
            <RoomComponent {room} />
            <RoomComponent {room} />
            <RoomComponent {room} />
            <RoomComponent {room} />
            <RoomComponent {room} />
            <RoomComponent {room} />
            <RoomComponent {room} />
        </div>
        <div class="fixed right-0 bottom-0">
            <button class="mt-4 justify-end rounded bg-blue-500 px-6 py-2 text-white transition-colors hover:bg-blue-600 active:bg-blue-700"> + </button>
        </div>
    </div>
</div>