chore: merge components and stylesheets in same directory name

apps/website/src/components/molecules/PhotoCard/PhotoCard.svelte

@@ -0,0 +1,70 @@
+<style lang="scss">
+    @import "./PhotoCard";
+</style>
+
+<script lang="ts">
+    import { createEventDispatcher } from 'svelte'
+    import Image from '$components/atoms/Image.svelte'
+
+    export let id: string
+    export let alt: string
+    export let url: string = undefined
+    export let title: string = undefined
+    export let location: any = undefined
+    export let city: string = undefined
+    export let hovered = false
+    export let lazy = true
+
+    const dispatch = createEventDispatcher()
+    const sizes = {
+        small: { width: 224 },
+        medium: { width: 464 },
+        large: { width: 864 },
+    }
+
+    const sendHover = (hover: boolean) => dispatch('hover', hover)
+</script>
+
+<div class="photo-card"
+    class:is-hovered={hovered}
+    on:mouseenter={() => sendHover(true)}
+    on:focus={() => sendHover(true)}
+    on:mouseout={() => sendHover(false)}
+    on:blur={() => sendHover(false)}
+>
+    {#if url}
+        <div class="photo-card__content">
+            <a href={url} data-sveltekit-noscroll>
+                <Image
+                    {id}
+                    sizeKey="postcard"
+                    {sizes}
+                    ratio={1.5}
+                    {alt}
+                    {lazy}
+                />
+                {#if title && location}
+                    <div class="photo-card__info">
+                        <Image
+                            id={location.country.flag.id}
+                            sizeKey="square-small"
+                            width={24}
+                            height={24}
+                            alt="Flag of {location.country.name}"
+                        />
+                        <p>{title} - {city ? `${city}, ` : ''}{location.name}, {location.country.name}</p>
+                    </div>
+                {/if}
+            </a>
+        </div>
+    {:else}
+        <Image
+            {id}
+            sizeKey="postcard"
+            {sizes}
+            ratio={1.5}
+            {alt}
+            {lazy}
+        />
+    {/if}
+</div>