<script>
	import {
		heading,
		title,
		subtitle,
		content,
		date,
		time,
		weekday,
		address
	} from '$lib/stores/store';

	import { convertDate } from '$lib/convertDate';

	/** @type {string} */ let textDate = '';
	/** @type {boolean} */ let checked = true;

	$: if ($date !== '') {
		textDate = convertDate($date);
	}
</script>

<div class="text-container">
	<input type="checkbox" bind:checked />

	{#if checked}
		<div class="text" contenteditable="true">
			<p>Estimada/o amiga/o:</p>
			<p>El {$weekday.toLowerCase()}, {textDate}, celebramos el acto '{$title}'.</p>
			<p>Lo haremos en {$address.split('\n')[-1]}</p>
		</div>
	{/if}
</div>

<style>
	.text-container {
		margin: 1rem auto;
	}
	.text {
		margin: 1rem auto;
	}
	p {
		margin-bottom: 1rem;
	}
</style>
