mirror of
https://github.com/tabler/tabler.git
synced 2026-08-29 13:21:29 +04:00
57 lines
2.0 KiB
Plaintext
57 lines
2.0 KiB
Plaintext
---
|
|
import SingleLayout from '@shared/layouts/SingleLayout.astro'
|
|
import Button from '@ui/Button.astro'
|
|
import ButtonList from '@ui/ButtonList.astro'
|
|
import FormGroup from '@ui/FormGroup.astro'
|
|
import HrText from '@ui/HrText.astro'
|
|
import InputGroup from '@ui/InputGroup.astro'
|
|
import Illustration from '@ui/Illustration.astro'
|
|
import Progress from '@ui/Progress.astro'
|
|
import { site } from '@shared/lib/site'
|
|
import timezones from '@data/timezones.json'
|
|
|
|
// TODO: page-menu (extra.wizard) is unused — SingleLayout has no navbar menu.
|
|
---
|
|
|
|
<SingleLayout title="Wizard">
|
|
<div class="card card-md">
|
|
<div class="card-body text-center py-4 p-sm-5">
|
|
<Illustration image="boy-girl.svg" height={200} class="mb-n2" />
|
|
<h1 class="mt-5">Welcome to Tabler!</h1>
|
|
<p class="text-secondary">{site.description}</p>
|
|
</div>
|
|
|
|
<HrText text="your data" position="center" class="hr-text-spaceless" />
|
|
|
|
<div class="card-body">
|
|
<FormGroup label="Create your Tabler URL" for="wizard-url" hint="Choose a URL that describes you or your business in a concise way. Make it short and easy to remember so you can share links with ease.">
|
|
<InputGroup id="wizard-url" prepend="https://tabler.io/" inputClass="ps-1" flat />
|
|
</FormGroup>
|
|
|
|
<FormGroup label="Timezone" for="wizard-timezone" class="">
|
|
<select class="form-select mb-0" id="wizard-timezone">
|
|
{
|
|
timezones.map((timezone) => (
|
|
<option value={timezone.abbr} selected={timezone.abbr === 'CEDT'}>
|
|
{timezone.text}
|
|
</option>
|
|
))
|
|
}
|
|
</select>
|
|
</FormGroup>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row align-items-center mt-3">
|
|
<div class="col-4">
|
|
<Progress value={25} />
|
|
</div>
|
|
<div class="col">
|
|
<ButtonList class="justify-content-end">
|
|
<Button text="Set up later" color="link link-secondary" />
|
|
<Button text="Continue" color="primary" />
|
|
</ButtonList>
|
|
</div>
|
|
</div>
|
|
</SingleLayout>
|