mirror of
https://github.com/tabler/tabler.git
synced 2026-08-07 20:02:23 +04:00
d8956a06d6
Co-authored-by: Bartek <xbartoszdobija@gmail.com>
36 lines
963 B
Plaintext
36 lines
963 B
Plaintext
---
|
|
// Port of preview/pages/flags.html (layout: default)
|
|
import DefaultLayout from '@shared/layouts/DefaultLayout.astro';
|
|
import flags from '@data/flags.json';
|
|
|
|
// Liquid: {% for icon in (0..20) %}<div></div>{% endfor %} — 21 filler divs
|
|
const fillers = Array.from({ length: 21 });
|
|
---
|
|
|
|
<DefaultLayout title="Flags" pageHeader="Flags" pageMenu="addons.flags">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<div class="card-title">List of all flags</div>
|
|
</div>
|
|
<div class="card-body 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>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</DefaultLayout>
|