mirror of
https://github.com/tabler/tabler.git
synced 2026-08-02 08:25:32 +04:00
Merge branch 'dev' into dev-daterangepicker
This commit is contained in:
Paweł Kuna
GitHub
@@ -72,6 +72,16 @@ charts:
|
||||
title: Charts
|
||||
icon: pie-chart
|
||||
|
||||
a:
|
||||
title: A
|
||||
icon: menu
|
||||
children:
|
||||
b:
|
||||
title: B
|
||||
children:
|
||||
c:
|
||||
title: C
|
||||
url: tmp.html
|
||||
|
||||
layouts:
|
||||
title: Layouts
|
||||
|
||||
@@ -0,0 +1,216 @@
|
||||
- name: "2checkout Dark"
|
||||
payment: "2checkout-dark"
|
||||
- name: "2checkout"
|
||||
payment: "2checkout"
|
||||
- name: "Alipay Dark"
|
||||
payment: "alipay-dark"
|
||||
- name: "Alipay"
|
||||
payment: "alipay"
|
||||
- name: "Amazon Dark"
|
||||
payment: "amazon-dark"
|
||||
- name: "Amazon"
|
||||
payment: "amazon"
|
||||
- name: "Americanexpress Dark"
|
||||
payment: "americanexpress-dark"
|
||||
- name: "Americanexpress"
|
||||
payment: "americanexpress"
|
||||
- name: "Applepay Dark"
|
||||
payment: "applepay-dark"
|
||||
- name: "Applepay"
|
||||
payment: "applepay"
|
||||
- name: "Bancontact Dark"
|
||||
payment: "bancontact-dark"
|
||||
- name: "Bancontact"
|
||||
payment: "bancontact"
|
||||
- name: "Bitcoin Dark"
|
||||
payment: "bitcoin-dark"
|
||||
- name: "Bitcoin"
|
||||
payment: "bitcoin"
|
||||
- name: "Bitpay Dark"
|
||||
payment: "bitpay-dark"
|
||||
- name: "Bitpay"
|
||||
payment: "bitpay"
|
||||
- name: "Cirrus Dark"
|
||||
payment: "cirrus-dark"
|
||||
- name: "Cirrus"
|
||||
payment: "cirrus"
|
||||
- name: "Clickandbuy Dark"
|
||||
payment: "clickandbuy-dark"
|
||||
- name: "Clickandbuy"
|
||||
payment: "clickandbuy"
|
||||
- name: "Coinkite Dark"
|
||||
payment: "coinkite-dark"
|
||||
- name: "Coinkite"
|
||||
payment: "coinkite"
|
||||
- name: "Dinersclub Dark"
|
||||
payment: "dinersclub-dark"
|
||||
- name: "Dinersclub"
|
||||
payment: "dinersclub"
|
||||
- name: "Directdebit Dark"
|
||||
payment: "directdebit-dark"
|
||||
- name: "Directdebit"
|
||||
payment: "directdebit"
|
||||
- name: "Discover Dark"
|
||||
payment: "discover-dark"
|
||||
- name: "Discover"
|
||||
payment: "discover"
|
||||
- name: "Dwolla Dark"
|
||||
payment: "dwolla-dark"
|
||||
- name: "Dwolla"
|
||||
payment: "dwolla"
|
||||
- name: "Ebay Dark"
|
||||
payment: "ebay-dark"
|
||||
- name: "Ebay"
|
||||
payment: "ebay"
|
||||
- name: "Eway Dark"
|
||||
payment: "eway-dark"
|
||||
- name: "Eway"
|
||||
payment: "eway"
|
||||
- name: "Giropay Dark"
|
||||
payment: "giropay-dark"
|
||||
- name: "Giropay"
|
||||
payment: "giropay"
|
||||
- name: "Googlewallet Dark"
|
||||
payment: "googlewallet-dark"
|
||||
- name: "Googlewallet"
|
||||
payment: "googlewallet"
|
||||
- name: "Ingenico Dark"
|
||||
payment: "ingenico-dark"
|
||||
- name: "Ingenico"
|
||||
payment: "ingenico"
|
||||
- name: "Jcb Dark"
|
||||
payment: "jcb-dark"
|
||||
- name: "Jcb"
|
||||
payment: "jcb"
|
||||
- name: "Klarna Dark"
|
||||
payment: "klarna-dark"
|
||||
- name: "Klarna"
|
||||
payment: "klarna"
|
||||
- name: "Laser Dark"
|
||||
payment: "laser-dark"
|
||||
- name: "Laser"
|
||||
payment: "laser"
|
||||
- name: "Maestro Dark"
|
||||
payment: "maestro-dark"
|
||||
- name: "Maestro"
|
||||
payment: "maestro"
|
||||
- name: "Mastercard Dark"
|
||||
payment: "mastercard-dark"
|
||||
- name: "Mastercard"
|
||||
payment: "mastercard"
|
||||
- name: "Monero Dark"
|
||||
payment: "monero-dark"
|
||||
- name: "Monero"
|
||||
payment: "monero"
|
||||
- name: "Neteller Dark"
|
||||
payment: "neteller-dark"
|
||||
- name: "Neteller"
|
||||
payment: "neteller"
|
||||
- name: "Ogone Dark"
|
||||
payment: "ogone-dark"
|
||||
- name: "Ogone"
|
||||
payment: "ogone"
|
||||
- name: "Okpay Dark"
|
||||
payment: "okpay-dark"
|
||||
- name: "Okpay"
|
||||
payment: "okpay"
|
||||
- name: "Paybox Dark"
|
||||
payment: "paybox-dark"
|
||||
- name: "Paybox"
|
||||
payment: "paybox"
|
||||
- name: "Paymill Dark"
|
||||
payment: "paymill-dark"
|
||||
- name: "Paymill"
|
||||
payment: "paymill"
|
||||
- name: "Payone Dark"
|
||||
payment: "payone-dark"
|
||||
- name: "Payone"
|
||||
payment: "payone"
|
||||
- name: "Payoneer Dark"
|
||||
payment: "payoneer-dark"
|
||||
- name: "Payoneer"
|
||||
payment: "payoneer"
|
||||
- name: "Paypal Dark"
|
||||
payment: "paypal-dark"
|
||||
- name: "Paypal"
|
||||
payment: "paypal"
|
||||
- name: "Paysafecard Dark"
|
||||
payment: "paysafecard-dark"
|
||||
- name: "Paysafecard"
|
||||
payment: "paysafecard"
|
||||
- name: "Payu Dark"
|
||||
payment: "payu-dark"
|
||||
- name: "Payu"
|
||||
payment: "payu"
|
||||
- name: "Payza Dark"
|
||||
payment: "payza-dark"
|
||||
- name: "Payza"
|
||||
payment: "payza"
|
||||
- name: "Ripple Dark"
|
||||
payment: "ripple-dark"
|
||||
- name: "Ripple"
|
||||
payment: "ripple"
|
||||
- name: "Sage Dark"
|
||||
payment: "sage-dark"
|
||||
- name: "Sage"
|
||||
payment: "sage"
|
||||
- name: "Sepa Dark"
|
||||
payment: "sepa-dark"
|
||||
- name: "Sepa"
|
||||
payment: "sepa"
|
||||
- name: "Shopify Dark"
|
||||
payment: "shopify-dark"
|
||||
- name: "Shopify"
|
||||
payment: "shopify"
|
||||
- name: "Skrill Dark"
|
||||
payment: "skrill-dark"
|
||||
- name: "Skrill"
|
||||
payment: "skrill"
|
||||
- name: "Solo Dark"
|
||||
payment: "solo-dark"
|
||||
- name: "Solo"
|
||||
payment: "solo"
|
||||
- name: "Square Dark"
|
||||
payment: "square-dark"
|
||||
- name: "Square"
|
||||
payment: "square"
|
||||
- name: "Stripe Dark"
|
||||
payment: "stripe-dark"
|
||||
- name: "Stripe"
|
||||
payment: "stripe"
|
||||
- name: "Switch Dark"
|
||||
payment: "switch-dark"
|
||||
- name: "Switch"
|
||||
payment: "switch"
|
||||
- name: "Ukash Dark"
|
||||
payment: "ukash-dark"
|
||||
- name: "Ukash"
|
||||
payment: "ukash"
|
||||
- name: "Unionpay Dark"
|
||||
payment: "unionpay-dark"
|
||||
- name: "Unionpay"
|
||||
payment: "unionpay"
|
||||
- name: "Verifone Dark"
|
||||
payment: "verifone-dark"
|
||||
- name: "Verifone"
|
||||
payment: "verifone"
|
||||
- name: "Verisign Dark"
|
||||
payment: "verisign-dark"
|
||||
- name: "Verisign"
|
||||
payment: "verisign"
|
||||
- name: "Visa Dark"
|
||||
payment: "visa-dark"
|
||||
- name: "Visa"
|
||||
payment: "visa"
|
||||
- name: "Webmoney Dark"
|
||||
payment: "webmoney-dark"
|
||||
- name: "Webmoney"
|
||||
payment: "webmoney"
|
||||
- name: "Westernunion Dark"
|
||||
payment: "westernunion-dark"
|
||||
- name: "Westernunion"
|
||||
payment: "westernunion"
|
||||
- name: "Worldpay Dark"
|
||||
payment: "worldpay-dark"
|
||||
- name: "Worldpay"
|
||||
payment: "worldpay"
|
||||
@@ -10,8 +10,4 @@ done: true
|
||||
{% example html %}
|
||||
<label class="form-label">Autosize example</label>
|
||||
{% include ui/form/textarea-autosize.html %}
|
||||
{% include ui/form/textarea-autosize.html %}
|
||||
{% include ui/form/textarea-autosize.html %}
|
||||
{% include ui/form/textarea-autosize.html %}
|
||||
{% include ui/form/textarea-autosize.html %}
|
||||
{% endexample %}
|
||||
|
||||
@@ -0,0 +1,36 @@
|
||||
---
|
||||
title: Payments
|
||||
menu: docs.payments
|
||||
plugin: payments
|
||||
---
|
||||
|
||||
### Payment
|
||||
|
||||
{% example %}
|
||||
{% include ui/payment.html payment="shopify"%}
|
||||
{% include ui/payment.html%}
|
||||
{% include ui/payment.html payment="paypal"%}
|
||||
{% endexample %}
|
||||
|
||||
### Payment sizes
|
||||
|
||||
Using Bootstrap’s typical naming structure, you can create a standard payment, or scale it up to different sizes based on what’s needed.
|
||||
|
||||
{% example %}
|
||||
{% include ui/payment.html payment="shopify" size="xl"%}
|
||||
{% include ui/payment.html size="lg"%}
|
||||
{% include ui/payment.html payment="paypal" size="md"%}
|
||||
{% include ui/payment.html payment="amazon"%}
|
||||
{% endexample %}
|
||||
|
||||
### Types
|
||||
|
||||
<table>
|
||||
{% for payment in site.data.payments %}
|
||||
<tr>
|
||||
<td>{% include ui/payment.html payment=payment.payment %}</td>
|
||||
<td><code>{{ payment.payment }}</code></td>
|
||||
<td>{{ payment.name }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
@@ -0,0 +1,76 @@
|
||||
<div class="card">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover table-outline table-vcenter text-nowrap card-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="2">User</th>
|
||||
<th>Usage</th>
|
||||
<th class="text-center">Payment</th>
|
||||
<th>Activity</th>
|
||||
<th class="text-center">Satisfaction</th>
|
||||
<th class="text-center"><i class="icon-settings"></i></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
{% for person in site.data.people limit: 8 offset: 50 %}
|
||||
{% assign percentage = forloop.index | random_number %}
|
||||
{% assign time_offset = forloop.index | random_number: 0, 800 %}
|
||||
{% assign register_offset = forloop.index | random_number: 0, 8000000 %}
|
||||
{% assign percentage_color = percentage | number_color %}
|
||||
|
||||
<tr>
|
||||
<td class="text-center w-1p">
|
||||
{% include ui/avatar.html person-id=person.id %}
|
||||
</td>
|
||||
<td>
|
||||
<div>{{ person.full_name }}</div>
|
||||
<div class="small text-muted">
|
||||
Registered: {{ site.time | date: "%s" | minus: register_offset | date: '%b %-d, %Y' }}
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="clearfix">
|
||||
<div class="float-left">
|
||||
<strong>{{ percentage }}%</strong>
|
||||
</div>
|
||||
<div class="float-right">
|
||||
<small class="text-muted">Jun 11, 2015 - Jul 10, 2015</small>
|
||||
</div>
|
||||
</div>
|
||||
{% include ui/progress.html value=percentage size="sm" color=percentage_color %}
|
||||
|
||||
</td>
|
||||
<td class="text-center">
|
||||
{% capture payment %}
|
||||
{%- cycle 'visa', 'googlewallet', 'mastercard', 'shopify', 'ebay', 'paypal' -%}
|
||||
{% endcapture %}
|
||||
{% include ui/payment.html payment=payment %}
|
||||
</td>
|
||||
<td>
|
||||
<div class="small text-muted">Last login</div>
|
||||
<div>{{ site.time | date: "%s" | minus: time_offset | to_pretty_time }}</div>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
{% assign percentage = forloop.index | random_number: 0, 100 %}
|
||||
<!-- <div class="mx-auto" data-value="{{ circle-percentage | divide: 100 }}"-->
|
||||
<!-- data-thickness="3" data-color="blue">-->
|
||||
<!-- <div class="chart-circle-value">{{ percentage }}%</div>-->
|
||||
<!-- </div>-->
|
||||
{% include ui/sparkline.html percentage=percentage type="pie" %}
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="dropdown">
|
||||
<a class="btn-icon mx-2" data-toggle="dropdown">
|
||||
{% include_cached ui/icon.html icon="more-vertical" %}
|
||||
</a>
|
||||
{% include ui/dropdown-menu.html %}
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -12,3 +12,4 @@
|
||||
|
||||
<!-- Tabler Plugins -->
|
||||
<link href="{{ site.base }}/{% if jekyll.environment == 'development' %}tmp-{% endif %}dist/css/tabler-flags{% if jekyll.environment == 'production' %}.min{% endif %}.css?{{ site.time | date: '%s' }}" rel="stylesheet"/>
|
||||
<link href="{{ site.base }}/{% if jekyll.environment == 'development' %}tmp-{% endif %}dist/css/tabler-payments{% if jekyll.environment == 'production' %}.min{% endif %}.css?{{ site.time | date: '%s' }}" rel="stylesheet" />
|
||||
|
||||
@@ -63,16 +63,12 @@
|
||||
<div class="col-sm-6 col-xl-3">
|
||||
{% include cards/small-stats.html color="yellow" chart-type="pie" chart-data="22/100" color="yellow" count="132" subtitle="Comments" description="16 waiting" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row row-deck">
|
||||
{% for article in site.data.articles limit: 3 offset: 4 %}
|
||||
<div class="col-lg">
|
||||
{% include cards/blog-single.html article=article type="image" %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<div class="col-12">
|
||||
{% include cards/invoices.html %}
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
{% include cards/table-users.html %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
{% for level-1 in site.data.menu %}
|
||||
<li class="sidebar-nav-item">
|
||||
|
||||
<a{% unless level-1[1].children %} href="{{ site.base }}/{{ level-1[1].url }}"{% endunless %} class="sidebar-nav-link{% if level-1[0] == current-page[0] and current-page.size == 1 %} active{% endif %}" {% if level-1[1].children %}data-toggle="collapse" data-target="#sidebar-menu-{{ level-1[0] }}"{% if level-1[0] == current-page[0] %} aria-expanded="true"{% endif %}{% endif %}>
|
||||
<a {% unless level-1[1].children %}href="{{ site.base }}/{{ level-1[1].url }}"{% endunless %} class="sidebar-nav-link{% if level-1[0] == current-page[0] and current-page.size == 1 %} active{% endif %}" {% if level-1[1].children %}data-toggle="collapse" data-target="#sidebar-menu-{{ level-1[0] }}"{% if level-1[0] == current-page[0] %} aria-expanded="true"{% endif %}{% endif %}>
|
||||
{% if level-1[1].icon %}
|
||||
{% assign icon = level-1[1].icon %}
|
||||
{% include ui/icon.html icon=icon class="nav-icon" %}
|
||||
@@ -19,22 +19,42 @@
|
||||
{% include ui/badge.html text=badge color=badge-color %}
|
||||
{% endif %}
|
||||
|
||||
{% if level-1[1].children %}
|
||||
<span class="sidebar-nav-arrow"></span>
|
||||
{% endif %}
|
||||
{% if level-1[1].children %}
|
||||
<span class="sidebar-nav-arrow"></span>
|
||||
{% endif %}
|
||||
</a>
|
||||
|
||||
{% if level-1[1].children %}
|
||||
<ul class="sidebar-subnav collapse{% if level-1[0] == current-page[0] %} show{% endif %}" id="sidebar-menu-{{ level-1[0] }}">
|
||||
{% for level-2 in level-1[1].children %}
|
||||
<li class="sidebar-nav-item">
|
||||
<a href="{{ site.base }}/{{ level-2[1].url }}" class="sidebar-nav-link{% if level-1[0] == current-page[0] and level-2[0] == current-page[1] and current-page.size == 2 %} active{% endif %}">
|
||||
<a {% unless level-2[1].children %} href="{{ site.base }}/{{ level-2[1].url }}"{% endunless %} class="sidebar-nav-link{% if level-1[0] == current-page[0] and level-2[0] == current-page[1] and current-page.size == 2 %} active{% endif %}" {% if level-2[1].children %}data-toggle="collapse" data-target="#sidebar-menu-{{ level-2[0] }}"{% if level-1[0] == current-page[0] and level-2[0] == current-page[1] %} aria-expanded="true"{% endif %}{% endif %}>
|
||||
<span>{{ level-2[1].title }}</span>
|
||||
{% if level-2[1].badge %}
|
||||
{% assign badge = level-2[1].badge %}
|
||||
{% include ui/badge.html text=badge color="green" %}
|
||||
{% endif %}
|
||||
|
||||
{% if level-2[1].children %}
|
||||
<span class="sidebar-nav-arrow"></span>
|
||||
{% endif %}
|
||||
</a>
|
||||
|
||||
{% if level-2[1].children %}
|
||||
<ul class="sidebar-subnav collapse{% if level-1[0] == current-page[0] and level-2[0] == current-page[1] %} show{% endif %}" id="sidebar-menu-{{ level-2[0] }}">
|
||||
{% for level-3 in level-2[1].children %}
|
||||
<li class="sidebar-nav-item">
|
||||
<a href="{{ site.base }}/{{ level-3[1].url }}" class="sidebar-nav-link{% if level-1[0] == current-page[0] and level-2[0] == current-page[1] and level-3[0] == current-page[2] and current-page.size == 3 %} active{% endif %}">
|
||||
<span>{{ level-3[1].title }}</span>
|
||||
{% if level-3[1].badge %}
|
||||
{% assign badge = level-3[1].badge %}
|
||||
{% include ui/badge.html text=badge color="green" %}
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
<span class="payment payment-{{ include.payment | default: 'visa'}}{% if include.class %} {{ include.class }}{% endif %}{% if include.['size'] %} payment-size-{{include.size}}{% endif %}"></span>
|
||||
@@ -2,6 +2,11 @@
|
||||
{% assign id = 0 | random_id %}
|
||||
{% assign color = include.color | default: 'blue' %}
|
||||
|
||||
{% assign data = include.data %}
|
||||
{% if include.percentage %}
|
||||
{% assign data = include.percentage | append: "/100" %}
|
||||
{% endif %}
|
||||
|
||||
{% append_lib peity %}
|
||||
|
||||
<div class="chart-sparkline{% if type == 'pie' %} chart-sparkline-square{% endif %}{% if include.wide %} chart-sparkline-wide{% endif %}" id="sparkline-{{ id }}"></div>
|
||||
@@ -9,15 +14,15 @@
|
||||
{% capture_global scripts %}
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
$().peity && $('#sparkline-{{ id }}').text("{{ include.data }}").peity("{{ type | default: 'bar' }}", {
|
||||
$().peity && $('#sparkline-{{ id }}').text("{{ data }}").peity("{{ type | default: 'bar' }}", {
|
||||
width: {% if type == 'pie' %}40{% else %}64{% endif %},
|
||||
height: 40,
|
||||
stroke: "{{ color | tabler_color }}",
|
||||
strokeWidth: 2,
|
||||
fill: {% if type == 'pie' %}["{{ color | default: 'blue' | tabler_color }}", "{{ 'border-color' | tabler_color }}"]{% elsif type == 'bar' %}["{{ color | tabler_color }}"]{% else %}"transparent"{% endif %},
|
||||
fill: {% if type == 'pie' %}["{{ color | default: 'blue' | tabler_color }}", "{{ 'gray-200' | tabler_color }}"]{% elsif type == 'bar' %}["{{ color | tabler_color }}"]{% else %}"transparent"{% endif %},
|
||||
padding: .2,
|
||||
innerRadius: 16,
|
||||
innerRadius: 17,
|
||||
});
|
||||
});
|
||||
</script>
|
||||
{% endcapture_global %}
|
||||
{% endcapture_global %}
|
||||
|
||||
@@ -50,7 +50,7 @@ module Jekyll
|
||||
|
||||
if value >= 75
|
||||
'green'
|
||||
elsif value >= 60
|
||||
elsif value >= 30
|
||||
'yellow'
|
||||
else
|
||||
'red'
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
---
|
||||
title: Invoice
|
||||
layout: default
|
||||
menu: extra.invoice
|
||||
---
|
||||
|
||||
{% include cards/invoice.html %}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
---
|
||||
tmp: true
|
||||
menu: a.b.c
|
||||
---
|
||||
|
||||
<div class="row">
|
||||
|
||||
Reference in New Issue
Block a user