1
0
mirror of https://github.com/tabler/tabler.git synced 2025-12-21 17:34:25 +04:00

Merge remote-tracking branch 'origin/dev' into dev

This commit is contained in:
codecalm
2019-12-27 15:47:31 +01:00
4 changed files with 88 additions and 49 deletions

Binary file not shown.

View File

@@ -52,6 +52,9 @@ base:
cards:
url: cards.html
title: Cards
datatables:
url: datatables.html
title: Data Tables
calendar:
title: Calendar
url: calendar.html

View File

@@ -1,53 +1,84 @@
<div class="card">
<div class="card-header">
<h3 class="card-title">Invoices</h3>
</div>
<div class="table-responsive">
<table class="table card-table table-vcenter text-nowrap datatable overflow-hidden">
<thead>
<div class="card-header">
<h3 class="card-title">Invoices</h3>
</div>
<div class="card-body d-flex justify-content-between flex-nowrap table-responsive border-bottom text-nowrap overflow-hidden">
<div class="mb-0">
Show
<div class="mx-2 d-inline-block" style="width: 4rem;">
<input type="text" class="form-control" value="8">
</div>
entries
</div>
<div class="mb-0 ml-4">
Serach:
<div class="ml-2 d-inline-block" style="width: 10rem;">
<input type="text" class="form-control">
</div>
</div>
</div>
<div class="table-responsive">
<table class="table card-table table-vcenter text-nowrap datatable">
<thead>
<tr>
<th class="w-1p"><input class="form-check-input m-0 align-middle" type="checkbox"></th>
<th class="w-1p">No. {% include_cached ui/icon.html icon="chevron-up" class="icon-sm text-dark icon-thick" %}</th>
<th>Invoice Subject {% include_cached ui/icon.html icon="code" class="icon-sm" %}</th>
<th>Client {% include_cached ui/icon.html icon="code" class="icon-sm" %}</th>
<th>VAT No. {% include_cached ui/icon.html icon="code" class="icon-sm" %}</th>
<th>Created {% include_cached ui/icon.html icon="code" class="icon-sm" %}</th>
<th>Status {% include_cached ui/icon.html icon="code" class="icon-sm" %}</th>
<th>Price {% include_cached ui/icon.html icon="code" class="icon-sm" %}</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
{% for invoice in site.data.invoices limit: 8 %}
<tr>
<th class="w-1p"><input class="form-check-input m-0 align-middle" type="checkbox"></th>
<th class="w-1p">No.</th>
<th>Invoice Subject</th>
<th>Client</th>
<th>VAT No.</th>
<th>Created</th>
<th>Status</th>
<th>Price</th>
<th></th>
<td><input class="form-check-input m-0 align-middle" type="checkbox"></td>
<td><span class="text-muted">00{{ forloop.index | plus: 1400 }}</span></td>
<td><a href="invoice.html" class="text-reset">{{ invoice.name }}</a></td>
<td>
{% include ui/flag.html flag=invoice.country %}
{{ invoice.client }}
</td>
<td>
{{ invoice.vat-no }}
</td>
<td>
{{ invoice.date }}
</td>
<td>
<span class="status-icon bg-{{ invoice.status }}"></span> {{ invoice.status-name }}
</td>
<td>{{ invoice.price }}</td>
<td class="text-right">
<button class="btn btn-secondary btn-sm align-text-top">Manage</button>
<span class="dropdown ml-1">
<button class="btn btn-secondary btn-sm dropdown-toggle align-text-top" data-toggle="dropdown">Actions</button>
{% include ui/dropdown-menu.html %}
</span>
</td>
<td style="padding-right: 1rem;">
{% include_cached ui/icon.html icon="edit" class="icon-sm float-right" %}
</td>
</tr>
</thead>
<tbody>
{% for invoice in site.data.invoices limit: 5 %}
<tr>
<td><input class="form-check-input m-0 align-middle" type="checkbox"></td>
<td><span class="text-muted">00{{ forloop.index | plus: 1400 }}</span></td>
<td><a href="invoice.html" class="text-reset">{{ invoice.name }}</a></td>
<td>
{% include ui/flag.html flag=invoice.country %}
{{ invoice.client }}
</td>
<td>
{{ invoice.vat-no }}
</td>
<td>
{{ invoice.date }}
</td>
<td>
<span class="status-icon bg-{{ invoice.status }}"></span> {{ invoice.status-name }}
</td>
<td>{{ invoice.price }}</td>
<td class="text-right">
<span class="dropdown">
<button class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">Actions</button>
{% include_cached ui/dropdown-menu.html %}
</span>
</td>
</tr>
{% endfor %}
</tbody>
</table>
{% endfor %}
</tbody>
</table>
</div>
<div class="card-body d-flex justify-content-between flex-nowrap table-responsive border-bottom text-nowrap">
<div class="mb-0 d-flex align-items-center">
<p class="mb-0 align-middle">Showing <span>1</span> to <span>8</span> of <span>16</span> entries</p>
</div>
<div class="mb-0 ml-4">
<a href="#" class="btn btn-secondary disabled">Previous</a><a href="#" class="btn btn-primary ml-2">1</a><a href="#" class="btn btn-secondary ml-2">2</a><a href="#" class="btn btn-secondary ml-2 font-weight-bold text-secondary">Next</a>
</div>
</div>
</div>
</div>

5
pages/datatables.html Normal file
View File

@@ -0,0 +1,5 @@
---
title: Data Tables
---
{% include cards/invoices.html %}