Mainification: Bring Onboarding in from rh-test (#6564)

## Summary

Migrate the onboarding / login / sign-up / survey pieces from `rh-test`
to `main`.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6564-WIP-Bring-Onboarding-in-from-rh-test-2a16d73d365081318483f993e3ca0f89)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Jin Yi <jin12cc@gmail.com>
Co-authored-by: GitHub Action <action@github.com>
This commit is contained in:
Alexander Brown
2025-11-04 16:48:58 -08:00
committed by GitHub
parent 47688fe363
commit 693fbbd3e4
30 changed files with 2295 additions and 37 deletions

View File

@@ -0,0 +1,47 @@
<template>
<div class="flex h-full items-center justify-center p-8">
<div class="max-w-[100vw] lg:w-96">
<div class="rounded-lg bg-[#2d2e32] p-4">
<Skeleton width="60%" height="1.125rem" class="mb-2" />
<Skeleton width="90%" height="1rem" class="mb-2" />
<Skeleton width="80%" height="1rem" />
</div>
<div class="mt-6 mb-8 flex flex-col gap-4">
<Skeleton width="45%" height="1.5rem" class="my-0" />
<div class="flex items-center">
<Skeleton width="25%" height="1rem" class="mr-1" />
<Skeleton width="20%" height="1rem" />
</div>
</div>
<div class="mb-8">
<Skeleton width="20%" height="1rem" class="mb-2" />
<Skeleton width="100%" height="2.5rem" class="mb-4" />
<Skeleton width="25%" height="1rem" class="mb-4" />
<Skeleton width="100%" height="2.5rem" class="mb-6" />
<Skeleton width="80%" height="1rem" class="mb-4" />
<Skeleton width="100%" height="2.5rem" />
</div>
<div class="my-8 flex items-center">
<div class="flex-1 border-t border-gray-300"></div>
<Skeleton width="30%" height="1rem" class="mx-4" />
<div class="flex-1 border-t border-gray-300"></div>
</div>
<div class="flex flex-col gap-6">
<Skeleton width="100%" height="2.5rem" />
<Skeleton width="100%" height="2.5rem" />
</div>
<div class="mt-5">
<Skeleton width="70%" height="0.875rem" />
</div>
</div>
</div>
</template>
<script setup lang="ts">
import Skeleton from 'primevue/skeleton'
</script>

View File

@@ -0,0 +1,30 @@
<template>
<div>
<div class="flex min-h-[638px] min-w-[320px] flex-col">
<Skeleton width="100%" height="0.5rem" class="mb-8" />
<div class="flex flex-1 flex-col p-0">
<div class="flex min-h-full flex-1 flex-col justify-between">
<div>
<Skeleton width="70%" height="1.75rem" class="mb-8" />
<div class="flex flex-col gap-6">
<div v-for="i in 5" :key="i" class="flex items-center gap-3">
<Skeleton width="1.25rem" height="1.25rem" shape="circle" />
<Skeleton width="85%" height="0.875rem" />
</div>
</div>
</div>
<div class="flex justify-between pt-4">
<span />
<Skeleton width="100%" height="2.5rem" />
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import Skeleton from 'primevue/skeleton'
</script>