/
githubmirror
/
tabler
Обзор
Документация
Войти
/
githubmirror
/
tabler
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
dev
shared/components/cards/SocialTraffic.astro
38 строк
1 KB
Bartosz-Do
Fix broken links, aria attributes, and demo data mismatches (#2831)
08 авг 2026, 01:02
Не верифицирован
08 авг 2026, 01:02
5c0a612
Код
Авторство
О чём код?
--- import { formatNumber } from '@shared/lib/string-format' import CardTitle from '@ui/CardTitle.astro' const services = 'Instagram:3550,Twitter:1798,Facebook:1245,TikTok:986,Pinterest:854,VK:650,LinkedIn:420'.split(',').map((service) => { const [name, visitors] = service.split(':') return { name, visitors: Number(visitors) } }) --- <div class="card"> <div class="card-header"> <CardTitle>Social Media Traffic</CardTitle> </div> <table class="table card-table table-vcenter"> <thead> <tr> <th>Network</th> <th colspan="2">Visitors</th> </tr> </thead> <tbody> { services.map((service) => ( <tr> <td>{service.name}</td> <td>{formatNumber(service.visitors)}</td> <td class="w-50"> <div class="progress progress-xs"> <div class="progress-bar bg-primary" style={`width: ${(service.visitors / 5000.0) * 100}%`} /> </div> </td> </tr> )) } </tbody> </table> </div>