mirror of
https://github.com/tabler/tabler.git
synced 2026-07-12 16:44:21 +04:00
Bartosz-Do
66 lines
2.3 KiB
HTML
66 lines
2.3 KiB
HTML
{% assign chart-type = include.chart-type | default: 'line' %}
|
|
{% assign chart-position = include.chart-position | default: 'right' %}
|
|
{% assign chart-color = include.color | default: 'primary' %}
|
|
|
|
<div class="card card-sm{% if include.class %} {{ include.class }}{% endif %}">
|
|
<div class="card-body p-3">
|
|
<div class="row align-items-center">
|
|
{% if include.icon %}
|
|
<div class="col-auto">
|
|
<span
|
|
class="{% if include.color %}bg-{{ include.color }}{% if include.lt %}-lt{% else %} text-white{% endif %}{% endif %} avatar avatar-square">{%
|
|
include "ui/icon.html" icon=include.icon %}</span>
|
|
</div>
|
|
{% elsif include.person-id %}
|
|
<div class="col-auto">
|
|
{% include "ui/avatar.html" person-id=include.person-id %}
|
|
</div>
|
|
{% elsif include.chart-data and chart-position == "left" %}
|
|
<div class="col-auto">
|
|
{% include "ui/chart-sparkline.html" id=include.id data=include.chart-data type=chart-type
|
|
color=include.color label=include.chart-label label-icon=include.chart-label-icon %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
|
|
<div class="col">
|
|
<div class="subheader">
|
|
{{ include.title | default: 1700 }}
|
|
{% if include.small-icon %}
|
|
{% include "ui/icon.html" icon=include.small-icon color=include.color class="icon-sm ms-1" %}
|
|
{% endif %}
|
|
{% if include.description-value %}
|
|
<span class="float-end fw-medium text-{{ include.description-value-color | default: 'green' }}">{{
|
|
include.description-value }}</span>
|
|
{% endif %}
|
|
</div>
|
|
<div class="h3 m-0 p-0">
|
|
{{ include.description | default: "Users" }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
{% include "ui/trending.html" value=include.change-value unit=include.change-value-unit %}
|
|
</div>
|
|
|
|
{% if include.chart-data and chart-position=="right" %}
|
|
<div class="col-auto">
|
|
{% include "ui/chart-sparkline.html" id=include.id data=include.chart-data type=chart-type color=chart-color
|
|
label=include.chart-label label-icon=include.chart-label-icon %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if include.trending %}
|
|
<div class="col-auto">
|
|
{% include "ui/trending.html" value=include.trending %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if include.button %}
|
|
<div class="col-auto">
|
|
{% include "ui/button.html" text=include.button size="sm" %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div> |