mirror of
https://github.com/tabler/tabler.git
synced 2026-10-12 05:06:55 +04:00
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
36 lines
1.1 KiB
Plaintext
36 lines
1.1 KiB
Plaintext
---
|
|
import DefaultLayout from '@shared/layouts/DefaultLayout.astro'
|
|
import Card from '@ui/Card.astro'
|
|
import CardHeader from '@ui/CardHeader.astro'
|
|
import CardBody from '@ui/CardBody.astro'
|
|
import flags from '@data/flags.json'
|
|
import CardTitle from '@ui/CardTitle.astro'
|
|
import DocsLink from '@ui/DocsLink.astro'
|
|
|
|
// 21 filler divs for flexbox layout.
|
|
const fillers = Array.from({ length: 21 })
|
|
---
|
|
|
|
<DefaultLayout title="Flags" pageMenu="addons.flags">
|
|
<DocsLink slot="page-header-actions" path="/ui/plugins/flags" />
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>List of all flags</CardTitle>
|
|
</CardHeader>
|
|
<CardBody class="p-0">
|
|
<div class="demo-icons-list-wrap">
|
|
<div class="demo-icons-list">
|
|
{
|
|
flags.map((country) => (
|
|
<span class="demo-icons-list-item" title={country.name} data-bs-toggle="tooltip" data-bs-placement="top">
|
|
<span class={`flag flag-country-${country.flag.toLowerCase()}`} />
|
|
</span>
|
|
))
|
|
}
|
|
{fillers.map(() => <div />)}
|
|
</div>
|
|
</div>
|
|
</CardBody>
|
|
</Card>
|
|
</DefaultLayout>
|