You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
92 lines
2.9 KiB
HTML
92 lines
2.9 KiB
HTML
<div class="px-4 py-12 sm:px-6 lg:px-8">
|
|
<nav aria-label="Progress" class="flex justify-center">
|
|
<ol role="list" class="space-y-6">
|
|
<li>
|
|
<!-- Complete Step -->
|
|
<a href="#" class="group">
|
|
<span class="flex items-start">
|
|
<span
|
|
class="relative flex size-5 shrink-0 items-center justify-center"
|
|
>
|
|
<svg
|
|
viewBox="0 0 20 20"
|
|
fill="currentColor"
|
|
data-slot="icon"
|
|
aria-hidden="true"
|
|
class="size-full text-indigo-600 group-hover:text-indigo-800"
|
|
>
|
|
<path
|
|
d="M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z"
|
|
clip-rule="evenodd"
|
|
fill-rule="evenodd"
|
|
/>
|
|
</svg>
|
|
</span>
|
|
<span
|
|
class="ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900"
|
|
>Create account</span
|
|
>
|
|
</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<!-- Current Step -->
|
|
<a href="#" aria-current="step" class="flex items-start">
|
|
<span
|
|
aria-hidden="true"
|
|
class="relative flex size-5 shrink-0 items-center justify-center"
|
|
>
|
|
<span class="absolute size-4 rounded-full bg-indigo-200"></span>
|
|
<span
|
|
class="relative block size-2 rounded-full bg-indigo-600"
|
|
></span>
|
|
</span>
|
|
<span class="ml-3 text-sm font-medium text-indigo-600"
|
|
>Profile information</span
|
|
>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<!-- Upcoming Step -->
|
|
<a href="#" class="group">
|
|
<div class="flex items-start">
|
|
<div
|
|
aria-hidden="true"
|
|
class="relative flex size-5 shrink-0 items-center justify-center"
|
|
>
|
|
<div
|
|
class="size-2 rounded-full bg-gray-300 group-hover:bg-gray-400"
|
|
></div>
|
|
</div>
|
|
<p
|
|
class="ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900"
|
|
>
|
|
Theme
|
|
</p>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<!-- Upcoming Step -->
|
|
<a href="#" class="group">
|
|
<div class="flex items-start">
|
|
<div
|
|
aria-hidden="true"
|
|
class="relative flex size-5 shrink-0 items-center justify-center"
|
|
>
|
|
<div
|
|
class="size-2 rounded-full bg-gray-300 group-hover:bg-gray-400"
|
|
></div>
|
|
</div>
|
|
<p
|
|
class="ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900"
|
|
>
|
|
Preview
|
|
</p>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
</ol>
|
|
</nav>
|
|
</div>
|