mirror of
https://github.com/tabler/tabler.git
synced 2026-08-29 13:21:29 +04:00
Paweł KunaandStarDev
8962710163
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
79 lines
3.7 KiB
Plaintext
79 lines
3.7 KiB
Plaintext
---
|
|
import DefaultLayout from '@shared/layouts/DefaultLayout.astro'
|
|
import Alert from '@ui/Alert.astro'
|
|
import Card from '@ui/Card.astro'
|
|
import CardBody from '@ui/CardBody.astro'
|
|
import CardTitle from '@ui/CardTitle.astro'
|
|
---
|
|
|
|
<DefaultLayout title="Alerts" pageHeader="Alerts" pageMenu="base.alerts">
|
|
<div class="row row-cards">
|
|
<div class="col-lg-6">
|
|
<Card>
|
|
<CardBody>
|
|
<CardTitle as="h2">Basic alerts</CardTitle>
|
|
<Alert type="danger" title="An error occurred!" />
|
|
<Alert type="warning" title="Some information is missing!" />
|
|
<Alert type="success" title="Completed successfully!" />
|
|
<Alert type="info" title="Just a quick note!" />
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<Card>
|
|
<CardBody>
|
|
<CardTitle as="h2">Alerts with action</CardTitle>
|
|
<Alert showClose action="Link" type="danger" title="An error occurred!" />
|
|
<Alert showClose action="Link" type="warning" title="Some information is missing!" />
|
|
<Alert showClose action="Link" type="success" title="Completed successfully!" />
|
|
<Alert showClose action="Link" type="info" title="Just a quick note!" />
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<Card>
|
|
<CardBody>
|
|
<CardTitle as="h2">Dismissible alerts</CardTitle>
|
|
<Alert showClose type="danger" title="An error occurred!" />
|
|
<Alert showClose type="warning" title="Some information is missing!" />
|
|
<Alert showClose type="success" title="Completed successfully!" />
|
|
<Alert showClose type="info" title="Just a quick note!" />
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<Card>
|
|
<CardBody>
|
|
<CardTitle as="h2">Alert with a description</CardTitle>
|
|
<Alert showClose type="danger" title="Password does not meet requirements:" list={['Minimum 8 characters', 'Include a special character']} />
|
|
<Alert showClose type="warning" title="Some information is missing!" description="This is a custom alert box with a description." />
|
|
<Alert showClose type="success" title="Completed successfully!" description="This is a custom alert box with a description." />
|
|
<Alert showClose type="info" title="Just a quick note!" description="This is a custom alert box with a description." />
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<Card>
|
|
<CardBody>
|
|
<CardTitle as="h2">Important alerts</CardTitle>
|
|
<Alert showClose important type="danger" title="Password does not meet requirements:" list={['Minimum 8 characters', 'Include a special character']} />
|
|
<Alert showClose important type="success" description="This is a custom alert box with a description." />
|
|
<Alert showClose important type="warning" description="This is a custom alert box with a description." />
|
|
<Alert showClose important type="info" description="This is a custom alert box with a description." />
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<Card>
|
|
<CardBody>
|
|
<CardTitle as="h2">Minor alerts</CardTitle>
|
|
<Alert showClose minor type="danger" title="Password does not meet requirements:" list={['Minimum 8 characters', 'Include a special character']} />
|
|
<Alert showClose minor type="success" description="This is a custom alert box with a description." />
|
|
<Alert showClose minor type="warning" description="This is a custom alert box with a description." />
|
|
<Alert showClose minor type="info" description="This is a custom alert box with a description." />
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</DefaultLayout>
|