chore: merge components and stylesheets in same directory name

This commit is contained in:
2024-07-24 10:59:34 +02:00
parent a9d937a2b5
commit cb7d83978d
92 changed files with 533 additions and 531 deletions

View File

@@ -0,0 +1,49 @@
<style lang="scss">
@import "./PostCard";
</style>
<script lang="ts">
import { cx } from 'classix'
import Image from '$components/atoms/Image.svelte'
export let street: string
export let location: string
export let region: string = undefined
export let country: string
export let flagId: string
export let size: string = undefined
const className = 'postcard'
$: classes = cx(
className,
...[size].map(variant => variant && `${className}--${variant}`),
$$props.class
)
</script>
<div class={classes}>
<div class="postcard__left">
<p class="postcard__country">
<span>Houses of</span><br>
<strong class="title-country__purple">{country}</strong>
</p>
</div>
<div class="postcard__right">
<div class="postcard__stamp">
<div class="frame">
<img src="/images/icons/stamp.svg" width="32" height="42" alt="Stamp">
</div>
<Image
class="flag"
id={flagId}
sizeKey="square-small"
width={32} height={32}
alt="Flag of {country}"
/>
</div>
<ul class="postcard__address">
<li>{street}</li>
<li>{location}{region ? `, ${region}` : ''}</li>
</ul>
</div>
</div>