未验证 提交 0f413cc7 编写于 作者: D Dawid Harat 提交者: GitHub

Merge branch 'dev' into dev-countup

......@@ -7,7 +7,6 @@ group :jekyll_plugins do
gem "jekyll-tidy"
gem "jekyll-timeago"
gem 'jekyll-redirect-from'
gem 'jekyll-include-cache'
end
gem 'wdm', '>= 0.1.1' if Gem.win_platform?
......@@ -10,7 +10,7 @@ Premium and Open Source dashboard template with responsive and high-quality UI.
[![Sponsors on Open Collective](https://opencollective.com/tabler/sponsors/badge.svg)](#sponsors)
<strong><a href="https://preview-dev.tabler.io">View Demo</a> | <a href="https://github.com/tabler/tabler-react">View React Version</a> | <a href="https://github.com/tabler/tabler/archive/master.zip">Download ZIP</a> | <a href="https://tabler-ui.slack.com">Join us on Slack</a></strong>
<strong><a href="https://preview-dev.tabler.io">View Demo</a> | <a href="https://github.com/tabler/tabler-react">View React Version</a> | <a href="https://github.com/tabler/tabler/archive/master.zip">Download ZIP</a> | <a href="https://join.slack.com/t/tabler-ui/shared_invite/enQtMzQxMTYxODk5NDYwLWU4Y2FiNWYxN2UyNWUzOTBjNmU0ZGM2ZDViMjQzMWMyZWM0ZDFkMGRhZGFiYzFhZjM1NmIxOGQ2ZDUwZjlhMTU">Join us on Slack</a></strong>
![Tabler preview](https://raw.githubusercontent.com/tabler/tabler/dev/static/img/tabler-preview.png)
......
......@@ -15,7 +15,6 @@ plugins:
- jekyll-tidy
- jekyll-timeago
- jekyll-redirect-from
- jekyll-include-cache
exclude:
- .jekyll-cache
......
......@@ -3,4 +3,4 @@ title: Card with ribbon
columns: 1
---
{% include_cached cards/ribbon.html right=true text="-10%" lorem=true color="orange" bookmark=true %}
{% include cards/ribbon.html right=true text="-10%" lorem=true color="orange" bookmark=true %}
......@@ -63,12 +63,16 @@ base:
url: carousel.html
users:
title: Users
icon: users
url: users.html
gallery:
title: Gallery
icon: image
url: gallery.html
profile:
title: Profile
url: profile.html
music:
title: Music
url: music.html
charts:
url: charts.html
......
......@@ -11,6 +11,7 @@ users:
name: Nikola Tesla
tags:
max-items: 3
value: dev, test
options:
- dev
......@@ -22,16 +23,16 @@ countries:
options:
pl:
name: Poland
image: img/flags/pl.svg
flag: pl
de:
name: Germany
image: img/flags/de.svg
flag: de
cz:
name: Czech Republic
image: img/flags/cz.svg
flag: cz
br:
name: Brazil
image: img/flags/br.svg
flag: br
people:
value: 4
......
......@@ -113,4 +113,4 @@ Make the list stack when it reaches a certain length.
{% endfor %}
<span class="avatar" element="a">+8</span>
</div>
{% endexample %}
\ No newline at end of file
{% endexample %}
......@@ -27,7 +27,7 @@ Use any of the available button classes to quickly create a styled button . We p
{% for button in site.button-variants %}
{% assign btn-color = button[1].class %}
{% assign btn-title = button[1].title %}
{% include_cached ui/button.html color=btn-color text=btn-title %}
{% include ui/button.html color=btn-color text=btn-title %}
{% endfor %}
{% endexample %}
......@@ -39,7 +39,7 @@ Make buttons look inactive by adding the disabled boolean attribute to any `.btn
{% for button in site.button-variants %}
{% assign btn-color = button[1].class %}
{% assign btn-title = button[1].title %}
{% include_cached ui/button.html color=btn-color text=btn-title disabled=true %}
{% include ui/button.html color=btn-color text=btn-title disabled=true %}
{% endfor %}
{% endexample %}
......@@ -62,7 +62,7 @@ Add `.btn-square` to button to remove border-radius.
{% for button in site.button-variants %}
{% assign btn-color = button[1].class %}
{% assign btn-title = button[1].title %}
{% include_cached ui/button.html color=btn-color text=btn-title square=true %}
{% include ui/button.html color=btn-color text=btn-title square=true %}
{% endfor %}
{% endexample %}
......@@ -74,7 +74,7 @@ Add `.btn-pill` class to any button to make them more rounded.
{% for button in site.button-variants %}
{% assign btn-color = button[1].class %}
{% assign btn-title = button[1].title %}
{% include_cached ui/button.html color=btn-color text=btn-title pill=true %}
{% include ui/button.html color=btn-color text=btn-title pill=true %}
{% endfor %}
{% endexample %}
......@@ -86,7 +86,7 @@ In need of a button, but not the hefty background colors they bring? Replace the
{% for button in site.button-variants %}
{% assign btn-color = button[1].class %}
{% assign btn-title = button[1].title %}
{% include_cached ui/button.html text=btn-title color=btn-color outline=true %}
{% include ui/button.html text=btn-title color=btn-color outline=true %}
{% endfor %}
{% endexample %}
......@@ -119,27 +119,27 @@ Icons can be found [**here**](/docs/icons.html#icons)
{% example html wrapper=btn-list %}
<button type="button" class="btn btn-dark">
{% include_cached ui/icon.html icon="upload" class="icon-sm" %}
{% include ui/icon.html icon="upload" class="icon-sm" %}
Upload
</button>
<button type="button" class="btn btn-warning">
{% include_cached ui/icon.html icon="heart" class="icon-sm" %}
{% include ui/icon.html icon="heart" class="icon-sm" %}
I like
</button>
<button type="button" class="btn btn-success">
{% include_cached ui/icon.html icon="check" class="icon-sm" %}
{% include ui/icon.html icon="check" class="icon-sm" %}
I agree
</button>
<button type="button" class="btn btn-outline-primary">
{% include_cached ui/icon.html icon="plus" class="icon-sm" %}
{% include ui/icon.html icon="plus" class="icon-sm" %}
More
</button>
<button type="button" class="btn btn-danger">
{% include_cached ui/icon.html icon="link" class="icon-sm" %}
{% include ui/icon.html icon="link" class="icon-sm" %}
Link
</button>
<button type="button" class="btn btn-info">
{% include_cached ui/icon.html icon="message-circle" class="icon-sm" %}
{% include ui/icon.html icon="message-circle" class="icon-sm" %}
Comment
</button>
{% endexample %}
......@@ -153,7 +153,7 @@ A button can be formatted to link to a social website
{% assign btn-icon = button[1].icon %}
{% assign btn-title = button[1].title %}
{% assign btn-color = button[0] %}
{% include_cached ui/button.html color=btn-color icon=btn-icon text=btn-title %}
{% include ui/button.html color=btn-color icon=btn-icon text=btn-title %}
{% endfor %}
{% endexample %}
......@@ -163,7 +163,7 @@ You can use only icons.
{% for button in site.socials %}
{% assign btn-icon = button[1].icon %}
{% assign btn-color = button[0] %}
{% include_cached ui/button.html color=btn-color icon=btn-icon icon-only=true %}
{% include ui/button.html color=btn-color icon=btn-icon icon-only=true %}
{% endfor %}
{% endexample %}
......@@ -173,25 +173,25 @@ Icon only button. Add `.btn-icon` class to remove unnecessary padding from butto
{% example html wrapper=btn-list %}
<button type="button" class="btn btn-icon btn-primary">
{% include_cached ui/icon.html icon="activity" class="icon-sm" %}
{% include ui/icon.html icon="activity" class="icon-sm" %}
</button>
<button type="button" class="btn btn-icon btn-primary btn-github">
{% include_cached ui/icon.html icon="github" class="icon-sm" %}
{% include ui/icon.html icon="github" class="icon-sm" %}
</button>
<button type="button" class="btn btn-icon btn-primary btn-success">
{% include_cached ui/icon.html icon="bell" class="icon-sm" %}
{% include ui/icon.html icon="bell" class="icon-sm" %}
</button>
<button type="button" class="btn btn-icon btn-primary btn-warning">
{% include_cached ui/icon.html icon="star" class="icon-sm" %}
{% include ui/icon.html icon="star" class="icon-sm" %}
</button>
<button type="button" class="btn btn-icon btn-primary btn-danger">
{% include_cached ui/icon.html icon="trash-2" class="icon-sm" %}
{% include ui/icon.html icon="trash-2" class="icon-sm" %}
</button>
<button type="button" class="btn btn-icon btn-primary btn-purple">
{% include_cached ui/icon.html icon="bar-chart" class="icon-sm" %}
{% include ui/icon.html icon="bar-chart" class="icon-sm" %}
</button>
<button type="button" class="btn btn-icon btn-primary btn-secondary">
{% include_cached ui/icon.html icon="git-merge" class="icon-sm" %}
{% include ui/icon.html icon="git-merge" class="icon-sm" %}
</button>
{% endexample %}
......@@ -202,23 +202,23 @@ Wrap the dropdown’s toggle (your button or link) and the dropdown menu within
{% example html wrapper=btn-list %}
<div class="dropdown">
<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
{% include_cached ui/icon.html icon="calendar" class="icon-sm" %}
{% include ui/icon.html icon="calendar" class="icon-sm" %}
</button>
{% include_cached ui/dropdown-menu.html %}
{% include ui/dropdown-menu.html %}
</div>
<div class="dropdown">
<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
{% include_cached ui/icon.html icon="calendar" class="icon-sm" %}Show calendar
{% include ui/icon.html icon="calendar" class="icon-sm" %}Show calendar
</button>
{% include_cached ui/dropdown-menu.html %}
{% include ui/dropdown-menu.html %}
</div>
<div class="dropdown">
<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
Show calendar
</button>
{% include_cached ui/dropdown-menu.html %}
{% include ui/dropdown-menu.html %}
</div>
{% endexample %}
......@@ -229,7 +229,7 @@ Add `.btn-loading` to use a loading state on a button. The width of the button d
Since the loading spinner is implemented using the `:after` pseudo-element, it is not supported by the `<input type="submit">` element.
{% example html wrapper=btn-list %}
{% include_cached ui/button.html color="primary" text="Button" spinner=true %}
{% include ui/button.html color="primary" text="Button" spinner=true %}
{% endexample %}
### List of buttons
......@@ -290,13 +290,13 @@ Use the `.text-center` or the `.text-right` modifiers to alter the alignment.
{% example html wrapper=btn-list %}
<a href="#" class="btn btn-secondary">
{% include_cached ui/avatar.html person-id="4" %} Avatar
{% include ui/avatar.html person-id="4" %} Avatar
</a>
<a href="#" class="btn btn-secondary">
{% include_cached ui/avatar.html person-id="5" %} Avatar
{% include ui/avatar.html person-id="5" %} Avatar
</a>
<a href="#" class="btn btn-secondary">
{% include_cached ui/avatar.html person-id="6" %} Avatar
{% include ui/avatar.html person-id="6" %} Avatar
</a>
{% endexample %}
......@@ -7,7 +7,7 @@ done: true
### Default markup
{% example html columns=1 %}
{% include_cached cards/ribbon.html %}
{% include cards/ribbon.html %}
{% endexample %}
### Ribbon position
......@@ -22,7 +22,7 @@ You can easily change the position of a ribbon by adding a class to the element.
You can also use multiple classes at once for example: `.ribbon.ribbon-top.ribbon-left` moves the ribbon to the top left corner.
{% example html columns=1 %}
{% include_cached cards/ribbon.html top=true left=true %}
{% include cards/ribbon.html top=true left=true %}
{% endexample %}
### Ribbon color
......@@ -30,7 +30,7 @@ You can also use multiple classes at once for example: `.ribbon.ribbon-top.ribbo
Customize the ribbon's background color. You can click [here]({% docs_url colors %}) to see the list of available colors.
{% example html columns=1 %}
{% include_cached cards/ribbon.html color="red" %}
{% include cards/ribbon.html color="red" %}
{% endexample %}
### Ribbon text
......@@ -38,7 +38,7 @@ Customize the ribbon's background color. You can click [here]({% docs_url colors
Set your own text in a ribbon.
{% example html columns=1 %}
{% include_cached cards/ribbon.html color="green" text="-50%" %}
{% include cards/ribbon.html color="green" text="-50%" %}
{% endexample %}
### Ribbon style
......@@ -46,5 +46,5 @@ Set your own text in a ribbon.
Change the style of a ribbon.
{% example html columns=1 %}
{% include_cached cards/ribbon.html bookmark=true color="orange" text="-50%" %}
{% include cards/ribbon.html bookmark=true color="orange" text="-50%" %}
{% endexample %}
......@@ -44,9 +44,9 @@ done: true
### Buttons
{% example html wrapper=btn-list %}
{% include_cached ui/button.html spinner=true text="Button" color="primary" %}
{% include_cached ui/button.html spinner=true text="Button" color="danger" %}
{% include_cached ui/button.html spinner=true text="Button" color="warning" %}
{% include_cached ui/button.html spinner=true color="success" %}
{% include_cached ui/button.html spinner=true color="secondary" %}
{% include ui/button.html spinner=true text="Button" color="primary" %}
{% include ui/button.html spinner=true text="Button" color="danger" %}
{% include ui/button.html spinner=true text="Button" color="warning" %}
{% include ui/button.html spinner=true color="success" %}
{% include ui/button.html spinner=true color="secondary" %}
{% endexample %}
......@@ -19,7 +19,7 @@
</div>
<div class="ml-auto">
<a href="#" class="icon d-none d-md-inline-block ml-3 {% if liked %}text-red{% else %}text-muted{% endif %}">
{% include_cached ui/icon.html icon="heart" use-svg=true %}
{% include ui/icon.html icon="heart" use-svg=true %}
</a>
</div>
</div>
......
......@@ -21,9 +21,9 @@
</p>
<div class="small">
<span class="text-success mr-1">+{{ forloop.index | random_number: 20, 50 }}</span>
<a href="#" data-toggle="tooltip" data-placement="top" title="Vote Up">{% include_cached ui/icon.html icon="chevron-up" %}</a>
<a href="#" data-toggle="tooltip" data-placement="top" title="Vote Up">{% include ui/icon.html icon="chevron-up" %}</a>
<a href="#" class="mr-1" data-toggle="tooltip" data-placement="top" title="Vote Down">
{% include_cached ui/icon.html icon="chevron-down" %}
{% include ui/icon.html icon="chevron-down" %}
</a>
<span class="mr-1">·</span>
<a href="#" class="mr-1 text-muted">Reply</a>
......
......@@ -21,7 +21,7 @@
<div class="progress-bar bg-{{ forloop.index | random_number: 30, 90 | number_color }}" role="progressbar" style="width: {{ forloop.index | random_number: 30, 90 }}%"></div>
</div>
</td>
<td><a href="" class="text-muted">{% include_cached ui/icon.html icon="more-horizontal" %}</a></td>
<td><a href="" class="text-muted">{% include ui/icon.html icon="more-horizontal" %}</a></td>
</tr>
{% endfor %}
......
......@@ -176,13 +176,13 @@
<div class="card-footer">
<div class="toolbar toolbar-mx">
<a href="#" class="text-muted">
{% include_cached ui/icon.html icon="thumbs-up" %} 321 Likes
{% include ui/icon.html icon="thumbs-up" %} 321 Likes
</a>
<a href="#feed-form-{{ id }}" class="text-muted" data-toggle="collapse">
{% include_cached ui/icon.html icon="message-square" %} 56 Comments
{% include ui/icon.html icon="message-square" %} 56 Comments
</a>
<a href="#" class="text-muted">
{% include_cached ui/icon.html icon="share-2" %}
{% include ui/icon.html icon="share-2" %}
Share
</a>
</div>
......@@ -192,10 +192,10 @@
<textarea class="form-control" rows="3"></textarea>
<div class="d-flex pt-2">
<div class="toolbar mt-1">
<a href="#" class="text-muted">{% include_cached ui/icon.html icon="image" %}</a>
<a href="#" class="text-muted">{% include_cached ui/icon.html icon="video" %}</a>
<a href="#" class="text-muted">{% include_cached ui/icon.html icon="map-pin" %}</a>
<a href="#" class="text-muted">{% include_cached ui/icon.html icon="paperclip" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="image" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="video" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="map-pin" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="paperclip" %}</a>
</div>
<button class="btn btn-sm btn-primary ml-auto">Post</button>
</div>
......
......@@ -9,14 +9,14 @@
</div>
<div class="ml-auto">
<a href="#" class="text-muted">
{% include_cached ui/icon.html icon="eye" %}
{% include ui/icon.html icon="eye" %}
{{ forloop.index | random_number: 300, 600 }}
</a>
<a href="#" class="ml-3 text-muted">
{% include_cached ui/icon.html icon="heart" %}
{% include ui/icon.html icon="heart" %}
{{ forloop.index | random_number: 20, 100 }}
</a>
</div>
</div>
</div>
</div>
\ No newline at end of file
</div>
......@@ -5,7 +5,7 @@
<ul class="icons-list">
{% for icon in site.data.icons[include.group] %}
<li class="icons-list-item">
{% include_cached ui/icon.html icon=icon class="icon-md" %}
{% include ui/icon.html icon=icon class="icon-md" %}
</li>
{% endfor %}
{% for icon in (0..20) %}
......
<div class="card">
<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>
<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>
{% 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 class="card-header">
<h3 class="card-title">Invoices</h3>
</div>
<div class="card-body border-bottom py-3">
<div class="d-flex">
<div class="mb-0">
Show
<div class="mx-2 d-inline-block">
<input type="text" class="form-control form-control-sm" value="8" size="3">
</div>
entries
</div>
<div class="mb-0 ml-auto">
Search:
<div class="ml-2 d-inline-block">
<input type="text" class="form-control form-control-sm">
</div>
</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 ui/icon.html icon="chevron-up" class="icon-sm text-dark icon-thick" %}</th>
<th>Invoice Subject {% include ui/icon.html icon="code" class="icon-sm" %}</th>
<th>Client {% include ui/icon.html icon="code" class="icon-sm" %}</th>
<th>VAT No. {% include ui/icon.html icon="code" class="icon-sm" %}</th>
<th>Created {% include ui/icon.html icon="code" class="icon-sm" %}</th>
<th>Status {% include ui/icon.html icon="code" class="icon-sm" %}</th>
<th>Price {% include 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>
<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" tabindex="-1">{{ 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>
{% include ui/icon.html icon="edit" class="icon-sm float-right" %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<div class="card-footer d-flex align-items-center border-top-0">
<p class="m-0 text-muted">Showing <span>1</span> to <span>8</span> of <span>16</span> entries</p>
{% include ui/pagination.html class="m-0 ml-auto" %}
</div>
</div>
......@@ -14,7 +14,7 @@
{% for page in site.data.pages %}
<tr>
<td>{{ page.uri }}</td>
<td><a href="#" class="text-muted">{% include_cached ui/icon.html icon="link" %}</a></td>
<td><a href="#" class="text-muted">{% include ui/icon.html icon="link" %}</a></td>
<td>{{ page.visitors | format_number }}</td>
<td>{{ page.unique | format_number }}</td>
<td>{{ page.bounce-rate }}</td>
......
{% assign track-id = include.track-id | default: 5 %}
{% assign track = site.data.tracks[track-id] %}
<div class="card">
<div class="row row-0">
<div class="col-auto">
<img src="{{ site.base }}/img/tracks/{{ track.album.images[1].path }}" class="rounded-left" alt="{{ track.name | escape }}" width="88" height="88">
</div>
<div class="col">
<div class="card-body">
{{ track.name }}
<div class="text-muted">
{% for artist in track.artists %}
{{ artist.name }}{% unless forloop.last %},{% endunless %}
{% endfor %}
</div>
</div>
</div>
</div>
</div>
<div class="card">
<div class="list-group card-list-group">
{% for track in site.data.tracks limit: 12 %}
<div class="list-group-item">
<div class="row row-sm align-items-center">
<div class="col-auto text-h3">
{{ forloop.index }}
</div>
<div class="col-auto">
<img src="{{ site.base }}/img/tracks/{{ track.album.images[1].path }}" class="rounded" alt="{{ track.name | escape }}" width="48" height="48">
</div>
<div class="col">
{{ track.name }}
<div class="text-muted">
{% for artist in track.artists %}
{{ artist.name }}{% unless forloop.last %},{% endunless %}
{% endfor %}
</div>
</div>
<div class="col-auto text-muted">
{{ track.duration_ms | miliseconds_to_minutes }}
</div>
<div class="col-auto">
{% include ui/icon.html icon="heart" %}
</div>
<div class="col-auto">
{% include ui/icon.html icon="more-horizontal" %}
</div>
</div>
</div>
{% endfor %}
</div>
</div>
......@@ -14,9 +14,9 @@
{% for feature in features %}
<li>
{% if available-features[forloop.index0] == '1' %}
{% include_cached ui/icon.html icon="check" class="mr-1 text-success" %}
{% include ui/icon.html icon="check" class="mr-1 text-success" %}
{% else %}
{% include_cached ui/icon.html icon="x" class="mr-1 text-danger" %}
{% include ui/icon.html icon="x" class="mr-1 text-danger" %}
{% endif %}
{{ feature }}
</li>
......
......@@ -9,17 +9,17 @@
<ul class="social-links list-inline mb-0 mt-2">
<li class="list-inline-item">
<a href="#" title="Facebook" data-toggle="tooltip">
{% include_cached ui/icon.html icon="facebook" %}
{% include ui/icon.html icon="facebook" %}
</a>
</li>
<li class="list-inline-item">
<a href="#" title="Twitter" data-toggle="tooltip">
{% include_cached ui/icon.html icon="twitter" %}
{% include ui/icon.html icon="twitter" %}
</a>
</li>
<li class="list-inline-item">
<a href="#" title="1234567890" data-toggle="tooltip">
{% include_cached ui/icon.html icon="phone" %}
{% include ui/icon.html icon="phone" %}
</a>
</li>
</ul>
......
......@@ -3,20 +3,20 @@
<div class="input-group">
<input type="text" class="form-control" placeholder="Message">
<div class="input-group-append">
<button type="button" class="btn btn-secondary">
<i class="fe fe-camera"></i>
</button>
{% include ui/button.html icon="camera" icon-only=true color="secondary" %}
</div>
</div>
</div>
<ul class="list-group card-list-group">
<li class="list-group-item py-4">
<div class="media">
<div class="media-object avatar avatar-md mr-4" style="background-image: url({{ site.data.people[4].photo }})"></div>
<div class="media-body">
<div class="media-heading">
<div class="d-flex">
<div>
{% include ui/avatar.html person-id=5 class="mr-3" %}
</div>
<div class="flex-fill">
<div>
<small class="float-right text-muted">4 min</small>
<h4 class="font-semibold">{{ site.data.people[4].first_name }} {{ site.data.people[4].last_name }}</h4 class="font-semibold">
<h4>{{ site.data.people[4].first_name }} {{ site.data.people[4].last_name }}</h4>
</div>
<div>
......@@ -25,18 +25,22 @@
nascetur ridiculus mus.
</div>
<ul class="media-list">
<li class="media mt-4">
<div class="media-object avatar mr-4" style="background-image: url({{ site.data.people[7].photo }})"></div>
<div class="media-body">
<ul class="list-unstyled">
<li class="d-flex mt-4">
<div>
{% include ui/avatar.html person-id=8 class="mr-3" %}
</div>
<div class="flex-fill">
<strong>{{ site.data.people[7].first_name }} {{ site.data.people[7].last_name }}: </strong>
Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec ullamcorper nulla non metus
auctor fringilla. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Sed posuere consectetur est at lobortis.
</div>
</li>
<li class="media mt-4">
<div class="media-object avatar mr-4" style="background-image: url({{ site.data.people[9].photo }})"></div>
<div class="media-body">
<li class="d-flex mt-4">
<div>
{% include ui/avatar.html person-id=10 class="mr-3" %}
</div>
<div class="flex-fill">
<strong>{{ site.data.people[9].first_name }} {{ site.data.people[9].last_name }}: </strong>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit
amet risus.
......@@ -47,12 +51,14 @@
</div>
</li>
<li class="list-group-item py-4">
<div class="media">
<div class="media-object avatar avatar-md mr-4" style="background-image: url({{ site.data.people[4].photo }})"></div>
<div class="media-body">
<div class="media-heading">
<div class="d-flex">
<div>
{% include ui/avatar.html person-id=11 class="mr-3" %}
</div>
<div class="flex-fill">
<div>
<small class="float-right text-muted">12 min</small>
<h4 class="font-semibold">{{ site.data.people[4].first_name }} {{ site.data.people[4].last_name }}</h4 class="font-semibold">
<h4>{{ site.data.people[10].first_name }} {{ site.data.people[10].last_name }}</h4>
</div>
<div>
Donec id elit non mi porta gravida at eget metus. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Cum sociis natoque penatibus et magnis dis
......@@ -62,12 +68,14 @@
</div>
</li>
<li class="list-group-item py-4">
<div class="media">
<div class="media-object avatar avatar-md mr-4" style="background-image: url({{ site.data.people[4].photo }})"></div>
<div class="media-body">
<div class="media-heading">
<div class="d-flex">
<div>
{% include ui/avatar.html person-id=15 class="mr-3" %}
</div>
<div class="flex-fill">
<div>
<small class="float-right text-muted">34 min</small>
<h4 class="font-semibold">{{ site.data.people[4].first_name }} {{ site.data.people[4].last_name }}</h4 class="font-semibold">
<h4>{{ site.data.people[14].first_name }} {{ site.data.people[14].last_name }}</h4>
</div>
<div>
......@@ -75,10 +83,12 @@
venenatis vestibulum. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
</div>
<ul class="media-list">
<li class="media mt-4">
<div class="media-object avatar mr-4" style="background-image: url({{ site.data.people[5].photo }})"></div>
<div class="media-body">
<ul class="list-unstyled">
<li class="d-flex mt-4">
<div>
{% include ui/avatar.html person-id=6 class="mr-3" %}
</div>
<div class="flex-fill">
<strong>{{ site.data.people[5].first_name }} {{ site.data.people[5].last_name }}: </strong>
Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec ullamcorper nulla non metus
auctor fringilla. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Sed posuere consectetur est at lobortis.
......
......@@ -10,7 +10,7 @@
</p>
<button class="btn btn-outline-primary btn-sm">
{% include_cached ui/icon.html icon="twitter" %}
{% include ui/icon.html icon="twitter" %}
Follow
</button>
</div>
......
......@@ -8,9 +8,9 @@
<div class="card-body">
<div class="dropdown card-options">
<button class="btn-options" type="button" data-toggle="dropdown">
{% include_cached ui/icon.html icon="more-vertical" %}
{% include ui/icon.html icon="more-vertical" %}
</button>
{% include_cached ui/dropdown-menu.html right=true %}
{% include ui/dropdown-menu.html right=true %}
</div>
<div class="card-title">
<h6 class="h4 mb-3"><a href="#">{{ include.title | default: 'Task Title' }}</a>{% if include.badge %} <span class="badge">{{ include.badge }}</span>{% endif %}</h6>
......@@ -20,7 +20,7 @@
<div class="card-meta d-flex justify-content-between">
<div class="d-flex align-items-center">
{% include_cached ui/icon.html icon="check-square" class="mr-2" %}
{% include ui/icon.html icon="check-square" class="mr-2" %}
<span>5/10</span>
</div>
<span>Due {{ due }}</span>
......
......@@ -9,5 +9,5 @@
{% endif %}
</div>
<div class="ribbon{% if include.top %} ribbon-top{% endif %}{% if include.left %} ribbon-left{% endif %}{% if include.bottom %} ribbon-bottom{% endif %}{% if include.bookmark %} ribbon-bookmark{% endif %}{% if include.color %} bg-{{ include.color }}{% endif %}">{% if include.text %}{{ include.text }}{% else %}{% include_cached ui/icon.html icon="star" class="icon-filled" use-svg=true %}{% endif %}</div>
<div class="ribbon{% if include.top %} ribbon-top{% endif %}{% if include.left %} ribbon-left{% endif %}{% if include.bottom %} ribbon-bottom{% endif %}{% if include.bookmark %} ribbon-bookmark{% endif %}{% if include.color %} bg-{{ include.color }}{% endif %}">{% if include.text %}{{ include.text }}{% else %}{% include ui/icon.html icon="star" class="icon-filled" use-svg=true %}{% endif %}</div>
</div>
......@@ -14,7 +14,7 @@
<div class="card" data-color={{color}}>
<div class="card-body">
<div class="float-right stamp{% if include.color %} bg-{{ include.color }}{% if include.light %}-lt{% else %} text-white{% endif %}{% endif %}">
{% include_cached ui/icon.html icon=icon %}
{% include ui/icon.html icon=icon %}
</div>
<div class="text-muted font-weight-normal mt-0">{{ include.title | default: 'Customers' }}</div>
<h3 class="h2 mt-2 mb-3">{{ include.count | default: "1,850" }}</h3>
......
......@@ -3,7 +3,7 @@
<div class="card">
<div class="card-body p-3 d-flex align-items-center">
{% if include.icon %}
<span class="{% if include.color %}bg-{{ include.color }} text-white{% endif %} stamp mr-3">{% include_cached ui/icon.html icon=include.icon %}</span>
<span class="{% if include.color %}bg-{{ include.color }} text-white{% endif %} stamp mr-3">{% include ui/icon.html icon=include.icon %}</span>
{% elsif include.person-id %}
{% include ui/avatar.html person-id=include.person-id class="mr-3 rounded" %}
{% endif %}
......@@ -18,7 +18,7 @@
<div class="strong">
{{ include.count | default: 1700 | format_number }} {{ include.subtitle }}
{% if include.small-icon %}
{% include_cached ui/icon.html icon=include.small-icon color=include.color class="icon-sm ml-1" %}
{% include ui/icon.html icon=include.small-icon color=include.color class="icon-sm ml-1" %}
{% endif %}
</div>
<div class="text-muted">{{ include.description | default: "Users" }}</div>
......
......@@ -13,7 +13,7 @@
<strong>{{ product.price }}</strong>
</div>
<div class="ml-auto">
<a href="#" class="btn btn-primary">{% include_cached ui/icon.html icon='plus' %} Add to cart</a>
<a href="#" class="btn btn-primary">{% include ui/icon.html icon='plus' %} Add to cart</a>
</div>
</div>
</div>
......
......@@ -25,9 +25,9 @@
<div class="col-auto">
<div class="dropdown">
<button class="btn-options" type="button" data-toggle="dropdown">
{% include_cached ui/icon.html icon="more-vertical" %}
{% include ui/icon.html icon="more-vertical" %}
</button>
{% include_cached ui/dropdown-menu.html right=true %}
{% include ui/dropdown-menu.html right=true %}
</div>
</div>
</div>
......
......@@ -62,7 +62,7 @@
<td class="text-center">
<div class="dropdown">
<a class="btn-icon mx-2" data-toggle="dropdown">
{% include_cached ui/icon.html icon="more-vertical" %}
{% include ui/icon.html icon="more-vertical" %}
</a>
{% include ui/dropdown-menu.html %}
</div>
......
......@@ -11,33 +11,33 @@
<div class="card">
<ul class="nav nav-tabs{% if include.alternative %} nav-tabs-alt{% endif %}{% if reverse %} flex-row-reverse{% endif %}{% if include.justified %} nav-fill{% endif %}" data-toggle="tabs">
<li class="nav-item">
<a href="#tabs-home-{{ id }}" class="nav-link active" data-toggle="tab">{% if include.icons %}{% include_cached ui/icon.html icon="home" class=icon-class %}{% endif %}{% unless include.hide-text %}Home{% endunless %}</a>
<a href="#tabs-home-{{ id }}" class="nav-link active" data-toggle="tab">{% if include.icons %}{% include ui/icon.html icon="home" class=icon-class %}{% endif %}{% unless include.hide-text %}Home{% endunless %}</a>
</li>
<li class="nav-item">
<a href="#tabs-profile-{{ id }}" class="nav-link" data-toggle="tab">{% if include.icons %}{% include_cached ui/icon.html icon="user" class=icon-class %}{% endif %}{% unless include.hide-text %}Profile{% endunless %}</a>
<a href="#tabs-profile-{{ id }}" class="nav-link" data-toggle="tab">{% if include.icons %}{% include ui/icon.html icon="user" class=icon-class %}{% endif %}{% unless include.hide-text %}Profile{% endunless %}</a>
</li>
{% if include.activity %}
<li class="nav-item">
<a href="#tabs-activity-{{ id }}" class="nav-link" data-toggle="tab">{% if include.icons %}{% include_cached ui/icon.html icon="activity" class=icon-class %}{% endif %}{% unless include.hide-text %}Activity{% endunless %}</a>
<a href="#tabs-activity-{{ id }}" class="nav-link" data-toggle="tab">{% if include.icons %}{% include ui/icon.html icon="activity" class=icon-class %}{% endif %}{% unless include.hide-text %}Activity{% endunless %}</a>
</li>
{% endif %}
{% if include.disabled %}
<li class="nav-item">
<a href="#tabs-activity-{{ id }}" class="nav-link disabled" data-toggle="tab">{% if include.icons %}{% include_cached ui/icon.html icon="x" class=icon-class %}{% endif %}{% unless include.hide-text %}Disabled{% endunless %}</a>
<a href="#tabs-activity-{{ id }}" class="nav-link disabled" data-toggle="tab">{% if include.icons %}{% include ui/icon.html icon="x" class=icon-class %}{% endif %}{% unless include.hide-text %}Disabled{% endunless %}</a>
</li>
{% endif %}
{% if include.dropdown %}
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
{% include_cached ui/dropdown-menu.html %}
{% include ui/dropdown-menu.html %}
</li>
{% endif %}
{% if include.settings %}
<li class="nav-item {% if reverse %}mr-auto{% else %}ml-auto{% endif %}">
<a href="#tabs-settings-{{ id }}" class="nav-link" title="Settings" data-toggle="tab">{% include_cached ui/icon.html icon="settings" %}</a>
<a href="#tabs-settings-{{ id }}" class="nav-link" title="Settings" data-toggle="tab">{% include ui/icon.html icon="settings" %}</a>
</li>
{% endif %}
</ul>
......
......@@ -16,14 +16,14 @@
<a href="#" class="text-reset">{{ task.name }}</a>
</td>
<td class="text-nowrap text-muted">
{% include_cached ui/icon.html icon="calendar" %}
{% include ui/icon.html icon="calendar" %}
{{ forloop.index | random_date: "2019-01-01", "2018-01-01" | date: '%B %d, %Y' }}
</td>
<td class="text-nowrap">
<a href="#" class="text-muted">{% include_cached ui/icon.html icon="check" %} {{ forloop.index | random_number: 0, 6 }}/{{ forloop.index | random_number: 5, 10 }}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="check" %} {{ forloop.index | random_number: 0, 6 }}/{{ forloop.index | random_number: 5, 10 }}</a>
</td>
<td class="text-nowrap">
<a href="#" class="text-muted">{% include_cached ui/icon.html icon="message-square" %} {{ forloop.index | random_number: 0, 12 }}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="message-square" %} {{ forloop.index | random_number: 0, 12 }}</a>
</td>
<td>
{% include ui/avatar.html person-id=forloop.index size="sm" %}
......
......@@ -5,7 +5,7 @@
<div class="card-body">
<ul class="list list-timeline{% if include.simple %} list-timeline-simple{% endif %}">
<li>
<div class="list-timeline-icon bg-twitter">{% include_cached ui/icon.html icon="twitter" %}</div>
<div class="list-timeline-icon bg-twitter">{% include ui/icon.html icon="twitter" %}</div>
<div class="list-timeline-content">
<div class="list-timeline-time">10 hrs ago</div>
<p class="list-timeline-title">+1150 Followers</p>
......@@ -13,7 +13,7 @@
</div>
</li>
<li>
<div class="list-timeline-icon bg-red">{% include_cached ui/icon.html icon="briefcase" %}</div>
<div class="list-timeline-icon bg-red">{% include ui/icon.html icon="briefcase" %}</div>
<div class="list-timeline-content">
<div class="list-timeline-time">2 hrs ago</div>
<p class="list-timeline-title">+3 New Products were added!</p>
......@@ -21,7 +21,7 @@
</div>
</li>
<li>
<div class="list-timeline-icon bg-success">{% include_cached ui/icon.html icon="check" %}</div>
<div class="list-timeline-icon bg-success">{% include ui/icon.html icon="check" %}</div>
<div class="list-timeline-content">
<div class="list-timeline-time">1 day ago</div>
<p class="list-timeline-title">Database backup completed!</p>
......@@ -29,7 +29,7 @@
</div>
</li>
<li>
<div class="list-timeline-icon bg-facebook">{% include_cached ui/icon.html icon="facebook" %}</div>
<div class="list-timeline-icon bg-facebook">{% include ui/icon.html icon="facebook" %}</div>
<div class="list-timeline-content">
<div class="list-timeline-time">1 day ago</div>
<p class="list-timeline-title">+290 Page Likes</p>
......@@ -37,7 +37,7 @@
</div>
</li>
<li>
<div class="list-timeline-icon bg-teal">{% include_cached ui/icon.html icon="user-plus" %}</div>
<div class="list-timeline-icon bg-teal">{% include ui/icon.html icon="user-plus" %}</div>
<div class="list-timeline-content">
<div class="list-timeline-time">2 days ago</div>
<p class="list-timeline-title">+3 Friend Requests</p>
......@@ -49,7 +49,7 @@
</div>
</li>
<li>
<div class="list-timeline-icon bg-yellow">{% include_cached ui/icon.html icon="image" %}</div>
<div class="list-timeline-icon bg-yellow">{% include ui/icon.html icon="image" %}</div>
<div class="list-timeline-content">
<div class="list-timeline-time">3 days ago</div>
<p class="list-timeline-title">+2 New photos</p>
......@@ -70,7 +70,7 @@
</div>
</li>
<li>
<div class="list-timeline-icon">{% include_cached ui/icon.html icon="settings" %}</div>
<div class="list-timeline-icon">{% include ui/icon.html icon="settings" %}</div>
<div class="list-timeline-content">
<div class="list-timeline-time">2 weeks ago</div>
<p class="list-timeline-title">System updated to v2.02</p>
......
......@@ -5,27 +5,27 @@
<div class="card-body">
<div class="card-title">{{ include.title | default: 'Basic info' }}</div>
<div class="mb-2">
{% include_cached ui/icon.html icon="book" class="mr-2 text-muted" %}
{% include ui/icon.html icon="book" class="mr-2 text-muted" %}
Went to: <strong>{{ person.university }}</strong>
</div>
<div class="mb-2">
{% include_cached ui/icon.html icon="briefcase" class="mr-2 text-muted" %}
{% include ui/icon.html icon="briefcase" class="mr-2 text-muted" %}
Worked at: <strong>{{ person.company }}</strong>
</div>
<div class="mb-2">
{% include_cached ui/icon.html icon="home" class="mr-2 text-muted" %}
{% include ui/icon.html icon="home" class="mr-2 text-muted" %}
Lives in: <strong>{{ person.city }}, {{ person.country }}</strong>
</div>
<div class="mb-2">
{% include_cached ui/icon.html icon="map-pin" class="mr-2 text-muted" %}
{% include ui/icon.html icon="map-pin" class="mr-2 text-muted" %}
From: <strong>{% include ui/flag.html flag=person.country_code %} {{ person.country }}</strong>
</div>
<div class="mb-2">
{% include_cached ui/icon.html icon="calendar" class="mr-2 text-muted" %}
{% include ui/icon.html icon="calendar" class="mr-2 text-muted" %}
Birth date: <strong>{{ person.birth_date }}</strong>
</div>
<div>
{% include_cached ui/icon.html icon="clock" class="mr-2 text-muted" %}
{% include ui/icon.html icon="clock" class="mr-2 text-muted" %}
Time zone: <strong>{{ person.time_zone }}</strong>
</div>
</div>
......
......@@ -30,7 +30,7 @@
{% else %}
{% assign star-color = 'text-muted' %}
{% endif %}
<a href="#" class="list-item-actions{% if checked-ids contains forloop.index %} show{% endif %}">{% include_cached ui/icon.html icon="star" class=star-color %}</a>
<a href="#" class="list-item-actions{% if checked-ids contains forloop.index %} show{% endif %}">{% include ui/icon.html icon="star" class=star-color %}</a>
{% endif %}
</div>
{% endfor %}
......
......@@ -43,7 +43,7 @@
<div class="input-group-append">
<button type="button" class="btn btn-primary">Action</button>
<button data-toggle="dropdown" type="button" class="btn btn-primary dropdown-toggle dropdown-toggle-split"></button>
{% include_cached ui/dropdown-menu.html right=true %}
{% include ui/dropdown-menu.html right=true %}
</div>
</div>
</div>
......
......@@ -25,7 +25,7 @@
<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Action
</button>
{% include_cached ui/dropdown-menu.html %}
{% include ui/dropdown-menu.html %}
</div>
<input type="text" class="form-control" aria-label="Text input with dropdown button">
</div>
......
......@@ -14,7 +14,7 @@
%}href="{{ level-1[1].url }}" data-toggle="{{ level-1[1].toggle }}" {% else
%}href="{{ site.base }}/{{ level-1[1].url }}" {% endif %}>
<span class="nav-icon">
{% include_cached ui/icon.html icon=icon %}
{% include ui/icon.html icon=icon %}
</span>
<span class="nav-text">
{{ level-1[1].title }}
......
......@@ -2,9 +2,9 @@
{% assign person = site.data.people[person-id] %}
{% if include.menu-layout != 'vertical' %}
{% include_cached layout/navbar-logo.html class="mr-4" %}
{% include layout/navbar-logo.html class="mr-4" %}
{% else %}
{% include_cached layout/navbar-search.html class="mr-4" %}
{% include layout/navbar-search.html class="mr-4" %}
{% endif %}
<ul class="nav navbar-menu align-items-center ml-auto">
......@@ -23,24 +23,24 @@
</a>
<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
<a class="dropdown-item" href="#">
{% include_cached ui/icon.html icon="user" class="dropdown-icon" %} Profile
{% include ui/icon.html icon="user" class="dropdown-icon" %} Profile
</a>
<a class="dropdown-item" href="#">
{% include_cached ui/icon.html icon="settings" class="dropdown-icon" %} Settings
{% include ui/icon.html icon="settings" class="dropdown-icon" %} Settings
</a>
<a class="dropdown-item" href="#">
{% include_cached ui/icon.html icon="mail" class="dropdown-icon" %} Inbox
{% include ui/icon.html icon="mail" class="dropdown-icon" %} Inbox
<span class="badge bg-primary ml-auto">6</span>
</a>
<a class="dropdown-item" href="#">
{% include_cached ui/icon.html icon="send" class="dropdown-icon" %} Message
{% include ui/icon.html icon="send" class="dropdown-icon" %} Message
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">
{% include_cached ui/icon.html icon="help-circle" class="dropdown-icon" %} Need help?
{% include ui/icon.html icon="help-circle" class="dropdown-icon" %} Need help?
</a>
<a class="dropdown-item" href="#">
{% include_cached ui/icon.html icon="log-out" class="dropdown-icon" %} Sign out
{% include ui/icon.html icon="log-out" class="dropdown-icon" %} Sign out
</a>
</div>
</li>
......
......@@ -5,27 +5,27 @@
{% if actions == 'users' %}
<div class="d-flex">
<input type="search" class="form-control d-inline-block w-9 mr-3" placeholder="Search user&hellip;"/>
{% include_cached ui/button.html text="New user" color="primary" icon="plus" %}
{% include ui/button.html text="New user" color="primary" icon="plus" %}
</div>
{% elsif actions == 'calendar' %}
<div class="d-flex">
{% include_cached ui/button.html text="Add event" color="primary" icon="plus" %}
{% include ui/button.html text="Add event" color="primary" icon="plus" %}
</div>
{% elsif actions == 'photos' %}
<div class="d-flex">
<div class="mr-3">
{% include ui/form/input-icon.html %}
</div>
{% include_cached ui/button.html text="Add event" color="primary" icon="plus" %}
{% include ui/button.html text="Add event" color="primary" icon="plus" %}
</div>
{% elsif actions == 'breadcrumb' %}
<div class="d-flex">
{% include_cached ui/breadcrumb.html class="breadcrumb-alternate" %}
{% include ui/breadcrumb.html class="breadcrumb-alternate" %}
</div>
{% elsif actions == 'buttons' %}
<span class="d-none d-sm-inline">
{% include_cached ui/button.html text="New view" color="secondary" icon="plus" %}
{% include ui/button.html text="New view" color="secondary" icon="plus" %}
</span>
{% include_cached ui/button.html text="Create new report" color="primary" class="ml-3" %}
{% include ui/button.html text="Create new report" color="primary" class="ml-3" %}
{% endif %}
</div>
\ No newline at end of file
</div>
<aside class="sidebar sidebar-dark">
<!-- Sidebar logo -->
{% include_cached layout/navbar-logo.html prefix="sidebar" %}
{% include layout/navbar-logo.html prefix="sidebar" %}
<div class="sidebar-content">
<div>
......@@ -12,4 +12,4 @@
{% include ui/button.html text="Logout" color="primary" icon="log-out" block=true %}
</div>
</div>
</aside>
\ No newline at end of file
</aside>
......@@ -3,7 +3,7 @@
<div class="container{% if include.fluid %}-fluid{% endif %}">
{% include layout/menu.html top=true %}
{% include_cached layout/navbar-search.html %}
{% include layout/navbar-search.html %}
</div>
</div>
</header>
<header class="topnav topbar">
<div class="container{% if include.fluid %}-fluid{% endif %}">
<div class="navbar navbar-expand-lg {% if include.dark %}navbar-dark bg-dark text-white{% else %}navbar-light{% endif %}{% if include.sticky %} navbar-sticky{% endif %}">
{% include_cached layout/navbar.html search=true menu-layout=page.menu-layout %}
{% include layout/navbar.html search=true menu-layout=page.menu-layout %}
</div>
</div>
</header>
......
......@@ -24,8 +24,8 @@
{% endif %}
{% assign text = type[1].title %}
{% include_cached ui/button.html block=true class=class icon=icon icon-only=icon-only text=text %}
{% assign color = type[0] %}
{% include ui/button.html block=true color=false class=class icon=icon icon-only=icon-only text=text %}
</div>
{% endif %}
{% endfor %}
......
......@@ -10,11 +10,11 @@
<div class="calendar{% if include.class %} {{ include.class }}{% endif %}">
<div class="calendar-nav">
<button class="btn btn-action btn-link btn-lg">
{% include_cached ui/icon.html icon="chevron-left" %}
{% include ui/icon.html icon="chevron-left" %}
</button>
<div class="calendar-title">{{ include.title | default: 'March 2017' }}</div>
<button class="btn btn-action btn-link btn-lg">
{% include_cached ui/icon.html icon="chevron-right" %}
{% include ui/icon.html icon="chevron-right" %}
</button>
</div>
<div class="calendar-container">
......
......@@ -8,4 +8,4 @@
{% include ui/button.html icon="search" icon-only=true color="secondary" %}
</div>
</div>
</div>
\ No newline at end of file
</div>
<div class="mb-3">
<label class="form-label">Shipping methods</label>
{% include_cached ui/form/input-selectgroup.html values="Unregistered,Priority Mail,Express Mail" class="selectgroup-vertical" type="radio" name="shipping-method" %}
{% include ui/form/input-selectgroup.html values="Unregistered,Priority Mail,Express Mail" class="selectgroup-vertical" type="radio" name="shipping-method" %}
</div>
<div class="mb-3">
<label class="form-label">Icons input</label>
{% include_cached ui/form/input-selectgroup.html values="i:smartphone,i:tablet,i:monitor,i:x" class="w-100" type="radio" name="device" %}
{% include ui/form/input-selectgroup.html values="i:smartphone,i:tablet,i:monitor,i:x" class="w-100" type="radio" name="device" %}
</div>
<div class="mb-3">
<label class="form-label">Icon input</label>
{% include_cached ui/form/input-selectgroup.html values="i:sun,i:moon,i:cloud-rain,i:cloud,Other" class="selectgroup-pills" %}
{% include ui/form/input-selectgroup.html values="i:sun,i:moon,i:cloud-rain,i:cloud,Other" class="selectgroup-pills" %}
</div>
<div class="mb-3">
<label class="form-label">Your skills</label>
{% include_cached ui/form/input-selectgroup.html values="HTML,CSS,PHP,JavaScript" class="selectgroup-pills selectgroup-separated" %}
{% include ui/form/input-selectgroup.html values="HTML,CSS,PHP,JavaScript" class="selectgroup-pills selectgroup-separated" %}
</div>
{% assign person = include.person %}
<div class="alert alert-{{ include.type | default: 'primary'}}{%if include.close %} alert-dismissible{% endif %}{% if include.avatar %} alert-avatar{% endif %}" role="alert">
{% if include.avatar %}{% include ui/avatar.html person=person %}{% endif %}
{% if include.icon %}{% include_cached ui/icon.html icon=include.icon class="mr-1" %}{% endif %} {{ include.text | default:
{% if include.icon %}{% include ui/icon.html icon=include.icon class="mr-1" %}{% endif %} {{ include.text | default:
"This is a custom alert box!" }}
{% if include.buttons %}
<div class="btn-list">
......
......@@ -19,6 +19,6 @@
{% assign el = 'span' %}
{% if link %}{% assign el = 'a' %}{% endif %}
<{{ el }} class="avatar{% if include['size'] %} avatar-{{ include['size'] }}{% endif %}{% if include.thumb %} avatar-thumb{% endif %}{% if include.class %} {{ include.class }}{% endif %}{% if include.shape %} {{ include.shape }}{% endif %}{% if include.color %} bg-{{ include.color }}-lt{% endif %}"{% if src %} style="background-image: url({{ site.base }}/{{ src }})"{% endif %}>{% if include.status %}
<span class="badge bg-{{ include.status }}">{% if include.status-text %}{{ include.status-text }}{% elsif include.status-icon %}{% include_cached ui/icon.html icon=include.status-icon class="avatar-status-icon" %}{% endif %}</span>
{% endif %}{% if placeholder %}{{ placeholder }}{% elsif include.icon %} {% include_cached ui/icon.html icon=include.icon class="avatar-icon" %}{% endif %}</{{ el }}>
<span class="badge bg-{{ include.status }}">{% if include.status-text %}{{ include.status-text }}{% elsif include.status-icon %}{% include ui/icon.html icon=include.status-icon class="avatar-status-icon" %}{% endif %}</span>
{% endif %}{% if placeholder %}{{ placeholder }}{% elsif include.icon %} {% include ui/icon.html icon=include.icon class="avatar-icon" %}{% endif %}</{{ el }}>
{% endremoveemptylines %}
{% removeemptylines %}
{% assign spinner-class = false %}
{% assign color = include.color | default: 'secondary' %}
{% if include.color == false %}
{% assign color = null %}
{% endif %}
{% assign provider = include.provider | default: 'fe' %}
{% if include.text %}{% assign spinner-class="mr-2" %}{% endif %}
{% assign e = include.element | default: 'a' %}
<{{ e }}{% if e == 'a' %} href="{% if include.href %}{{ site.base }}/{{ include.href }}{% else %}#{% endif %}"{% endif %}{% if include.type %} type="{{ include.type }}"{% endif %} class="btn{% if include.height %} btn-{{ include.height }}{% endif %}{% if include.color %} btn-{% if include.outline %}outline-{% endif %}{{ include.color }}{% endif %}{% if include.disabled %} disabled{% endif %}{% if include.square %} btn-square{% endif %}{% if include.pill %} btn-pill{% endif %}{% if include['size'] %} btn-{{ include['size'] }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}{% if include.block %} btn-block{% endif %}{% if include.link %} btn-link{% endif %}{% if include.icon-only %} btn-icon{% endif %}">
<{{ e }}{% if e == 'a' %} href="{% if include.href %}{{ site.base }}/{{ include.href }}{% else %}#{% endif %}"{% endif %}{% if include.type %} type="{{ include.type }}"{% endif %} class="btn{% if include.height %} btn-{{ include.height }}{% endif %}{% if color %} btn-{% if include.outline %}outline-{% endif %}{{ color }}{% endif %}{% if include.disabled %} disabled{% endif %}{% if include.square %} btn-square{% endif %}{% if include.pill %} btn-pill{% endif %}{% if include['size'] %} btn-{{ include['size'] }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}{% if include.block %} btn-block{% endif %}{% if include.link %} btn-link{% endif %}{% if include.icon-only %} btn-icon{% endif %}">
{% if include.spinner %}
{% include ui/spinner.html color=false size="sm" class=spinner-class element="span" %}{% endif %}
{% if include.icon %}{% include_cached ui/icon.html icon=include.icon use-svg=true %}{% endif %}
{% if include.icon %}{% include ui/icon.html icon=include.icon use-svg=true %}{% endif %}
{% unless include.icon-only %}
{{ include.text | default: "Button" }}
{% if include.icon-right %}{% include_cached ui/icon.html icon=include.icon-right use-svg=true right=true %}{% endif %}
{% if include.icon-right %}{% include ui/icon.html icon=include.icon-right use-svg=true right=true %}{% endif %}
{% endunless %}
</{{ e }}>
{% endremoveemptylines %}
......@@ -2,7 +2,7 @@
{% assign icon = include.icon | default: 'more-horizontal' %}
<div class="dropdown float-right">
<a href="#" class="card-drop" data-toggle="dropdown" aria-expanded="false">
{% include_cached ui/icon.html icon=icon %}
{% include ui/icon.html icon=icon %}
</a>
<div class="dropdown-menu dropdown-menu-right">
{% for item in menu %}
......
......@@ -8,18 +8,18 @@
{% else %}
{% if include.header %}<span class="dropdown-header">Dropdown header</span>{% endif %}
<a class="dropdown-item" href="#">
{% if include.icons %}{% include_cached ui/icon.html icon="settings" %} {% endif %}
{% if include.icons %}{% include ui/icon.html icon="settings" %} {% endif %}
Action
{% if include.badge %}<span class="badge bg-primary ml-auto">12</span>{% endif %}
</a>
<a class="dropdown-item" href="#">
{% if include.icons %}{% include_cached ui/icon.html icon="edit" %} {% endif %}Another action
{% if include.icons %}{% include ui/icon.html icon="edit" %} {% endif %}Another action
</a>
{% if include.active %}<a class="dropdown-item active" href="#">{% if include.icons %}{% include_cached ui/icon.html icon="activity" %} {% endif %}Active action</a>{% endif %}
{% if include.disabled %}<a class="dropdown-item disabled" href="#">{% if include.icons %}{% include_cached ui/icon.html icon="user-x" %} {% endif %}Disabled action</a>{% endif %}
{% if include.active %}<a class="dropdown-item active" href="#">{% if include.icons %}{% include ui/icon.html icon="activity" %} {% endif %}Active action</a>{% endif %}
{% if include.disabled %}<a class="dropdown-item disabled" href="#">{% if include.icons %}{% include ui/icon.html icon="user-x" %} {% endif %}Disabled action</a>{% endif %}
{% if include.separated %}
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">{% if include.icons %}{% include_cached ui/icon.html icon="plus" class="dropdown-icon" %} {% endif %}Separated link</a>
<a class="dropdown-item" href="#">{% if include.icons %}{% include ui/icon.html icon="plus" class="dropdown-icon" %} {% endif %}Separated link</a>
{% endif %}
{% endif %}
</div>
......@@ -7,7 +7,7 @@
{% elsif include.icon-text %}
<div class="display-4">{{ include.icon-text }}</div>
{% else %}
{% include_cached ui/icon.html icon=icon %}
{% include ui/icon.html icon=icon %}
{% endif %}
</div>
......@@ -18,6 +18,6 @@
<div class="empty-action">
{% assign button-text = include.button-text | default: "Search again" %}
{% assign button-icon = include.button-icon | default: "search" %}
{% include_cached ui/button.html text=button-text color="primary" icon=button-icon href="index.html" %}
{% include ui/button.html text=button-text color="primary" icon=button-icon href="index.html" %}
</div>
</div>
{% assign icon = include.icon | default: 'search' %}
{% capture addon %}
<span class="input-icon-addon">
{% include_cached ui/icon.html icon=icon %}
{% include ui/icon.html icon=icon %}
</span>
{% endcapture %}
......@@ -15,4 +15,4 @@
{% unless include.prepend %}
{{ addon }}
{% endunless %}
</div>
\ No newline at end of file
</div>
......@@ -7,7 +7,7 @@
<label class="selectgroup-item">
{% assign s = value | split: "i:" %}
<input type="{{ type }}" name="{{ name }}" value="{% if s.size == 2 %}{{ s[1] }}{% else %}{{ value }}{% endif %}" class="selectgroup-input"{% if value == default %}{% if type == "radio" %} checked{% else %} checked{% endif %}{% endif %}>
<span class="selectgroup-button">{% if s.size == 2 %}{% assign icon = s[1] %}{% include_cached ui/icon.html icon=icon use-svg=true %}{% else %}{{ value }}{% endif %}</span>
<span class="selectgroup-button">{% if s.size == 2 %}{% assign icon = s[1] %}{% include ui/icon.html icon=icon use-svg=true %}{% else %}{{ value }}{% endif %}</span>
</label>
{% endfor %}
</div>
......@@ -2,32 +2,55 @@
{% assign data = site.data.selects[key] %}
{% assign options = data.options %}
<select name="{{ key }}" id="select-{{ key }}" class="form-select">
{% if options == 'people' %}
{% for person in site.data.people limit: 20 %}
<option value="{{ person.id }}" data-data='{"image": "{{ site.base }}/{{ person.photo }}"}'{% if person.id == value %} selected{% endif %}>{{ person.full_name }}</option>
{% endfor %}
{% if options == 'people' %}
{% for person in site.data.people limit: 20 %}
<option value="{{ person.id }}" data-data='{"image": "{{ site.base }}/{{ person.photo }}"}'{% if person.id == value %} selected{% endif %}>{{ person.full_name }}</option>
{% endfor %}
{% else %}
{% for option in options %}
{% if option[1] %}
{% assign value = option[0] %}
{% assign name = option[1].name %}
{% assign all-data = option[1] %}
{% else %}
{% assign value = option %}
{% assign name = option %}
{% endif %}
<option value="{{ value }}"{% if all-data.image %} data-data='{"image": "{{ site.base }}/{{ all-data.image }}"}'{% endif %}{% if data.value == value %} selected{% endif %}>{{ name }}</option>
{% endfor %}
{% else %}
{% for option in options %}
{% if option[1] %}
{% assign value = option[0] %}
{% assign name = option[1].name %}
{% assign all-data = option[1] %}
{% else %}
{% assign value = option %}
{% assign name = option %}
{% endif %}
<option value="{{ value }}"{% if all-data.image %} data-data='{"image": "{{ site.base }}/{{ all-data.image }}"}'{% elsif all-data.flag %} data-data='{"flag": "{{ all-data.flag }}"}'{% endif %}{% if data.value == value %} selected{% endif %}>{{ name }}</option>
{% endfor %}
{% endif %}
{% endif %}
</select>
{% append_lib selectize %}
{% capture_global scripts %}
<script>
$(document).ready(function(){
$('#select-{{ key }}').selectize({});
});
$(document).ready(function () {
$('#select-{{ key }}').selectize({
{% if key == "countries" %}
render: {
option: function (data, escape) {
return '<div class="option"><span class="flag flag-' + data.flag + ' mr-2 ml-n1"></span>' + escape(data.text) + '</div>';
},
item: function (data, escape) {
return '<div class="d-flex align-items-center"><span class="flag flag-' + data.flag + ' mr-2 ml-n1"></span>' + escape(data.text) + '</div>';
}
}
{% elsif key == "people" %}
render: {
option: function (data, escape) {
return '<div class="option"><span class="avatar avatar-xs rounded mr-2 ml-n1" style="background-image: url({{ site.base }}/' + data.image + ')"></span>' + escape(data.text) + '</div>';
},
item: function (data, escape) {
return '<div class="d-flex align-items-center"><span class="avatar avatar-xs rounded mr-2 ml-n1" style="background-image: url({{ site.base }}/' + data.image + ')"></span>' + escape(data.text) + '</div>';
}
}
{% endif %}
{% if data.max-items %}
maxItems: {{ data.max-items }}
{% endif %}
});
});
</script>
{% endcapture_global %}
......@@ -6,7 +6,7 @@
</li>
<li class="nav-item">
<a class="nav-link" href="#">
{% include_cached ui/icon.html icon="star" class="mr-1" %}
{% include ui/icon.html icon="star" class="mr-1" %}
Link
</a>
</li>
......@@ -17,7 +17,7 @@
</li>
<li class="nav-item ml-auto">
<a class="nav-link" href="#">
{% include_cached ui/icon.html icon="settings" %}
{% include ui/icon.html icon="settings" %}
</a>
</li>
</ul>
......@@ -7,7 +7,7 @@
<div class="page-item-subtitle">Previous</div>
<div class="page-item-title">{{ include.prev-description }}</div>
{% else %}
{% if include.icons %}{% include_cached ui/icon.html icon="chevron-left" %}{% else %}{% include_cached ui/icon.html icon="chevron-left" %} Prev{% endif %}
{% if include.icons %}{% include ui/icon.html icon="chevron-left" %}{% else %}{% include ui/icon.html icon="chevron-left" %} Prev{% endif %}
{% endif %}
</a>
</li>
......@@ -23,7 +23,7 @@
<div class="page-item-subtitle">Next</div>
<div class="page-item-title">{{ include.next-description }}</div>
{% else %}
{% if include.icons %}{% include_cached ui/icon.html icon="chevron-right" %}{% else %}Next {% include_cached ui/icon.html icon="chevron-right" %}{% endif %}
{% if include.icons %}{% include ui/icon.html icon="chevron-right" %}{% else %}Next {% include ui/icon.html icon="chevron-right" %}{% endif %}
{% endif %}
</a>
</li>
......
......@@ -8,9 +8,9 @@
{% for i in (1..5) %}
<span class="star {% if forloop.index <= rate %}{{ class }}{% endif %}">
{% if forloop.index <= rate and filled %}
{% include_cached ui/icon.html icon=icon class="icon-filled" %}
{% include ui/icon.html icon=icon class="icon-filled" %}
{% else %}
{% include_cached ui/icon.html icon=icon %}
{% include ui/icon.html icon=icon %}
{% endif %}
</span>
{% endfor %}
......
......@@ -11,5 +11,5 @@
{% endif %}
<span class="text-{{ color }} d-inline-flex align-items-center lh-1{% if include.class %} {{ include.class }}{% endif %}">
{{ value }}% {% include_cached ui/icon.html icon=icon class="icon-thin" class="ml-1" %}
{{ value }}% {% include ui/icon.html icon=icon class="icon-thin" class="ml-1" %}
</span>
<!doctype html>
{% include_cached layout/banner.html %}
{% include layout/banner.html %}
<html lang="en"{% if page.rtl %} dir="rtl" {% endif %}>
<head>
<meta charset="utf-8"/>
......@@ -26,10 +26,8 @@
<meta name="description" content="{{ page.description | escape }}"/>
{% endif %}
{% include_cached layout/og.html show=layout.og-component %}
{% include_cached layout/css.html %}
<style>body { display: none; }</style>
{% include layout/og.html show=layout.og-component %}
{% include layout/css.html %}
</head>
{% assign dark-theme = page.dark-theme | default: site.dark-theme %}
......@@ -41,9 +39,8 @@
{% include layout/js-capture.html %}
{% if site.debug and jekyll.environment == 'development' %}
{% include_cached layout/debug.html %}
{% include layout/debug.html %}
{% endif %}
<script>document.body.style.display = 'block';</script>
</body>
</html>
......@@ -55,11 +55,11 @@ og-component: true
</div>
<div class="row">
<div class="col">{% include_cached ui/button.html icon="clipboard" text="Copy code" color="secondary" block=true class="mt-4" %}</div>
<div class="col">{% include ui/button.html icon="clipboard" text="Copy code" color="secondary" block=true class="mt-4" %}</div>
<div class="col">
<form action="https://codepen.io/pen/define" method="post" target="_blank">
<input type="hidden" name="data" value='{"title":"{{ page.title | escape }}","css_external":"https://preview-dev.tabler.io/dist/css/tabler.css","html":"{{ demo-html | tidy: 'html' | replace_regex: "\n", "\\n" | replace_regex: "\t", "\\t" | replace_regex: '"', '\"' | replace_regex: "'", "\'" }}","css":"{{ demo-css | replace_regex: "\n", "\\n" | replace_regex: "\t", "\\t" | replace_regex: '"', '\"' }}", "editors":"100"}'>
{% include_cached ui/button.html icon="codesandbox" text="Edit in CodePen" color="primary" block=true class="mt-4" element="button" type="submit" %}
{% include ui/button.html icon="codesandbox" text="Edit in CodePen" color="primary" block=true class="mt-4" element="button" type="submit" %}
</form>
</div>
</div>
......
......@@ -10,7 +10,7 @@ page-title: Documentation
<div class="row justify-content-center">
<div class="col-lg-3 order-lg-1 mb-4">
<a href="{{ site.github_url }}" class="btn btn-block btn-primary mb-4" target="_blank">
{% include_cached ui/icon.html icon="github" class="mr-2" %}Browse source code
{% include ui/icon.html icon="github" class="mr-2" %}Browse source code
</a>
<div class="list-group list-group-transparent mb-0">
......@@ -20,7 +20,7 @@ page-title: Documentation
{% if jekyll.environment == 'development' %}
{% assign doc-page = site.docs | where: "slug", key | first %}
{% if doc-page.done %}{% include_cached ui/icon.html icon="check" color="green" class="mr-2" %}{% endif %}
{% if doc-page.done %}{% include ui/icon.html icon="check" color="green" class="mr-2" %}{% endif %}
{% endif %}
{{ doc[1].title }}
......@@ -41,14 +41,14 @@ page-title: Documentation
{% if page.bootstrap-link %}
<p class="mb-4 float-right">
<a href="https://getbootstrap.com/docs/4.4/{{ page.bootstrap-link }}" target="_blank">
{% include_cached ui/icon.html icon="external-link" color="blue" class="pr-1" %}
{% include ui/icon.html icon="external-link" color="blue" class="pr-1" %}
Bootstrap documentation
</a>
</p>
{% endif %}
<h2 class="h1 mt-0 mb-3">{{ page.title }}
{% if page.done %} {% include_cached ui/icon.html icon="check" color="green" %}{% endif %}
{% if page.done %} {% include ui/icon.html icon="check" color="green" %}{% endif %}
</h2>
{% if page.plugin %}
......
......@@ -7,7 +7,7 @@ module Jekyll
end
def render(context)
if $captured_global[@text] === nil
unless $captured_global[@text]
$captured_global[@text] = [];
end
......@@ -54,10 +54,16 @@ module Jekyll
end
end
Jekyll::Hooks.register :site, :after_init do |page, jekyll|
Jekyll::Hooks.register :pages, :post_init do |page|
$captured_global = {}
$captured_once = {}
$captured_libs = []
end
Jekyll::Hooks.register :pages, :post_render do |page|
$captured_global = {}
$captured_once = {}
$captured_libs = []
end
Jekyll::Hooks.register :pages, :pre_render do |page, jekyll|
......@@ -65,12 +71,6 @@ module Jekyll
jekyll.site['captured_once'] = $captured_once
jekyll.site['captured_libs'] = $captured_libs
end
Jekyll::Hooks.register :pages, :post_render do |page, jekyll|
$captured_global = {}
$captured_libs = []
$captured_once = {}
end
end
Liquid::Template.register_tag('capture_global', Jekyll::Tags::CaptureGlobal)
......
......@@ -96,6 +96,18 @@ module Jekyll
Jekyll.sites.first.data['colors'][color]
end
def seconds_to_minutes(seconds)
seconds = seconds.to_i.round
minutes = (seconds / 60).round
seconds = seconds - (minutes * 60)
minutes.to_s.rjust(2, '0') + ":" + seconds.to_s.rjust(2, '0')
end
def miliseconds_to_minutes(miliseconds)
seconds_to_minutes(miliseconds.to_i / 1000)
end
end
end
......
......@@ -20,7 +20,7 @@ menu: index
<li>
<a href="{{ page.url }}">
{% if page.done %}
{% include_cached ui/icon.html icon="check" color="success" %}
{% include ui/icon.html icon="check" color="success" %}
{% endif %}
{{ page.title | default: page.name }}
</a>
......
......@@ -2,4 +2,4 @@
title: Data Tables
---
{% include cards/invoices.html %}
\ No newline at end of file
{% include cards/invoices.html %}
......@@ -3,18 +3,18 @@ title: Dropdowns
page-title: Dropdowns
---
{% include_cached ui/dropdown-menu.html show=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true separated=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true active=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true disabled=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true header=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true icons=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true icons=true header=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true arrow=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true dark=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true dark=true separated=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true arrow=true right=true dark=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true arrow=true right=true dark=true icons=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true badge=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true check=true class="mr-3 mb-3 align-top" %}
{% include_cached ui/dropdown-menu.html show=true radio=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true separated=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true active=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true disabled=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true header=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true icons=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true icons=true header=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true arrow=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true dark=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true dark=true separated=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true arrow=true right=true dark=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true arrow=true right=true dark=true icons=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true badge=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true check=true class="mr-3 mb-3 align-top" %}
{% include ui/dropdown-menu.html show=true radio=true class="mr-3 mb-3 align-top" %}
......@@ -3,78 +3,76 @@ title: Email
page-title: Crypto currencies
---
<div class="container">
<div class="row">
<div class="col-md-3">
<h3 class="mb-4">Mail Service</h3>
<div class="row">
<div class="col-md-3">
<h3 class="mb-4">Mail Service</h3>
<div>
<div class="list-group list-group-transparent mb-0">
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center active">
<span class="icon mr-3">{% include_cached ui/icon.html icon="inbox" %}</span>Inbox <span class="ml-auto badge bg-blue">14</span>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include_cached ui/icon.html icon="send" %}</span>Sent Mail
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include_cached ui/icon.html icon="alert-circle" %}</span>Important <span class="ml-auto badge bg-gray">3</span>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include_cached ui/icon.html icon="star" %}</span>Starred
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include_cached ui/icon.html icon="file" %}</span>Drafts
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include_cached ui/icon.html icon="tag" %}</span>Tags
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include_cached ui/icon.html icon="trash" %}</span>Trash
</a>
</div>
<div>
<div class="list-group list-group-transparent mb-0">
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center active">
<span class="icon mr-3">{% include ui/icon.html icon="inbox" %}</span>Inbox <span class="ml-auto badge bg-blue">14</span>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="send" %}</span>Sent Mail
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="alert-circle" %}</span>Important <span class="ml-auto badge bg-gray">3</span>
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="star" %}</span>Starred
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="file" %}</span>Drafts
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="tag" %}</span>Tags
</a>
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
<span class="icon mr-3">{% include ui/icon.html icon="trash" %}</span>Trash
</a>
</div>
<div class="mt-4">
<a href="#" class="btn btn-secondary btn-block">Compose new Email</a>
</div>
<div class="mt-4">
<a href="#" class="btn btn-secondary btn-block">Compose new Email</a>
</div>
</div>
<div class="col-md-9">
<div class="card">
<div class="card-header">
<h3 class="card-title">Compose new message</h3>
</div>
</div>
<div class="col-md-9">
<div class="card">
<div class="card-header">
<h3 class="card-title">Compose new message</h3>
</div>
<div class="card-body">
<div class="card-body">
<form action="">
<div class="mb-2">
<div class="row align-items-center">
<label class="col-sm-2">To:</label>
<div class="col-sm-10">
<input type="text" class="form-control">
</div>
<form action="">
<div class="mb-2">
<div class="row align-items-center">
<label class="col-sm-2">To:</label>
<div class="col-sm-10">
<input type="text" class="form-control">
</div>
</div>
</div>
<div class="mb-2">
<div class="row align-items-center">
<label class="col-sm-2">Subject:</label>
<div class="col-sm-10">
<input type="text" class="form-control">
</div>
<div class="mb-2">
<div class="row align-items-center">
<label class="col-sm-2">Subject:</label>
<div class="col-sm-10">
<input type="text" class="form-control">
</div>
</div>
</div>
<textarea rows="10" class="form-control"></textarea>
<textarea rows="10" class="form-control"></textarea>
<div class="btn-list mt-4 text-right">
<button type="button" class="btn btn-secondary btn-space">Cancel</button>
<button type="submit" class="btn btn-primary btn-space">Send message</button>
</div>
</form>
</div>
<div class="btn-list mt-4 text-right">
<button type="button" class="btn btn-secondary btn-space">Cancel</button>
<button type="submit" class="btn btn-primary btn-space">Send message</button>
</div>
</form>
</div>
</div>
</div>
</div>
......@@ -25,5 +25,5 @@ menu: gallery
</div>
<div class="d-flex">
{% include parts/pagination.html class="ml-auto" %}
{% include ui/pagination.html class="ml-auto" %}
</div>
......@@ -5,15 +5,15 @@ page-title: Icons
<div class="row">
<div class="col-12">
{% include_cached cards/icons.html title="Feather icons" group="fe" %}
{% include cards/icons.html title="Feather icons" group="fe" %}
</div>
{% if jekyll.environment == 'production' %}
<div class="col-lg-6">
{% include_cached cards/icons.html title="Brand icons" group="brand" %}
{% include cards/icons.html title="Brand icons" group="brand" %}
</div>
<div class="col-lg-6">
{% include_cached cards/icons.html title="Bootstrap icons" group="bootstrap" %}
{% include cards/icons.html title="Bootstrap icons" group="bootstrap" %}
</div>
{% endif %}
</div>
......
......@@ -8,4 +8,4 @@ menu-layout: vertical
menu: home
---
{% include_cached layout/homepage.html %}
{% include layout/homepage.html %}
---
title: Music components
page-title: Music components
menu: base.music
---
<div class="row">
<div class="col-lg-8">
{% include cards/music/tracks-list.html %}
</div>
<div class="col-lg-4">
<h3 class="mb-3">Top tracks</h3>
<div class="row">
{% for i in (8..13) %}
<div class="col-md-6 col-lg-12">
{% include cards/music/track-info.html track-id=i %}
</div>
{% endfor %}
</div>
</div>
</div>
......@@ -4,15 +4,15 @@ title: Pagination
{% card %}
{% include parts/pagination.html %}
{% include parts/pagination.html icons=true %}
{% include ui/pagination.html %}
{% include ui/pagination.html icons=true %}
{% endcard %}
{% card %}
{% include parts/pagination.html count=0 prev-description="Getting started" next-description="Breadcrumbs" %}
{% include ui/pagination.html count=0 prev-description="Getting started" next-description="Breadcrumbs" %}
{% endcard %}
<div>
{% include parts/pagination.html icons=true %}
{% include ui/pagination.html icons=true %}
</div>
---
title: Profile
page-title: Profile
menu: base.profile
---
<div class="container">
<div class="row">
<div class="col-lg-4">
{% include cards/profile.html %}
{% include cards/profile-2.html %}
{% include cards/profile-edit.html %}
</div>
<div class="col-lg-8">
{% include cards/profile-timeline.html %}
{% include cards/profile-edit-big.html %}
</div>
<div class="row">
<div class="col-lg-4">
{% include cards/profile.html %}
{% include cards/profile-2.html %}
{% include cards/profile-edit.html %}
</div>
<div class="col-lg-8">
{% include cards/profile-timeline.html %}
{% include cards/profile-edit-big.html %}
</div>
</div>
......@@ -7,24 +7,24 @@ done: true
{% assign col-class = "col-sm-6 col-lg-4 col-xl-3" %}
<div class="row">
<div class="{{ col-class }}">{% include_cached cards/ribbon.html %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html top=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html top=true left=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bottom=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html left=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html left=true bottom=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true bottom=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true left=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true left=true bottom=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html color="red" %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html color="green" bottom=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true color="teal" left=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true color="yellow" left=true bottom=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true color="pink" left=true top=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true color="purple" top=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true color="teal-lt" left=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true color="yellow-lt" left=true bottom=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true color="pink-lt" left=true top=true %}</div>
<div class="{{ col-class }}">{% include_cached cards/ribbon.html bookmark=true color="purple-lt" top=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html top=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html top=true left=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bottom=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html left=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html left=true bottom=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true bottom=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true left=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true left=true bottom=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html color="red" %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html color="green" bottom=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true color="teal" left=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true color="yellow" left=true bottom=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true color="pink" left=true top=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true color="purple" top=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true color="teal-lt" left=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true color="yellow-lt" left=true bottom=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true color="pink-lt" left=true top=true %}</div>
<div class="{{ col-class }}">{% include cards/ribbon.html bookmark=true color="purple-lt" top=true %}</div>
</div>
---
layout: none
---
<?xml version="1.0" encoding="UTF-8"?>
{% if page.xsl %}
<?xml-stylesheet type="text/xsl" href="{{ "/sitemap.xsl" | absolute_url }}"?>
{% endif %}
<urlset xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd" xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
{% assign collections = site.collections | where_exp:'collection','collection.output != false' %}
{% for collection in collections %}
{% assign docs = collection.docs | where_exp:'doc','doc.sitemap != false' %}
{% for doc in docs %}
<url>
<loc>{{ doc.url | replace:'/index.html','/' | absolute_url | xml_escape }}</loc>
{% if doc.last_modified_at or doc.date %}
<lastmod>{{ doc.last_modified_at | default: doc.date | date_to_xmlschema }}</lastmod>
{% endif %}
</url>
{% endfor %}
{% endfor %}
{% assign pages = site.html_pages | where_exp:'doc','doc.sitemap != false' | where_exp:'doc','doc.url != "/404.html"' %}
{% for page in pages %}
<url>
<loc>{{ page.url | replace:'/index.html','/' | absolute_url | xml_escape }}</loc>
{% if page.last_modified_at %}
<lastmod>{{ page.last_modified_at | date_to_xmlschema }}</lastmod>
{% endif %}
</url>
{% endfor %}
{% assign static_files = page.static_files | where_exp:'page','page.sitemap != false' | where_exp:'page','page.name != "404.html"' %}
{% for file in static_files %}
<url>
<loc>{{ file.path | replace:'/index.html','/' | absolute_url | xml_escape }}</loc>
<lastmod>{{ file.modified_time | date_to_xmlschema }}</lastmod>
</url>
{% endfor %}
</urlset>
......@@ -26,25 +26,25 @@ page-title: Tabler licence
<h4>Permissions</h4>
<ul class="list-unstyled">
<li>{% include_cached ui/icon.html icon="check" class="text-green" %} Commercial use</li>
<li>{% include_cached ui/icon.html icon="check" class="text-green" %} Modification</li>
<li>{% include_cached ui/icon.html icon="check" class="text-green" %} Distribution</li>
<li>{% include_cached ui/icon.html icon="check" class="text-green" %} Private use</li>
<li>{% include ui/icon.html icon="check" class="text-green" %} Commercial use</li>
<li>{% include ui/icon.html icon="check" class="text-green" %} Modification</li>
<li>{% include ui/icon.html icon="check" class="text-green" %} Distribution</li>
<li>{% include ui/icon.html icon="check" class="text-green" %} Private use</li>
</ul>
</div>
<div class="col-md">
<h4>Limitations</h4>
<ul class="list-unstyled">
<li>{% include_cached ui/icon.html icon="x" class="text-red" %} Liability</li>
<li>{% include_cached ui/icon.html icon="x" class="text-red" %} Warranty</li>
<li>{% include ui/icon.html icon="x" class="text-red" %} Liability</li>
<li>{% include ui/icon.html icon="x" class="text-red" %} Warranty</li>
</ul>
</div>
<div class="col-md">
<h4>Conditions</h4>
<ul class="list-unstyled">
<li>{% include_cached ui/icon.html icon="info" class="text-blue" %} License and copyright notice</li>
<li>{% include ui/icon.html icon="info" class="text-blue" %} License and copyright notice</li>
</ul>
</div>
</div>
......@@ -52,4 +52,4 @@ page-title: Tabler licence
<div class="card-footer">
This is not legal advice. <a href="https://help.github.com/articles/licensing-a-repository/#disclaimer" target="_blank">Learn more about repository licenses.</a>
</div>
</div>
\ No newline at end of file
</div>
---
tmp: true
menu: a.c.d
---
<div class="card">
<div class="card-header">
<h2 class="card-title">CountUp</h2>
......@@ -36,4 +34,25 @@ menu: a.c.d
</div>
</div>
</div>
</div>
\ No newline at end of file
</div>
<div class="mb-3">
<label class="form-label">Tags</label>
{% include ui/form/selectize.html key="tags" %}
</div>
<div class="mb-3">
<label class="form-label">Top person</label>
{% include ui/form/selectize.html key="users" %}
</div>
<div class="mb-3">
<label class="form-label">Users list</label>
{% include ui/form/selectize.html key="people" %}
</div>
<div class="mb-3">
<label class="form-label">Countries</label>
{% include ui/form/selectize.html key="countries" %}
</div>
......@@ -40,8 +40,8 @@ menu: base.users
</div>
<div class="col-auto">
<div class="btn-list">
{% include_cached ui/button.html text="Chat" color="secondary" size="sm" %}
{% include_cached ui/button.html text="Profile" color="secondary" size="sm" %}
{% include ui/button.html text="Chat" color="secondary" size="sm" %}
{% include ui/button.html text="Profile" color="secondary" size="sm" %}
</div>
</div>
</div>
......@@ -52,5 +52,5 @@ menu: base.users
</div>
<div class="d-flex">
{% include parts/pagination.html class="ml-auto" %}
{% include ui/pagination.html class="ml-auto" %}
</div>
......@@ -18,20 +18,23 @@ $icon-fonts: () !default;
// COLORS
$theme-color-interval: 10% !default;
$light-black: rgba(0, 0, 0, .4) !default;
$light-white: rgba(255, 255, 255, .4) !default;
$min-black: rgba(135, 150, 165, .032) !default;
$min-white: rgba(255, 255, 255, .032) !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #dee2e6 !default;
$gray-400: #ced4da !default;
$gray-500: #adb5bd !default;
$gray-600: #868e96 !default;
$gray-700: #495057 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$light: #f5f7fb !default;
$dark: #354052 !default;
$light-black: rgba($dark, .4) !default;
$light-white: rgba($light, .4) !default;
$min-black: rgba($dark, .02) !default;
$min-white: rgba($light, .02) !default;
$gray-100: $light !default;
$gray-200: mix($light, $dark, 98%) !default;
$gray-300: mix($light, $dark, 94%) !default;
$gray-400: mix($light, $dark, 88%) !default;
$gray-500: mix($light, $dark, 79%) !default;
$gray-600: mix($light, $dark, 63%) !default;
$gray-700: mix($light, $dark, 45%) !default;
$gray-800: mix($light, $dark, 22%) !default;
$gray-900: $dark !default;
$blue: #206bc4 !default;
$azure: #45aaf2 !default;
......@@ -49,23 +52,18 @@ $black: #000000 !default;
$white: #ffffff !default;
$primary: $blue !default;
$secondary: $white !default;
$secondary: $gray-800 !default;
$success: $green !default;
$info: $azure !default;
$warning: $yellow !default;
$danger: $red !default;
$light: #f5f7fb !default;
$dark: #354052 !default;
$body-bg: $light !default;
$body-color: $dark !default;
$text-muted: #8a91a5 !default;
$border-color: #dce3e9 !default;
$border-color-alpha: rgba(138, 160, 180, .3) !default;
$hover-bg: rgba(138, 160, 180, 0.1) !default;
$text-muted: $gray-700 !default;
$border-color: $gray-400 !default;
$hover-bg: $gray-200 !default;
$social-colors: (
"facebook": #3b5998,
......@@ -104,6 +102,7 @@ $colors: (
) !default;
$avatar-sizes: (
"xs": 1.5rem,
"sm": 2rem,
"md": 3rem,
"lg": 4.5rem,
......@@ -202,6 +201,7 @@ $badge-font-weight: $font-weight-bold !default;
$badge-empty-size: .5rem !default;
//buttons
$input-color: $body-color !default;
$input-btn-line-height: (22/15) !default;
$input-btn-font-size: $font-size-base !default;
......@@ -218,11 +218,11 @@ $input-height-sm: null !default;
$input-height-lg: null !default;
$btn-padding-x: 1rem !default;
$btn-font-weight: $font-weight-bold !default;
$btn-font-weight: 500 !default;
$btn-border-radius: 3px !default;
//cards
$card-border-color: $border-color-alpha !default;
$card-border-color: $border-color !default;
$card-border-radius: $border-radius !default;
$card-cap-bg: $min-black !default;
......@@ -240,7 +240,7 @@ $close-font-size: 1.5rem !default;
//dropdown
$dropdown-item-padding-x: 1rem !default;
$dropdown-font-size: $h4-font-size !default;
$dropdown-divider-bg: $border-color-alpha !default;
$dropdown-divider-bg: $border-color !default;
$dropdown-padding-y: .5rem !default;
$dropdown-link-hover-bg: $hover-bg !default;
$dropdown-link-hover-color: inherit !default;
......@@ -255,7 +255,7 @@ $loader-size: 2.5rem !default;
//navbar
$navbar-bg: $white !default;
$navbar-height: 3.5rem !default;
$navbar-border-color: $border-color-alpha !default;
$navbar-border-color: $border-color !default;
//nav
$nav-link-padding-y: 1rem !default;
......@@ -277,7 +277,6 @@ $pagination-disabled-bg: transparent !default;
$pagination-disabled-color: rgba($text-muted, .5) !default;
//steps
$steps-border-width: 2px !default;
$steps-color-inactive: #f3f5f5 !default;
......
//sidenav
$sidenav-width: 16.25rem;
$sidenav-width: 16rem;
$sidenav-width-folded: 4rem;
$sidenav-bg: $white;
$sidenav-border-color: $border-color-alpha;
$sidenav-border-color: $border-color;
$sidenav-dark-bg: $dark;
$sidenav-padding: 1.25rem;
$sidenav-breakpoint-show: 'sm';
......
.btn-secondary {
@include button-variant($secondary, $border-color, $body-color);
@include button-variant($white, $border-color, $secondary);
}
.btn {
......
......@@ -185,6 +185,10 @@
> :last-child {
margin-bottom: 0;
}
& + & {
border-top: 1px solid $border-color;
}
}
.card-body-scrollable {
......@@ -340,7 +344,6 @@ Card list group
.list-group-item {
padding-right: $card-spacer-x;
padding-left: $card-spacer-x;
border-right: 0;
border-left: 0;
......
......@@ -12,7 +12,7 @@
.list-bordered {
.list-item {
border-top: 1px solid $border-color-alpha;
border-top: 1px solid $border-color;
margin-top: -1px;
&:first-child {
......
......@@ -20,7 +20,7 @@ Color Input
width: 1.5rem;
height: 1.5rem;
color: #fff;
border: 1px solid $border-color-alpha;
border: 1px solid $border-color;
border-radius: 3px;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
......
......@@ -18,7 +18,7 @@ Image check
display: flex;
margin: 0;
user-select: none;
border: 1px solid $border-color-alpha;
border: 1px solid $border-color;
border-radius: 3px;
.imagecheck-input:focus ~ & {
......@@ -27,7 +27,7 @@ Image check
}
.imagecheck-input:checked ~ & {
border-color: $border-color-alpha;
border-color: $border-color;
}
&::before {
......
.selectize-control {
padding: 0;
border: 0;
&.multi .selectize-input > div {
font-size: $h5-font-size;
margin: 0 8px 2px 0;
padding: 2px 8px;
border-radius: $border-radius;
background-color: $gray-200;
color: inherit;
}
}
.selectize-input {
display: flex !important;
height: 100%;
border: 1px solid $border-color;
padding: $input-padding-y $input-padding-x;
font-size: $input-font-size;
......
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M22.146 9.227a1.478 1.478 0 1 0-2.956.002v6.19c0 .81.663 1.48 1.483 1.48.814 0 1.476-.67 1.476-1.48v-6.2h-.01zM5.393 8.032l.004 9.6c0 .885.704 1.59 1.573 1.59h1.063v3.28c0 .82.66 1.482 1.47 1.482s1.467-.66 1.48-1.468v-3.28h1.993v3.28a1.475 1.475 0 1 0 2.952-.007v-3.28h1.078c.87 0 1.573-.71 1.573-1.578v-9.63L5.35 8.03l.04.002zm9.648-2.93a.56.56 0 1 1-.002-1.118.56.56 0 0 1 .002 1.118m-6.06 0a.56.56 0 1 1 .56-.548.565.565 0 0 1-.57.567m6.29-2.9L16.29.33c.06-.105.014-.226-.076-.285a.219.219 0 0 0-.284.09l-1.05 1.9c-.868-.405-1.856-.63-2.89-.63s-2.018.215-2.892.603L8.064.105a.205.205 0 0 0-.278-.08c-.1.045-.136.18-.08.27l1.03 1.875c-2.03 1.047-3.4 3.04-3.4 5.33h13.328c0-2.29-1.368-4.283-3.396-5.33M3.33 7.742c-.817 0-1.48.665-1.48 1.483v6.192a1.48 1.48 0 0 0 2.961 0v-6.19c0-.815-.66-1.478-1.47-1.478"/>
</svg>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M7.078 23.55a5.378 5.378 0 0 1-1.244-1.15c-.383-.463-.738-.95-1.064-1.454a14.065 14.065 0 0 1-1.78-3.636c-.5-1.502-.743-2.94-.743-4.347 0-1.57.34-2.94 1.002-4.09a5.78 5.78 0 0 1 2.1-2.182 5.6 5.6 0 0 1 2.84-.84c.35 0 .73.05 1.13.15.29.08.64.21 1.07.37.55.21.85.34.95.37.32.12.59.17.8.17.16 0 .39-.05.645-.13.145-.05.42-.14.81-.31.386-.14.692-.26.935-.35.37-.11.728-.21 1.05-.26.39-.06.777-.08 1.148-.05.71.05 1.36.2 1.94.42 1.02.41 1.843 1.05 2.457 1.96-.26.16-.5.346-.725.55-.487.43-.9.94-1.23 1.505a5.1 5.1 0 0 0-.644 2.52c.015 1.083.29 2.035.84 2.86a5.33 5.33 0 0 0 1.534 1.536c.31.21.582.355.84.45-.12.375-.252.74-.405 1.1-.347.807-.76 1.58-1.25 2.31-.432.63-.772 1.1-1.03 1.41-.402.48-.79.84-1.18 1.097-.43.285-.935.436-1.452.436-.35.015-.7-.03-1.034-.127-.29-.095-.576-.202-.856-.323a6.94 6.94 0 0 0-.905-.34 4.52 4.52 0 0 0-1.164-.147c-.4 0-.79.05-1.16.145-.31.088-.61.196-.907.325-.42.175-.695.29-.855.34a4.47 4.47 0 0 1-.99.175c-.52 0-1.004-.15-1.486-.45zm6.854-18.46c-.68.34-1.326.484-1.973.436-.1-.646 0-1.31.27-2.037.24-.62.56-1.18 1-1.68.46-.52 1.01-.95 1.63-1.26.66-.34 1.29-.52 1.89-.55.08.68 0 1.35-.25 2.07a5.938 5.938 0 0 1-1 1.76c-.435.52-.975.95-1.586 1.26z"/>
</svg>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M18.78 12.653a5.22 5.22 0 1 0 0 10.44 5.22 5.22 0 0 0 0-10.44zm-13.56 0a5.22 5.22 0 1 0 .001 10.439 5.22 5.22 0 0 0-.001-10.439zm12-6.525a5.22 5.22 0 1 1-10.44 0 5.22 5.22 0 0 1 10.44 0z"/>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M19.31 23.957h-3.6a1.26 1.26 0 0 1-1.312-.792c-1.332-2.665-2.78-5.288-3.987-8.046a15.25 15.25 0 0 1 .885-14.47c.166-.281.52-.625.791-.625s.593.375.74.666q5.444 10.89 10.898 21.788c.542 1.041.292 1.468-.905 1.479zm-14.573 0H1.04c-1.041 0-1.27-.417-.812-1.333q2.8-5.538 5.549-11.055c.5-1.041.895-1.041 1.592-.177a12.221 12.221 0 0 1 2.51 11.17c-.344 1.322-.532 1.405-1.864 1.405z"/>
</svg>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M12 2C5.54 2 .48 10.22 0 17.16 2.028 20.68 6.915 22 12 22s9.975-1.32 12-4.84C23.52 10.218 18.46 2 12 2zm.15 18.4c-9.54 0-10.456-4.034-10.456-4.034l.18-.976S4.5 9.72 6.15 9.72s2.34 2.34 3.69 2.34 4.274-5.19 5.324-5.19c1.047 0 2.82 1.95 4.27 3.75 1.45 1.802 2.878 4.887 2.878 4.887l-.008.034.15.886S21.688 20.4 12.148 20.4z"/>
</svg>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M6.938 4.503c.702 0 1.34.06 1.92.188.577.13 1.07.33 1.485.61.41.28.733.65.96 1.12.225.47.34 1.05.34 1.73 0 .74-.17 1.36-.507 1.86-.338.5-.837.9-1.502 1.22.906.26 1.576.72 2.022 1.37.448.66.665 1.45.665 2.36 0 .75-.13 1.39-.41 1.93-.28.55-.67 1-1.16 1.35-.48.348-1.05.6-1.67.767a7.316 7.316 0 0 1-1.91.254H0V4.51h6.938v-.007zM16.94 16.665c.44.428 1.073.643 1.894.643.59 0 1.1-.148 1.53-.447.424-.29.68-.61.78-.94h2.588c-.403 1.28-1.048 2.2-1.9 2.75-.85.56-1.884.83-3.08.83-.837 0-1.584-.13-2.272-.4a4.948 4.948 0 0 1-1.72-1.14 5.1 5.1 0 0 1-1.077-1.77c-.253-.69-.373-1.45-.373-2.27 0-.803.135-1.54.403-2.23.27-.7.644-1.28 1.12-1.79.495-.51 1.063-.895 1.736-1.194s1.4-.433 2.22-.433c.91 0 1.69.164 2.38.523a4.8 4.8 0 0 1 1.66 1.4c.44.586.75 1.26.94 2.02.19.75.25 1.54.21 2.38h-7.69c0 .84.28 1.632.71 2.065l-.08.03zm-10.24.05c.317 0 .62-.03.906-.093.29-.06.548-.165.763-.3.21-.135.39-.328.52-.583.13-.24.19-.57.19-.96 0-.75-.22-1.29-.64-1.62-.43-.32-.99-.48-1.69-.48H3.24v4.05H6.7v-.03zm13.607-5.65c-.352-.385-.94-.592-1.657-.592-.468 0-.855.074-1.166.238-.302.15-.55.35-.74.59-.19.24-.317.48-.392.75-.075.26-.12.5-.135.71h4.762c-.07-.75-.33-1.3-.68-1.69v.01zM6.52 10.45c.574 0 1.05-.134 1.425-.412.374-.27.554-.72.554-1.338 0-.344-.07-.625-.18-.846-.13-.22-.3-.39-.5-.512-.21-.124-.45-.21-.72-.257a4.426 4.426 0 0 0-.84-.074H3.23v3.44h3.29zm9.098-4.958h5.968v1.454h-5.968V5.48v.01z"/>
</svg>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M3.605 0L8.4 1.686V18.56l6.753-3.895-3.31-1.555-2.09-5.2 10.64 3.738v5.435L8.403 24l-4.797-2.67V0z"/>
</svg>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M.778 1.211a.768.768 0 0 0-.768.892l3.263 19.811c.084.499.515.867 1.022.872H19.95a.772.772 0 0 0 .77-.646l3.27-20.03a.768.768 0 0 0-.768-.891L.778 1.211zM14.52 15.528H9.522L8.17 8.464h7.561l-1.211 7.064z"/>
</svg>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M23.638 14.904c-1.602 6.43-8.113 10.34-14.542 8.736C2.67 22.05-1.244 15.525.362 9.105 1.962 2.67 8.475-1.243 14.9.358c6.43 1.605 10.342 8.115 8.738 14.548v-.002zm-6.35-4.613c.24-1.59-.974-2.45-2.64-3.03l.54-2.153-1.315-.33-.525 2.107c-.345-.087-.705-.167-1.064-.25l.526-2.127-1.32-.33-.54 2.165c-.285-.067-.565-.132-.84-.2l-1.815-.45-.35 1.407s.975.225.955.236c.535.136.63.486.615.766l-1.477 5.92c-.075.166-.24.406-.614.314.015.02-.96-.24-.96-.24l-.66 1.51 1.71.426.93.242-.54 2.19 1.32.327.54-2.17c.36.1.705.19 1.05.273l-.51 2.154 1.32.33.545-2.19c2.24.427 3.93.257 4.64-1.774.57-1.637-.03-2.58-1.217-3.196.854-.193 1.5-.76 1.68-1.93h.01zm-3.01 4.22c-.404 1.64-3.157.75-4.05.53l.72-2.9c.896.23 3.757.67 3.33 2.37zm.41-4.24c-.37 1.49-2.662.735-3.405.55l.654-2.64c.744.18 3.137.524 2.75 2.084v.006z"/>
</svg>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M21.976 24H2.026C.9 24 0 23.1 0 21.976V2.026C0 .9.9 0 2.025 0H22.05C23.1 0 24 .9 24 2.025v19.95C24 23.1 23.1 24 21.976 24zM12 3.975H9A5.025 5.025 0 0 0 3.975 9v6A5.025 5.025 0 0 0 9 20.024h6A5.025 5.025 0 0 0 20.024 15v-3.975c0-.6-.45-1.05-1.05-1.05H18a.995.995 0 0 1-.976-.976A5.025 5.025 0 0 0 12 3.973zm3.074 12H9c-.525 0-.975-.45-.975-.975s.45-.976.975-.976h6.074c.526 0 .977.45.977.976s-.45.976-.975.976zm-2.55-7.95c.527 0 .976.45.976.975s-.45.975-.975.975h-3.6c-.525 0-.976-.45-.976-.975s.45-.975.975-.975h3.6z"/>
</svg>
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册