From 453583c18959644f41efa6bcbf6023da63c3d1c7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Mon, 27 Jun 2022 11:31:44 +0200
Subject: [PATCH] Add link to see map on House location

---
 src/components/molecules/House.svelte        |  6 +++++-
 src/routes/[country]/[location]/index.svelte |  1 +
 src/style/molecules/_house.scss              | 11 ++++++++++-
 3 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/components/molecules/House.svelte b/src/components/molecules/House.svelte
index 6ef23a2..25d0102 100644
--- a/src/components/molecules/House.svelte
+++ b/src/components/molecules/House.svelte
@@ -16,6 +16,7 @@
     export let ratio: number
     export let date: string = undefined
     export let city: string = undefined
+    export let location: string
 </script>
 
 <div class="house grid">
@@ -25,7 +26,10 @@
         </h2>
         <p class="info text-info">
             {#if city}
-                <Icon class="icon" icon="map-pin" label="Map pin" /> {city} <span class="sep">·</span>
+                <a href="https://www.openstreetmap.org/search?query={title}, {city} {location}" target="_blank" rel="noopener noreferrer">
+                    <Icon class="icon" icon="map-pin" label="Map pin" /> {city}
+                </a>
+                <span class="sep">·</span>
             {/if}
             {#if date}
                 <time datetime={dayjs(date).format('YYYY-MM-DD')}>
diff --git a/src/routes/[country]/[location]/index.svelte b/src/routes/[country]/[location]/index.svelte
index 09c6545..6a9d58b 100644
--- a/src/routes/[country]/[location]/index.svelte
+++ b/src/routes/[country]/[location]/index.svelte
@@ -275,6 +275,7 @@
                     photoAlt={alt}
                     url="/{params.country}/{params.location}/{slug}"
                     {city}
+                    location={location.name}
                     ratio={width / height}
                     date={date_taken}
                     index={(totalPhotos - index < 10) ? '0' : ''}{totalPhotos - index}
diff --git a/src/style/molecules/_house.scss b/src/style/molecules/_house.scss
index ac621c7..f0b2b29 100644
--- a/src/style/molecules/_house.scss
+++ b/src/style/molecules/_house.scss
@@ -6,7 +6,7 @@
         grid-column-start: 3;
     }
 
-    a {
+    & > a {
         display: block;
         width: 100%;
         height: 100%;
@@ -57,6 +57,15 @@
             & > * {
                 display: inline-block;
             }
+            a {
+                text-decoration: none;
+                color: currentColor;
+
+                &:hover {
+                    color: $color-secondary;
+                    text-decoration: underline;
+                }
+            }
             :global(svg) {
                 width: 1em;
                 height: 1em;