42 lines
1.4 KiB
Svelte
42 lines
1.4 KiB
Svelte
<script lang="ts">
|
|
import Icon from "$lib/components/atoms/icon.svelte";
|
|
import Title from "$lib/components/atoms/title.svelte";
|
|
import MaxWidthWrapper from "$lib/components/molecules/max-width-wrapper.svelte";
|
|
import CheckIcon from "~icons/ic/round-check";
|
|
// Maybe todo? if the `uid` search param is present, do something?? figure out later
|
|
</script>
|
|
|
|
<div class="grid min-h-[80vh] w-full place-items-center px-4 sm:px-6">
|
|
<MaxWidthWrapper
|
|
cls="flex flex-col gap-6 sm:gap-8 items-center justify-center"
|
|
>
|
|
<div
|
|
class="flex w-full max-w-md flex-col items-center justify-center gap-6 rounded-xl bg-white p-4 drop-shadow-lg sm:gap-8 sm:p-6 md:p-8 md:py-12 lg:max-w-xl"
|
|
>
|
|
<div
|
|
class="rounded-full bg-emerald-100 p-1.5 text-emerald-600 drop-shadow-lg sm:p-2"
|
|
>
|
|
<Icon
|
|
icon={CheckIcon}
|
|
cls="w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12"
|
|
/>
|
|
</div>
|
|
|
|
<Title size="h3" center weight="medium">Booking confirmed</Title>
|
|
|
|
<p
|
|
class="w-full max-w-prose text-center text-sm text-gray-600 sm:text-base"
|
|
>
|
|
Thank you for booking your flight! Your order has been placed
|
|
successfully. You will receive a confirmation email shortly.
|
|
</p>
|
|
<p
|
|
class="w-full max-w-prose text-center text-sm text-gray-600 sm:text-base"
|
|
>
|
|
In it you will not only find the booking details, but also a
|
|
tracking number for your flight.
|
|
</p>
|
|
</div>
|
|
</MaxWidthWrapper>
|
|
</div>
|