Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2026-07-25 20:44:38 +04:00
Code Issues Projects Releases Wiki Activity

Release 1.0.0-alpha.15

Browse Source
This commit is contained in:
codecalm
2020-11-29 15:32:43 +01:00
parent 5c97599ca0
commit d2e8d39ad1
466 changed files with 9376 additions and 2949 deletions
Download Patch File Download Diff File Expand all files Collapse all files
demo/widgets.html
+462 -125
View File
@@ -1,7 +1,7 @@
<!doctype html>
<!--
* Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
* @version 1.0.0-alpha.14
* @version 1.0.0-alpha.15
* @link https://tabler.io
* Copyright 2018-2020 The Tabler Authors
* Copyright 2018-2020 codecalm.net Paweł Kuna
@@ -20,9 +20,7 @@
<link href="./dist/css/tabler-vendors.min.css" rel="stylesheet"/>
<link href="./dist/css/demo.min.css" rel="stylesheet"/>
<style>
body {
display: none;
}
body { display: none; }
</style>
</head>
<body class="antialiased">
@@ -88,7 +86,7 @@
<span class="nav-link-icon d-md-none d-lg-inline-block"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><polyline points="12 3 20 7.5 20 16.5 12 21 4 16.5 4 7.5 12 3" /><line x1="12" y1="12" x2="20" y2="7.5" /><line x1="12" y1="12" x2="12" y2="21" /><line x1="12" y1="12" x2="4" y2="7.5" /><line x1="16" y1="5.25" x2="8" y2="9.75" /></svg>
</span>
<span class="nav-link-title">
User Interface
Interface
</span>
</a>
<div class="dropdown-menu">
@@ -121,6 +119,9 @@
<a class="dropdown-item" href="./maps.html" >
Maps
</a>
<a class="dropdown-item" href="./map-fullsize.html" >
Map fullsize
</a>
<a class="dropdown-item" href="./maps-vector.html" >
Vector maps
</a>
@@ -255,6 +256,9 @@
<a class="dropdown-item" href="./layout-vertical.html" >
Vertical
</a>
<a class="dropdown-item" href="./layout-vertical-transparent.html" >
Vertical transparent
</a>
<a class="dropdown-item" href="./layout-vertical-right.html" >
Right vertical
</a>
@@ -272,6 +276,9 @@
<a class="dropdown-item" href="./layout-navbar-dark.html" >
Navbar dark
</a>
<a class="dropdown-item" href="./layout-navbar-sticky.html" >
Navbar sticky
</a>
<a class="dropdown-item" href="./layout-navbar-overlap.html" >
Navbar overlap
</a>
@@ -658,112 +665,240 @@
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="bg-blue text-white avatar mr-3"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M16.7 8a3 3 0 0 0 -2.7 -2h-4a3 3 0 0 0 0 6h4a3 3 0 0 1 0 6h-4a3 3 0 0 1 -2.7 -2" /><path d="M12 3v3m0 12v3" /></svg>
</span>
<div class="mr-3">
<div class="font-weight-medium">
132 Sales
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-blue text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M16.7 8a3 3 0 0 0 -2.7 -2h-4a3 3 0 0 0 0 6h4a3 3 0 0 1 0 6h-4a3 3 0 0 1 -2.7 -2" /><path d="M12 3v3m0 12v3" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
132 Sales
</div>
<div class="text-muted">
12 waiting payments
</div>
</div>
<div class="text-muted">12 waiting payments</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="bg-green text-white avatar mr-3"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><circle cx="9" cy="19" r="2" /><circle cx="17" cy="19" r="2" /><path d="M3 3h2l2 12a3 3 0 0 0 3 2h7a3 3 0 0 0 3 -2l1 -7h-15.2" /></svg>
</span>
<div class="mr-3">
<div class="font-weight-medium">
78 Orders
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-green text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><circle cx="9" cy="19" r="2" /><circle cx="17" cy="19" r="2" /><path d="M3 3h2l2 12a3 3 0 0 0 3 2h7a3 3 0 0 0 3 -2l1 -7h-15.2" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
78 Orders
</div>
<div class="text-muted">
32 shipped
</div>
</div>
<div class="text-muted">32 shipped</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="bg-red text-white avatar mr-3"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><circle cx="12" cy="7" r="4" /><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" /></svg>
</span>
<div class="mr-3">
<div class="font-weight-medium">
1,352 Members
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-red text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><circle cx="12" cy="7" r="4" /><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
1352 Members
</div>
<div class="text-muted">
163 registered today
</div>
</div>
<div class="text-muted">163 registered today</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="bg-yellow text-white avatar mr-3"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 21v-13a3 3 0 0 1 3 -3h10a3 3 0 0 1 3 3v6a3 3 0 0 1 -3 3h-9l-4 4" /><line x1="8" y1="9" x2="16" y2="9" /><line x1="8" y1="13" x2="14" y2="13" /></svg>
</span>
<div class="mr-3">
<div class="font-weight-medium">
132 Comments
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-yellow text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 21v-13a3 3 0 0 1 3 -3h10a3 3 0 0 1 3 3v6a3 3 0 0 1 -3 3h-9l-4 4" /><line x1="8" y1="9" x2="16" y2="9" /><line x1="8" y1="13" x2="14" y2="13" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
132 Comments
</div>
<div class="text-muted">
16 waitings
</div>
</div>
<div class="text-muted">16 waitings</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<div class="mr-3">
</div>
<div class="mr-3">
<div class="font-weight-medium">
132 Sales
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<div class="chart-sparkline chart-sparkline-square" id="sparkline-sales"></div>
</div>
<div class="col">
<div class="font-weight-medium">
132 Sales
</div>
<div class="text-muted">
12 waiting payments
</div>
</div>
<div class="text-muted">12 waiting payments</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<div class="mr-3">
</div>
<div class="mr-3">
<div class="font-weight-medium">
78 Orders
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<div class="chart-sparkline chart-sparkline-square" id="sparkline-orders"></div>
</div>
<div class="col">
<div class="font-weight-medium">
78 Orders
</div>
<div class="text-muted">
32 shipped
</div>
</div>
<div class="text-muted">32 shipped</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<div class="mr-3">
</div>
<div class="mr-3">
<div class="font-weight-medium">
1,352 Members
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<div class="chart-sparkline chart-sparkline-square" id="sparkline-members"></div>
</div>
<div class="col">
<div class="font-weight-medium">
1352 Members
</div>
<div class="text-muted">
163 registered today
</div>
</div>
<div class="text-muted">163 registered today</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<div class="mr-3">
</div>
<div class="mr-3">
<div class="font-weight-medium">
132 Comments
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<div class="chart-sparkline chart-sparkline-square" id="sparkline-comments"></div>
</div>
<div class="col">
<div class="font-weight-medium">
132 Comments
</div>
<div class="text-muted">
16 waitings
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-green-lt text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><line x1="12" y1="5" x2="12" y2="19" /><line x1="18" y1="11" x2="12" y2="5" /><line x1="6" y1="11" x2="12" y2="5" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
$5,256.99
<span class="float-right font-weight-medium text-green">+4%</span>
</div>
<div class="text-muted">
Revenue last 30 days
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-red-lt text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><line x1="12" y1="5" x2="12" y2="19" /><line x1="18" y1="13" x2="12" y2="19" /><line x1="6" y1="13" x2="12" y2="19" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
342
<span class="float-right font-weight-medium text-red">-4.3%</span>
</div>
<div class="text-muted">
Sales last 30 days
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-green-lt text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><line x1="12" y1="5" x2="12" y2="19" /><line x1="18" y1="11" x2="12" y2="5" /><line x1="6" y1="11" x2="12" y2="5" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
132
<span class="float-right font-weight-medium text-green">+6.8%</span>
</div>
<div class="text-muted">
Customers last 30 days
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="card card-sm">
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-red-lt text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><line x1="12" y1="5" x2="12" y2="19" /><line x1="18" y1="13" x2="12" y2="19" /><line x1="6" y1="13" x2="12" y2="19" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
78
<span class="float-right font-weight-medium text-red">-2%</span>
</div>
<div class="text-muted">
Members registered today
</div>
</div>
<div class="text-muted">16 waitings</div>
</div>
</div>
</div>
@@ -772,118 +907,164 @@
<div class="row row-cards">
<div class="col-12">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<div class="mr-3">
<div class="font-weight-medium">
1,700
<div class="card-body">
<div class="row align-items-center">
<div class="col">
<div class="font-weight-medium">
1700
</div>
<div class="text-muted">
Users
</div>
</div>
<div class="col-auto">
</div>
<div class="text-muted">Users</div>
</div>
<div class="ml-auto">
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="bg-red text-white avatar mr-3"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572" /></svg>
</span>
<div class="mr-3">
<div class="font-weight-medium">
1,700
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-red text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M19.5 13.572l-7.5 7.428l-7.5 -7.428m0 0a5 5 0 1 1 7.5 -6.566a5 5 0 1 1 7.5 6.572" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
1700
</div>
<div class="text-muted">
Users
</div>
</div>
<div class="col-auto">
</div>
<div class="text-muted">Users</div>
</div>
<div class="ml-auto">
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="bg-green text-white avatar mr-3"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5" /></svg>
</span>
<div class="mr-3">
<div class="font-weight-medium">
1,700
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="bg-green text-white avatar"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5" /></svg>
</span>
</div>
<div class="col">
<div class="font-weight-medium">
1700
</div>
<div class="text-muted">
Users
</div>
</div>
<div class="col-auto">
</div>
<div class="text-muted">Users</div>
</div>
<div class="ml-auto">
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="avatar mr-3 rounded">HS</span>
<div class="mr-3">
<div class="font-weight-medium">
1,700
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="avatar">HS</span>
</div>
<div class="col">
<div class="font-weight-medium">
1700
</div>
<div class="text-muted">
Users
</div>
</div>
<div class="col-auto">
</div>
<div class="text-muted">Users</div>
</div>
<div class="ml-auto">
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="avatar mr-3 rounded" style="background-image: url(./static/avatars/006m.jpg)"></span>
<div class="mr-3">
<div class="font-weight-medium">
1,700
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="avatar" style="background-image: url(./static/avatars/006m.jpg)"></span>
</div>
<div class="col">
<div class="font-weight-medium">
1700
</div>
<div class="text-muted">
Users
</div>
</div>
<div class="col-auto">
</div>
<div class="text-muted">Users</div>
</div>
<div class="ml-auto">
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="avatar mr-3 rounded" style="background-image: url(./static/avatars/000m.jpg)"></span>
<div class="mr-3">
<div class="font-weight-medium">
1,700
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="avatar" style="background-image: url(./static/avatars/000m.jpg)"></span>
</div>
<div class="col">
<div class="font-weight-medium">
1700
</div>
<div class="text-muted">
Users
</div>
</div>
<div class="col-auto">
</div>
<div class="text-muted">Users</div>
</div>
<div class="ml-auto">
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="avatar mr-3 rounded" style="background-image: url(./static/avatars/003m.jpg)"></span>
<div class="mr-3">
<div class="font-weight-medium">
1,700
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="avatar" style="background-image: url(./static/avatars/003m.jpg)"></span>
</div>
<div class="col">
<div class="font-weight-medium">
1700
</div>
<div class="text-muted">
Users
</div>
</div>
<div class="text-muted">Users</div>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card card-sm">
<div class="card-body d-flex align-items-center">
<span class="avatar mr-3 rounded" style="background-image: url(./static/avatars/002m.jpg)"></span>
<div class="mr-3">
<div class="font-weight-medium">
1,700
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-sm ml-1 text-red" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><polyline points="3 7 9 13 13 9 21 17" /><polyline points="21 10 21 17 14 17" /></svg>
<div class="card-body">
<div class="row align-items-center">
<div class="col-auto">
<span class="avatar" style="background-image: url(./static/avatars/002m.jpg)"></span>
</div>
<div class="col">
<div class="font-weight-medium">
1700
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-sm ml-1 text-red" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><polyline points="3 7 9 13 13 9 21 17" /><polyline points="21 10 21 17 14 17" /></svg>
</div>
<div class="text-muted">
Users
</div>
</div>
<div class="text-muted">Users</div>
</div>
</div>
</div>
@@ -1097,7 +1278,7 @@
<ul class="list-inline list-inline-dots mb-0">
<li class="list-inline-item"><a href="./docs/index.html" class="link-secondary">Documentation</a></li>
<li class="list-inline-item"><a href="./license.html" class="link-secondary">License</a></li>
<li class="list-inline-item"><a href="https://github.com/tabler/tabler" target="_blank" class="link-secondary">Source code</a></li>
<li class="list-inline-item"><a href="https://github.com/tabler/tabler" target="_blank" class="link-secondary" rel="noopener">Source code</a></li>
</ul>
</div>
<div class="col-12 col-lg-auto mt-3 mt-lg-0">
@@ -1108,7 +1289,7 @@
All rights reserved.
</li>
<li class="list-inline-item">
<a href="./changelog.html" class="link-secondary" rel="noopener">v1.0.0-alpha.14</a>
<a href="./changelog.html" class="link-secondary" rel="noopener">v1.0.0-alpha.15</a>
</li>
</ul>
</div>
@@ -1123,6 +1304,162 @@
<script src="./dist/libs/apexcharts/dist/apexcharts.min.js"></script>
<!-- Tabler Core -->
<script src="./dist/js/tabler.min.js"></script>
<script>
// @formatter:off
document.addEventListener("DOMContentLoaded", function () {
window.ApexCharts && (new ApexCharts(document.getElementById('sparkline-sales'), {
chart: {
type: "radialBar",
fontFamily: 'inherit',
height: 40,
width: 40,
animations: {
enabled: false
},
sparkline: {
enabled: true
},
},
tooltip: {
enabled: false,
},
plotOptions: {
radialBar: {
hollow: {
margin: 0,
size: '75%'
},
track: {
margin: 0
},
dataLabels: {
show: false
}
}
},
colors: ["#206bc4"],
series: [56],
})).render();
});
// @formatter:on
</script>
<script>
// @formatter:off
document.addEventListener("DOMContentLoaded", function () {
window.ApexCharts && (new ApexCharts(document.getElementById('sparkline-orders'), {
chart: {
type: "radialBar",
fontFamily: 'inherit',
height: 40,
width: 40,
animations: {
enabled: false
},
sparkline: {
enabled: true
},
},
tooltip: {
enabled: false,
},
plotOptions: {
radialBar: {
hollow: {
margin: 0,
size: '75%'
},
track: {
margin: 0
},
dataLabels: {
show: false
}
}
},
colors: ["#5eba00"],
series: [56],
})).render();
});
// @formatter:on
</script>
<script>
// @formatter:off
document.addEventListener("DOMContentLoaded", function () {
window.ApexCharts && (new ApexCharts(document.getElementById('sparkline-members'), {
chart: {
type: "radialBar",
fontFamily: 'inherit',
height: 40,
width: 40,
animations: {
enabled: false
},
sparkline: {
enabled: true
},
},
tooltip: {
enabled: false,
},
plotOptions: {
radialBar: {
hollow: {
margin: 0,
size: '75%'
},
track: {
margin: 0
},
dataLabels: {
show: false
}
}
},
colors: ["#cd201f"],
series: [56],
})).render();
});
// @formatter:on
</script>
<script>
// @formatter:off
document.addEventListener("DOMContentLoaded", function () {
window.ApexCharts && (new ApexCharts(document.getElementById('sparkline-comments'), {
chart: {
type: "radialBar",
fontFamily: 'inherit',
height: 40,
width: 40,
animations: {
enabled: false
},
sparkline: {
enabled: true
},
},
tooltip: {
enabled: false,
},
plotOptions: {
radialBar: {
hollow: {
margin: 0,
size: '75%'
},
track: {
margin: 0
},
dataLabels: {
show: false
}
}
},
colors: ["#fab005"],
series: [56],
})).render();
});
// @formatter:on
</script>
<script>
document.body.style.display = "block"
</script>