<script setup lang="ts">
	import { ref, onMounted } from 'vue'
	import { useRouter } from 'vue-router'
	const router = useRouter()
	
	const onExit = () => {
		console.log('exit')
	}
</script>

<template>
	<div class="end">
		<div class="content">
			<div class="title">Thank you.</div>
			<div class="tip">
				We are starting to learn your preferences,
				<br />
				Looking forward to see you again,
			</div>
		</div>
	</div>
</template>

<style scoped lang="less">
	.header-title {
		--header-title-color: #000;
		--header-title-background: #fff;
	}
	.end {
		width: 100%;
		flex: 1;
		position: relative;
		color: #fff;
		background: url('@/assets/images/workshop/bg/end_bg.png') no-repeat center center;
		background-size: cover;
		> .content {
			position: absolute;
			top: 15.4rem;
			left: 9.6rem;
			display: flex;
			flex-direction: column;
			> .title {
				font-family: satoshiBold;
				font-size: 11rem;
				line-height: 124%;
			}
			> .tip {
				margin-top: 2.5rem;
				font-family: satoshiRegular;
				font-size: 4rem;
				line-height: 132%;
			}
		}
	}
</style>
