mirror of
https://github.com/tabler/tabler.git
synced 2026-10-12 05:06:55 +04:00
43 lines
1.5 KiB
Plaintext
43 lines
1.5 KiB
Plaintext
---
|
|
import DefaultLayout from '@shared/layouts/DefaultLayout.astro'
|
|
import Dropzone from '@ui/Dropzone.astro'
|
|
import Card from '@ui/Card.astro'
|
|
import CardBody from '@ui/CardBody.astro'
|
|
import CardTitle from '@ui/CardTitle.astro'
|
|
import CardSubtitle from '@ui/CardSubtitle.astro'
|
|
import DocsLink from '@ui/DocsLink.astro'
|
|
---
|
|
|
|
<DefaultLayout title="Dropzone" pageMenu="plugins.dropzone" pageLibs={['dropzone']}>
|
|
<DocsLink slot="page-header-actions" path="/ui/plugins/dropzone" />
|
|
<div class="row row-cards">
|
|
<div class="col-md-6">
|
|
<Card>
|
|
<CardBody>
|
|
<CardTitle>Basic usage</CardTitle>
|
|
<CardSubtitle>Drag a file in or click to browse — a single drop target for one upload.</CardSubtitle>
|
|
<Dropzone id="default" />
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<Card>
|
|
<CardBody>
|
|
<CardTitle>Multiple file upload</CardTitle>
|
|
<CardSubtitle>Accept and preview several files at once from the same drop target.</CardSubtitle>
|
|
<Dropzone id="multiple" multiple={true} />
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<Card>
|
|
<CardBody>
|
|
<CardTitle>Custom dropzone</CardTitle>
|
|
<CardSubtitle>Swap in your own label and helper text for the drop target.</CardSubtitle>
|
|
<Dropzone id="custom" custom={true} text="Your text here" description="Your custom description here" />
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</DefaultLayout>
|