<script lang="ts">
	import LocationBoardCard from '$lib/components/ui/cards/LocationBoardCard.svelte';
	import HeadcodeSearchCard from '$lib/components/ui/cards/HeadcodeSearchCard.svelte';
	import NearbyStationsCard from '$lib/components/ui/cards/NearbyStationsCard.svelte';
	import QuickLinksCard from '$lib/components/ui/cards/QuickLinksCard.svelte';
</script>

<div class="card-container">
	<LocationBoardCard />
	<HeadcodeSearchCard />
	<NearbyStationsCard />
	<QuickLinksCard />
</div>

<style>
	.card-container {
		display: flex;
		align-items: center;
		flex-direction: column;
		gap: 20px;
		justify-content: center;
		padding: 20px 10px;
	}
</style>
