1
0
mirror of https://github.com/tabler/tabler.git synced 2026-08-07 20:02:23 +04:00
Files
tabler/preview/pages/charts.astro
T
2026-07-28 00:09:02 +02:00

55 lines
1.3 KiB
Plaintext

---
// Port of preview/pages/charts.html (layout: default)
import DefaultLayout from '@shared/layouts/DefaultLayout.astro';
import Activity from '@shared/components/parts/charts/Activity.astro';
import SocialReferrals from '@shared/components/cards/charts/SocialReferrals.astro';
import Chart from '@shared/components/Chart.astro';
import chartsData from '@data/charts.json';
const demoCharts = Object.entries(
chartsData as Record<string, { demo?: boolean; name?: string }>,
).filter(([, chart]) => chart && chart.demo);
---
<DefaultLayout
title="Charts"
pageHeader="Charts"
pageMenu="plugins.charts"
pageLibs={['apexcharts']}
>
<div class="row row-cards">
<div class="col-lg-12">
<Activity />
</div>
<div class="col-12">
<SocialReferrals />
</div>
<div class="col-12">
<div class="card">
<div class="card-body">
<Chart chartId="tasks-overview" height={20} />
</div>
</div>
</div>
{
demoCharts.map(([chartId, chart]) => (
<div class="col-lg-6 col-xl-4">
<div class="card">
{chart.name && (
<div class="card-header">
<h3 class="card-title">{chart.name}</h3>
</div>
)}
<div class="card-body">
<Chart chartId={chartId} height={15} />
</div>
</div>
</div>
))
}
</div>
</DefaultLayout>