Joururi/echoes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changed closed icon and added one token

Browse Source
This commit is contained in:
Alexis
2025-12-27 18:28:24 +01:00
parent 86e3f101f6
commit 13f8ede6a1
4 changed files with 41 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/map/MapSidebar.vue
View File

@@ -15,10 +15,15 @@ function handleFoodClick() {
<template>
<aside class="rounded bg-background border border-border shadow-sm">
<header class="py-1.5 px-2 text-[.8em] font-medium border-b border-border">
<h2>
Calques
</h2>
</header>
<menu class="first:pt-0.5 last:pb-0.5">
<li>
<button
class="pl-2 pr-3 py-1.5 text-xs cursor-pointer flex items-start gap-1"
class="w-full pl-2 pr-3 py-1.5 text-xs cursor-pointer flex items-start gap-1 hover:bg-foreground/10"
:class="{
'text-foreground *:fill-foreground': !activeLayers.food,
'text-emerald-600 *:fill-emerald-600': activeLayers.food
@@ -40,7 +45,7 @@ function handleFoodClick() {
</li>
<li>
<button
class="pl-2 pr-3 py-1.5 text-xs cursor-pointer flex items-start gap-1"
class="pl-2 pr-3 py-1.5 text-xs cursor-pointer flex items-start gap-1 hover:bg-foreground/10"
:class="{
'text-foreground *:fill-foreground': !activeLayers.tokens,
'text-emerald-600 *:fill-emerald-600': activeLayers.tokens

45
src/components/map/ReviewMarker.vue
View File

@@ -5,11 +5,14 @@ import type { PointTuple } from 'leaflet';
import { computed, ref } from 'vue';
import { cn } from '@/lib/cn';
defineProps<{
const props = defineProps<{
marker: ReviewMarker
}>()
const iconSize = ref<PointTuple>([38, 38])
const normalIconSize: PointTuple = [38, 38]
const tinyIconSize: PointTuple = [28, 28]
const iconSize = ref<PointTuple>(props.marker.closed ? tinyIconSize : normalIconSize)
const iconAnchor = computed<PointTuple>(() => [iconSize.value[0] / 2, iconSize.value[1]])
const popupOffset = [0, iconSize.value[0] * -0.66]
</script>
@@ -33,24 +36,28 @@ const popupOffset = [0, iconSize.value[0] * -0.66]
{ 'grayscale': marker.closed }
)"
>
<img v-if="marker.type === 'bar'" src="/map/icons/bar.svg" />
<img v-if="marker.type === 'bakery'" src="/map/icons/bakery.svg" />
<img v-if="marker.type === 'tea-shop'" src="/map/icons/tea-shop.svg" />
<img v-if="marker.type === 'coffee-shop'" src="/map/icons/coffee-shop.svg" />
<img v-if="marker.type === 'ice-cream'" src="/map/icons/ice-cream.svg" />
<img v-if="marker.type === 'food-truck'" src="/map/icons/truck.svg" />
<img v-if="marker.closed" src="/map/icons/ghost.svg" />
<template v-else-if="marker.type === 'restaurant'">
<img v-if="marker.food === 'asian'" src="/map/icons/asian.svg" />
<img v-else-if="marker.food === 'burgers'" src="/map/icons/burgers.svg" />
<!-- <img v-else-if="marker.food === 'creperie'" src="/map/icons/creperie.svg" /> -->
<!-- <img v-else-if="marker.food === 'eastern'" src="/map/icons/eastern.svg" /> -->
<img v-else-if="marker.food === 'fast-food'" src="/map/icons/fast-food.svg" />
<img v-else-if="marker.food === 'italian'" src="/map/icons/italian.svg" />
<img v-else-if="marker.food === 'seafood'" src="/map/icons/seafood.svg" />
<!-- <img v-else-if="marker.food === 'street-food'" src="/map/icons/street-food.svg" /> -->
<img v-else-if="marker.food === 'vegetarian'" src="/map/icons/vegetarian.svg" />
<img v-else src="/map/icons/restaurant.svg" />
<template v-else>
<img v-if="marker.type === 'bar'" src="/map/icons/bar.svg" />
<img v-else-if="marker.type === 'bakery'" src="/map/icons/bakery.svg" />
<img v-else-if="marker.type === 'tea-shop'" src="/map/icons/tea-shop.svg" />
<img v-else-if="marker.type === 'coffee-shop'" src="/map/icons/coffee-shop.svg" />
<img v-else-if="marker.type === 'ice-cream'" src="/map/icons/ice-cream.svg" />
<img v-else-if="marker.type === 'food-truck'" src="/map/icons/truck.svg" />
<template v-else-if="marker.type === 'restaurant'">
<img v-if="marker.food === 'asian'" src="/map/icons/asian.svg" />
<img v-else-if="marker.food === 'burgers'" src="/map/icons/burgers.svg" />
<!-- <img v-else-if="marker.food === 'creperie'" src="/map/icons/creperie.svg" /> -->
<!-- <img v-else-if="marker.food === 'eastern'" src="/map/icons/eastern.svg" /> -->
<img v-else-if="marker.food === 'fast-food'" src="/map/icons/fast-food.svg" />
<img v-else-if="marker.food === 'italian'" src="/map/icons/italian.svg" />
<img v-else-if="marker.food === 'seafood'" src="/map/icons/seafood.svg" />
<!-- <img v-else-if="marker.food === 'street-food'" src="/map/icons/street-food.svg" /> -->
<img v-else-if="marker.food === 'vegetarian'" src="/map/icons/vegetarian.svg" />
<img v-else src="/map/icons/restaurant.svg" />
</template>
</template>
<div

4
src/stores/parisTokens.ts
View File

@@ -23,6 +23,10 @@ export const useParisTokensStore = defineStore('paris-tokens', () => {
coords: [48.01889482103195, -2.1739765065268],
title: "Brocéliande, la Porte des Secrets - Paimpont"
},
{
coords: [48.12445665790851, -1.2151411880015635],
title: "Chateau de Vitré"
},
{
coords: [48.68378516188998, -3.9867849311824264],
title: "Saint Pol de Léon",