mirror of
https://github.com/tabler/tabler.git
synced 2026-08-29 13:21:29 +04:00
72 lines
2.2 KiB
Plaintext
72 lines
2.2 KiB
Plaintext
---
|
|
import DefaultLayout from '@shared/layouts/DefaultLayout.astro'
|
|
import Payment from '@ui/Payment.astro'
|
|
import Card from '@ui/Card.astro'
|
|
import CardHeader from '@ui/CardHeader.astro'
|
|
import CardBody from '@ui/CardBody.astro'
|
|
import payments from '@data/payments.json'
|
|
|
|
const providers = payments as { name: string; logo: string }[]
|
|
---
|
|
|
|
<DefaultLayout title="Payment Providers" pageHeader="Payment Providers" pageMenu="addons.payments">
|
|
<div class="row row-cards">
|
|
<div class="col-12">
|
|
<Card>
|
|
<CardHeader>
|
|
<h3 class="card-title">Light version</h3>
|
|
</CardHeader>
|
|
<CardBody>
|
|
<div class="row g-5 row-cols-5">
|
|
{
|
|
providers.map((provider) => (
|
|
<div class="col">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<Payment payment={provider.logo} />
|
|
</div>
|
|
<div class="col">
|
|
<strong class="d-block">{provider.name}</strong>
|
|
<div class="mt-1">
|
|
<code>{provider.logo}</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))
|
|
}
|
|
</div>
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
<div class="col-12">
|
|
<Card>
|
|
<CardHeader>
|
|
<h3 class="card-title">Dark version</h3>
|
|
</CardHeader>
|
|
<CardBody>
|
|
<div class="row g-5 row-cols-5">
|
|
{
|
|
providers.map((provider) => (
|
|
<div class="col">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<Payment payment={provider.logo} dark={true} />
|
|
</div>
|
|
<div class="col">
|
|
<strong class="d-block">{provider.name}</strong>
|
|
<div class="mt-1">
|
|
<code>{provider.logo}-dark</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))
|
|
}
|
|
</div>
|
|
</CardBody>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</DefaultLayout>
|