<script lang="ts">
	import Separator from './ui/separator/separator.svelte';
	import Socials from './Socials.svelte';
	import getUnicodeFlagIcon from 'country-flag-icons/unicode';
</script>

<footer class="h-24 px-2 mb-10 text-sm md:text-md xl:text-lg">
	<Separator class="mb-4" />
	<div class="flex justify-center flex-col gap-4">
		<Socials center />
		<p class="text-muted-foreground text-center">
			&copy 2024 Youwen Wu | Built with <a
				href="https://kit.svelte.dev"
				target="_blank"
				class="hover:underline"><strong>SvelteKit</strong></a
			>
			and
			<a href="https://www.shadcn-svelte.com/" class="hover:underline" target="_blank"
				><strong>shadcn-svelte</strong></a
			>
			|
			<a href="https://github.com/couscousdude/coredump" target="_blank" class="hover:underline"
				>View the source</a
			>
			| Long Live Palestine <span class="font-normal">{getUnicodeFlagIcon('PS')}</span>
		</p>
	</div>
</footer>
