alex/voyage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: update marker colors based on visit status for countries, regions, and cities

Browse Source
This commit is contained in:
Sean Morley
2025-06-06 11:00:46 -04:00
parent 2d7b6c85c9
commit c0f2d060db
3 changed files with 11 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/routes/worldtravel/+page.svelte
View File

@@ -142,7 +142,13 @@
{#if country.latitude && country.longitude} {#if country.latitude && country.longitude}
<Marker <Marker
lngLat={[country.longitude, country.latitude]} lngLat={[country.longitude, country.latitude]}
class="grid px-2 py-1 place-items-center rounded-full border border-gray-200 bg-green-200 text-black focus:outline-6 focus:outline-black" class={`grid px-2 py-1 place-items-center rounded-full border border-gray-200 ${
country.num_visits === 0
? 'bg-red-200'
: country.num_visits === country.num_regions
? 'bg-green-200'
: 'bg-blue-200'
} text-black focus:outline-6 focus:outline-black`}
on:click={() => goto(`/worldtravel/${country.country_code}`)} on:click={() => goto(`/worldtravel/${country.country_code}`)}
> >
<span class="text-xs"> <span class="text-xs">

4
frontend/src/routes/worldtravel/[id]/+page.svelte
View File

@@ -173,8 +173,8 @@
class="grid px-2 py-1 place-items-center rounded-full border border-gray-200 {visitedRegions.some( class="grid px-2 py-1 place-items-center rounded-full border border-gray-200 {visitedRegions.some(
(visitedRegion) => visitedRegion.region === region.id (visitedRegion) => visitedRegion.region === region.id
) )
? 'bg-red-300' ? 'bg-green-200'
: 'bg-blue-300'} text-black focus:outline-6 focus:outline-black" : 'bg-red-200'} text-black focus:outline-6 focus:outline-black"
on:click={togleVisited(region)} on:click={togleVisited(region)}
> >
<span class="text-xs"> <span class="text-xs">

4
frontend/src/routes/worldtravel/[id]/[id]/+page.svelte
View File

@@ -117,8 +117,8 @@
class="grid px-2 py-1 place-items-center rounded-full border border-gray-200 {visitedCities.some( class="grid px-2 py-1 place-items-center rounded-full border border-gray-200 {visitedCities.some(
(visitedCity) => visitedCity.city === city.id (visitedCity) => visitedCity.city === city.id
) )
? 'bg-red-300' ? 'bg-green-200'
: 'bg-blue-300'} text-black focus:outline-6 focus:outline-black" : 'bg-red-200'} text-black focus:outline-6 focus:outline-black"
on:click={togleVisited(city)} on:click={togleVisited(city)}
> >
<span class="text-xs"> <span class="text-xs">