Fix Location page photos overflow hiding its index

src/routes/[country]/[location]/index.svelte

@@ -167,7 +167,7 @@
                             </time>
                         </a>
                     </div>
-                    <div class="photo house__photo shadow-photo">
+                    <figure class="house__photo">
                         <a href="/{params.country}/{params.location}/{slug}">
                             <Image
                                 id={id}
@@ -179,12 +179,13 @@
                                 }}
                                 ratio={1.5}
                                 alt="{alt}"
+                                class="photo shadow-photo"
                             />
                             <span class="house__index title-index">
                                 {(totalPhotos - index < 10) ? '0' : ''}{totalPhotos - index}
                             </span>
                         </a>
-                    </div>
+                    </figure>
                 </div>
             {/each}
         </section>

src/style/atoms/_photo.scss

@@ -2,12 +2,16 @@
     overflow: hidden;
     background: $color-primary-tertiary20;
     border-radius: 6px;
+    cursor: zoom-in;
+
+    @include bp (md) {
+        border-radius: 8px;
+    }
 
     a {
         position: relative;
         display: block;
         height: 100%;
-        cursor: zoom-in;
 
         & > picture {
             height: 100%;

src/style/organisms/_house.scss

@@ -8,6 +8,7 @@
 
     a {
         text-decoration: none;
+        cursor: zoom-in;
     }
 
     // Information