diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/About.svelte | 16 | ||||
| -rw-r--r-- | src/components/LocationsMap.svelte | 58 |
2 files changed, 36 insertions, 38 deletions
diff --git a/src/components/About.svelte b/src/components/About.svelte index e94f3d7a..1e60db72 100644 --- a/src/components/About.svelte +++ b/src/components/About.svelte @@ -92,15 +92,15 @@ </p> <!-- <LocationsMap {locations} /> --> <a href="/map"> - <div class="relative"> - <img src="/map.png" class="mx-auto" /> + <div class="relative"> + <img src="/map.png" class="mx-auto" /> - <button - class="bg-black text-white border rounded-full px-6 py-2 font-bold hover:opacity-80 absolute left-1/2 top-1/2 text-2xl" - > - View map - </button> - </div> + <button + class="bg-black text-white border rounded-full px-6 py-2 font-bold hover:opacity-80 absolute left-1/2 top-1/2 text-2xl" + > + View map + </button> + </div> </a> </div> {/if} diff --git a/src/components/LocationsMap.svelte b/src/components/LocationsMap.svelte index 9996df10..79ea4bf3 100644 --- a/src/components/LocationsMap.svelte +++ b/src/components/LocationsMap.svelte @@ -214,40 +214,38 @@ onDestroy(() => map && map.remove()); </script> - <div class="w-screen h-screen flex" id="map" bind:this={mapWrapper}> <div - id="map-container" - class="mx-auto h-full w-full z-0" - bind:this={mapContainer} - /> - <div class="relative"> - <div class="flex absolute flex top-2 right-2 gap-2"> - <button - class="rounded-full border-2 border-black bg-white w-10 h-10" - on:click={toggle} - > - {#if timeout} - <Icon icon="pause" style="w-4 m-auto" /> - {:else} - <Icon icon="play" style="w-4 m-auto" /> - {/if} - </button> - </div> - </div> + id="map-container" + class="mx-auto h-full w-full z-0" + bind:this={mapContainer} + /> + <div class="relative"> + <div class="flex absolute flex top-2 right-2 gap-2"> + <button + class="rounded-full border-2 border-black bg-white w-10 h-10" + on:click={toggle} + > + {#if timeout} + <Icon icon="pause" style="w-4 m-auto" /> + {:else} + <Icon icon="play" style="w-4 m-auto" /> + {/if} + </button> + </div> </div> +</div> - <!-- <div class="hidden lg:grid grid-cols-3 justify-items-center"> --> - <!-- {#each inview as m} --> - <!-- <button --> - <!-- on:click={() => select(m)} --> - <!-- class="text-left" --> - <!-- class:font-bold={m.id === inview[currentIndex]?.id} --> - <!-- id={`marker-${m.id}`}>{m.tags.name}</button --> - <!-- > --> - <!-- {/each} --> - <!-- </div> --> - +<!-- <div class="hidden lg:grid grid-cols-3 justify-items-center"> --> +<!-- {#each inview as m} --> +<!-- <button --> +<!-- on:click={() => select(m)} --> +<!-- class="text-left" --> +<!-- class:font-bold={m.id === inview[currentIndex]?.id} --> +<!-- id={`marker-${m.id}`}>{m.tags.name}</button --> +<!-- > --> +<!-- {/each} --> +<!-- </div> --> <style> #map:fullscreen, |