Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Dashboards
Tabler
提交
004cf028
T
Tabler
项目概览
Dashboards
/
Tabler
10 个月 前同步成功
通知
0
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
T
Tabler
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
004cf028
编写于
12月 20, 2019
作者:
C
codecalm
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
remove `tabler-charts.js`, peity charts, apexcharts
上级
b83202d7
变更
23
隐藏空白更改
内联
并排
Showing
23 changed file
with
217 addition
and
385 deletion
+217
-385
.editorconfig
.editorconfig
+2
-1
build/rollup.config.js
build/rollup.config.js
+1
-1
js/tabler-charts.js
js/tabler-charts.js
+0
-173
package.json
package.json
+0
-8
pages/_data/libs.json
pages/_data/libs.json
+1
-1
pages/_includes/cards/small-stats.html
pages/_includes/cards/small-stats.html
+26
-32
pages/_includes/cards/subscribe.html
pages/_includes/cards/subscribe.html
+31
-31
pages/_includes/cards/user-card.html
pages/_includes/cards/user-card.html
+9
-7
pages/_includes/layout/css.html
pages/_includes/layout/css.html
+0
-1
pages/_includes/layout/js.html
pages/_includes/layout/js.html
+0
-3
pages/_includes/layout/navbar.html
pages/_includes/layout/navbar.html
+1
-1
pages/_includes/ui/avatar.html
pages/_includes/ui/avatar.html
+12
-12
pages/_includes/ui/chart.html
pages/_includes/ui/chart.html
+1
-1
pages/_includes/ui/sparkline.html
pages/_includes/ui/sparkline.html
+20
-16
pages/snippets.html
pages/snippets.html
+72
-54
pages/tmp.html
pages/tmp.html
+4
-1
scss/_debug.scss
scss/_debug.scss
+1
-1
scss/_utilities.scss
scss/_utilities.scss
+1
-1
scss/_variables.scss
scss/_variables.scss
+2
-2
scss/tabler.scss
scss/tabler.scss
+0
-1
scss/ui/_avatars.scss
scss/ui/_avatars.scss
+3
-3
scss/ui/_charts.scss
scss/ui/_charts.scss
+30
-3
scss/vendor/_sparkline.scss
scss/vendor/_sparkline.scss
+0
-31
未找到文件。
.editorconfig
浏览文件 @
004cf028
...
...
@@ -3,7 +3,7 @@ charset=utf-8
end_of_line=lf
insert_final_newline=true
indent_style=tab
indent_size
=3
tab_width
=3
max_line_length=off
[*.svg]
...
...
@@ -13,6 +13,7 @@ tab_width=3
[*.html]
indent_style=tab
indent_size=3
tab_width=3
insert_final_newline=false
[*.md]
...
...
build/rollup.config.js
浏览文件 @
004cf028
...
...
@@ -38,7 +38,7 @@ module.exports = {
context
:
"
window
"
,
input
:
{
tabler
:
path
.
resolve
(
__dirname
,
'
../js/tabler.js
'
),
'
tabler-charts
'
:
path
.
resolve
(
__dirname
,
'
../js/tabler-charts.js
'
),
//
'tabler-charts': path.resolve(__dirname, '../js/tabler-charts.js'),
},
output
:
{
banner
,
...
...
js/tabler-charts.js
已删除
100644 → 0
浏览文件 @
b83202d7
(
function
(
$
)
{
$
(
document
).
ready
(
function
()
{
$
().
peity
&&
$
(
'
[data-spark]
'
).
each
(
function
()
{
const
$this
=
$
(
this
),
data
=
$this
.
attr
(
'
data-spark
'
),
color
=
$this
.
attr
(
'
data-spark-color
'
)
||
'
blue
'
,
bgColor
=
$this
.
attr
(
'
data-spark-color-bg
'
)
||
'
blue-100
'
,
type
=
$this
.
attr
(
'
data-spark-type
'
)
||
'
line
'
;
const
$div
=
$
(
'
<div/>
'
).
html
(
data
);
$this
.
append
(
$div
);
let
fillColor
;
if
(
type
===
'
donut
'
||
type
===
'
pie
'
)
{
fillColor
=
[
color
,
bgColor
];
}
else
if
(
type
===
'
bar
'
)
{
fillColor
=
[
color
];
}
else
if
(
type
===
'
line
'
)
{
fillColor
=
bgColor
;
}
$div
.
peity
(
type
,
{
width
:
$this
.
width
(),
height
:
$this
.
height
(),
// max: 100,
// min: 0,
stroke
:
color
,
strokeWidth
:
2
,
fill
:
fillColor
,
padding
:
0.2
,
innerRadius
:
type
===
'
donut
'
?
17
:
0
,
});
});
});
})(
jQuery
);
/*
charts default configuration
*/
if
(
window
.
Apex
)
{
// const borderColor = 'rgba(0, 0, 0, 0.09)';
// const mutedColor = '#888e9a';
// window.Apex = {
// chart: {
// // fontFamily: 'inherit',
// // foreColor: 'currentColor',
// toolbar: {
// show: false,
// },
// zoom: {
// enabled: false,
// },
// animations: {
// enabled: false,
// },
// },
//
// grid: {
// show: true,
// borderColor: borderColor,
// padding: {
// right: 0,
// bottom: 0,
// left: 0,
// top: 0,
// },
// },
//
// dataLabels: {
// enabled: false,
// dropShadow: {
// enabled: false,
// },
// },
//
// plotOptions: {
// pie: {
// customScale: 1,
// expandOnClick: false,
// dataLabels: {
// minAngleToShowLabel: 10,
// },
// donut: {
// size: '80%'
// }
// },
// },
//
// stroke: {
// width: 2,
// curve: 'smooth',
// lineCap: "round",
// },
//
// fill: {
// type: 'solid',
// opacity: 1,
// },
//
// markers: {
// size: 0,
// strokeWidth: 1,
// radius: 2,
// hover: {
// size: 4,
// },
// },
//
// legend: {
// show: true,
// fontSize: '14px',
// markers: {
// width: 8,
// height: 8,
// },
// itemMargin: {
// horizontal: 0,
// vertical: 8,
// },
// },
//
// title: {
// margin: 0,
// floating: true,
// offsetX: 10,
// style: {
// fontSize: '18px',
// },
// },
//
// subtitle: {
// margin: 0,
// },
//
// tooltip: {
// fillSeriesColor: false,
// },
// xaxis: {
// labels: {
// style: {
// colors: mutedColor,
// fontSize: '12px',
// },
// datetimeFormatter: {
// year: 'yyyy',
// month: 'MMM \'yy',
// day: 'd MMM',
// hour: 'HH:mm'
// }
// },
// tooltip: {
// enabled: false,
// },
// axisBorder: {
// color: borderColor,
// height: 0,
// },
// axisTicks: {
// show: true,
// height: 4,
// color: borderColor,
// },
// },
//
// yaxis: {
// show: true,
// },
// };
}
package.json
浏览文件 @
004cf028
...
...
@@ -125,14 +125,6 @@
"path"
:
"./dist/css/tabler.min.css"
,
"maxSize"
:
"45 kB"
},
{
"path"
:
"./dist/css/tabler-charts.css"
,
"maxSize"
:
"2 kB"
},
{
"path"
:
"./dist/css/tabler-charts.min.css"
,
"maxSize"
:
"2 kB"
},
{
"path"
:
"./dist/css/tabler-flags.css"
,
"maxSize"
:
"2 kB"
...
...
pages/_data/libs.json
浏览文件 @
004cf028
...
...
@@ -3,7 +3,7 @@
"jquery"
,
"bootstrap"
],
"js"
:
{
"jquery"
:
"jquery/dist/jquery.min.js"
,
"jquery"
:
"jquery/dist/jquery.
slim.
min.js"
,
"bootstrap"
:
"bootstrap/dist/js/bootstrap.bundle.min.js"
,
"autosize"
:
"autosize/dist/autosize.min.js"
,
"imask"
:
"imask/dist/imask.min.js"
,
...
...
pages/_includes/cards/small-stats.html
浏览文件 @
004cf028
{% assign chart-type = include.chart-type | default: 'line' %}
{% assign chart-position = include.chart-position | default: 'right' %}
<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>
{% elsif include.person-id %}
{% include ui/avatar.html person-id=include.person-id class="mr-3 rounded" %}
{% endif %}
<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>
{% elsif include.person-id %}
{% include ui/avatar.html person-id=include.person-id class="mr-3 rounded" %}
{% endif %}
{% if include.chart-data and chart-position==
"left" %}
<div
class=
"mr-3"
>
{% include ui/sparkline.html data=include.chart-data type=chart-type color=include.color label=include.chart-label label-icon=include.chart-label-icon %}
</div>
{% endif %}
{% if include.chart-data and chart-position ==
"left" %}
<div
class=
"mr-3"
>
{% include ui/sparkline.html data=include.chart-data type=chart-type color=include.color label=include.chart-label label-icon=include.chart-label-icon %}
</div>
{% endif %}
<div
class=
"mr-3
"
>
<div
>
<strong>
{{ include.count | default: 1700 | format_number }}
</strong>
{{ include.subtitle }}
{% if include.small-icon %}
{% include_cached ui/icon.html icon=include.small-icon color=include.color class="icon-sm ml-1" %}
{% endif %}
</div>
<div
class=
"text-muted text-h5
"
>
{{ include.description | default: "Users" }}
</div>
</div>
<div
class=
"mr-3 leading-tight
"
>
<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" %}
{% endif %}
</div>
<div
class=
"text-muted
"
>
{{ include.description | default: "Users" }}
</div>
</div>
{% if include.second-icon %}
<div
class=
"ml-auto"
>
{% include_cached ui/icon.html icon=include.second-icon color=include.color class="icon-lg icon-thin" %}
</div>
{% endif %}
{% if include.chart-data and chart-position=="right" %}
<div
class=
"ml-auto"
>
{% include ui/sparkline.html data=include.chart-data type=chart-type color=include.color label=include.chart-label label-icon=include.chart-label-icon %}
</div>
{% endif %}
</div>
{% if include.chart-data and chart-position=="right" %}
<div
class=
"ml-auto"
>
{% include ui/sparkline.html data=include.chart-data type=chart-type color=include.color label=include.chart-label label-icon=include.chart-label-icon %}
</div>
{% endif %}
</div>
</div>
pages/_includes/cards/subscribe.html
浏览文件 @
004cf028
{% assign person-id = include.person-id | default: 0 %}
{% assign person = site.data.people[person-id] %}
<div
class=
"card"
>
<div
class=
"card-body"
>
<div
class=
"row row-sm align-items-center"
>
<div
class=
"col-auto"
>
{% include ui/avatar.html person=person size="lg" %}
</div>
<div
class=
"col"
>
<h4
class=
"card-title m-0"
>
<a
href=
"#"
>
{{ person.full_name }}
</a>
</h4>
<div
class=
"text-muted"
>
Working in {{ person.company }}
</div>
<div
class=
"small mt-1"
>
<span
class=
"text-success"
>
●
</span>
Online
</div>
</div>
<div
class=
"col-auto"
>
<a
href=
"#"
class=
"btn btn-sm btn-secondary d-none d-md-inline-block"
>
Subscribe
</a>
</div>
<div
class=
"col-auto"
>
<div
class=
"dropdown"
>
<button
class=
"btn-options"
type=
"button"
data-toggle=
"dropdown"
>
{% include_cached ui/icon.html icon="more-vertical" %}
</button>
{% include_cached ui/dropdown-menu.html right=true %}
</div>
</div>
</div>
</div>
<div
class=
"card-body"
>
<div
class=
"row row-sm align-items-center"
>
<div
class=
"col-auto"
>
{% include ui/avatar.html person=person size="lg" %}
</div>
<div
class=
"col"
>
<h4
class=
"card-title m-0"
>
<a
href=
"#"
>
{{ person.full_name }}
</a>
</h4>
<div
class=
"text-muted"
>
Working in {{ person.company }}
</div>
<div
class=
"small mt-1"
>
<span
class=
"text-success"
>
●
</span>
Online
</div>
</div>
<div
class=
"col-auto"
>
<a
href=
"#"
class=
"btn btn-sm btn-secondary d-none d-md-inline-block"
>
Subscribe
</a>
</div>
<div
class=
"col-auto"
>
<div
class=
"dropdown"
>
<button
class=
"btn-options"
type=
"button"
data-toggle=
"dropdown"
>
{% include_cached ui/icon.html icon="more-vertical" %}
</button>
{% include_cached ui/dropdown-menu.html right=true %}
</div>
</div>
</div>
</div>
</div>
pages/_includes/cards/user-card.html
浏览文件 @
004cf028
{% assign person-id = include.person-id | default: 0 %}
{% assign person = site.data.people[person-id] %}
<a
class=
"card card-link"
href=
"#"
>
<div
class=
"card-body"
>
<div
class=
"float-{% if include.right %}right{% else %}left mr-3{% endif %}"
>
{% include ui/avatar.html person=person %}
</div>
<div
class=
"card-title mb-1"
>
{{ person.full_name }}
</div>
<div
class=
"text-muted"
>
{{ person.job_title }}
</div>
</div>
<div
class=
"card-body"
>
<div
class=
"float-{% if include.right %}right{% else %}left mr-3{% endif %}"
>
{% include ui/avatar.html person=person class="rounded" %}
</div>
<div
class=
"leading-tight"
>
<div
class=
"strong"
>
{{ person.full_name }}
</div>
<div
class=
"text-muted"
>
{{ person.job_title }}
</div>
</div>
</div>
</a>
pages/_includes/layout/css.html
浏览文件 @
004cf028
...
...
@@ -12,4 +12,3 @@
<!-- Tabler Plugins -->
<link
href=
"{{ site.base }}/dist/css/tabler-flags{% if jekyll.environment == 'production' %}.min{% endif %}.css?{{ site.time | date: '%s' }}"
rel=
"stylesheet"
/>
<link
href=
"{{ site.base }}/dist/css/tabler-charts{% if jekyll.environment == 'production' %}.min{% endif %}.css?{{ site.time | date: '%s' }}"
rel=
"stylesheet"
/>
pages/_includes/layout/js.html
浏览文件 @
004cf028
...
...
@@ -11,6 +11,3 @@
<!-- Tabler Core -->
<script
src=
"{{ site.base }}/dist/js/tabler{% if jekyll.environment == 'production' %}.min{% endif %}.js?{{ site.time | date: '%s' }}"
></script>
<!-- Tabler Plugins -->
<script
src=
"{{ site.base }}/dist/js/tabler-charts{% if jekyll.environment == 'production' %}.min{% endif %}.js?{{ site.time | date: '%s' }}"
></script>
pages/_includes/layout/navbar.html
浏览文件 @
004cf028
...
...
@@ -15,7 +15,7 @@
<li
class=
"nav-item dropdown"
>
<a
href=
"#"
data-toggle=
"dropdown"
class=
"nav-link d-flex align-items-center py-0 px-lg-0 px-2 text-reset ml-2"
>
{% include ui/avatar.html src=person.photo %}
{% include ui/avatar.html src=person.photo
size="sm"
%}
<span
class=
"ml-2 d-none d-lg-block leading-none"
>
{{ person.full_name }}
<span
class=
"text-muted d-block mt-1 text-h6"
>
Administrator
</span>
...
...
pages/_includes/ui/avatar.html
浏览文件 @
004cf028
...
...
@@ -2,18 +2,18 @@
{% assign src = include.src %}
{% assign placeholder = include.placeholder %}
{% if include.person-id %}
{% assign person-id = include.person-id | minus: 1 %}
{% assign person = site.data.people[person-id] %}
{% assign src = person.photo %}
{% unless src %}
{% assign placeholder = person.full_name | first_letters %}
{% endunless %}
{% elsif include.person %}
{% assign person = include.person %}
{% assign src = person.photo %}
{% unless src %}
{% assign placeholder = person.full_name | first_letters %}
{% endunless %}
{% assign person-id = include.person-id | minus: 1 %}
{% assign person = site.data.people[person-id] %}
{% assign src = person.photo %}
{% unless src %}
{% assign placeholder = person.full_name | first_letters %}
{% endunless %}
{% elsif include.person %}
{% assign person = include.person %}
{% assign src = person.photo %}
{% unless src %}
{% assign placeholder = person.full_name | first_letters %}
{% endunless %}
{% endif %}
{% assign link = include.link | default: false %}
{% assign el = 'span' %}
...
...
pages/_includes/ui/chart.html
浏览文件 @
004cf028
...
...
@@ -19,7 +19,7 @@
{% capture script %}
<script>
// @formatter:off
document
.
addEventListener
(
"
DOMContentLoaded
"
,
function
(
event
)
{
document
.
addEventListener
(
"
DOMContentLoaded
"
,
function
()
{
{
%
if
jekyll
.
environment
==
'
development
'
%
}
window
.
tabler_chart
=
window
.
tabler_chart
||
{};
{
%
endif
%
}
...
...
pages/_includes/ui/sparkline.html
浏览文件 @
004cf028
{% assign type = include.type %}
{% assign square = false %}
{% if type == "pie" or type == "donut" %}
{% assign square = true %}
{% endif %}
{% assign id = 0 | random_id %}
{% assign color = include.color | default: 'blue' %}
{% append_lib peity %}
<div
class=
"sparkline{% if square %} sparkline-square{% endif %}{% if include.wide %} sparkline-wide{% endif %}"
data-spark=
"{{ include.data }}"
data-spark-type=
"{{ include.type }}"
{%
if
include.color
%}
data-spark-color=
"{{ include.color | default: 'blue' | tabler_color }}"
data-spark-color-bg=
"{{ include.color | tabler_color: '100' }}"
{%
endif
%}
>
{% if include.label %}
<div
class=
"sparkline-label"
>
{{ include.label }}
</div>
{% endif %}
{% if include.label-icon %}
<div
class=
"sparkline-label"
>
{% include_cached ui/icon.html icon=include.label-icon color=include.color %}
</div>
{% endif %}
</div>
<div
class=
"chart-sparkline{% if type == 'pie' %} chart-sparkline-square{% endif %}{% if include.wide %} chart-sparkline-wide{% endif %}"
id=
"sparkline-{{ id }}"
></div>
{% capture_global scripts %}
<script>
document
.
addEventListener
(
"
DOMContentLoaded
"
,
function
()
{
$
().
peity
&&
$
(
'
#sparkline-{{ id }}
'
).
text
(
"
{{ include.data }}
"
).
peity
(
"
{{ type | default: 'bar' }}
"
,
{
width
:
{
%
if
type
==
'
pie
'
%
}
40
{
%
else
%
}
64
{
%
endif
%
},
height
:
40
,
stroke
:
"
{{ color | tabler_color }}
"
,
strokeWidth
:
2
,
fill
:
{
%
if
type
==
'
pie
'
%
}[
"
{{ color | default: 'blue' | tabler_color }}
"
,
"
{{ 'border-color' | tabler_color }}
"
]{
%
elsif
type
==
'
bar
'
%
}[
"
{{ color | tabler_color }}
"
]{
%
else
%
}
"
transparent
"
{
%
endif
%
},
padding
:
.
2
,
innerRadius
:
16
,
});
});
</script>
{% endcapture_global %}
\ No newline at end of file
pages/snippets.html
浏览文件 @
004cf028
...
...
@@ -5,58 +5,76 @@ page-title-right: date
---
<div
class=
"row"
>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card.html person-id=5 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card.html person-id=6 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card.html person-id=7 right=true %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card.html person-id=8 right=true %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-big.html person-id=15 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-big.html person-id=16 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-big.html person-id=17 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-big.html person-id=18 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-bg.html person-id=25 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-bg.html person-id=26 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-bg.html person-id=27 blurred=true %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-bg.html person-id=28 blurred=true %}
</div>
<div
class=
"col-xl-6"
>
{% include cards/subscribe.html person-id=0 %}
</div>
<div
class=
"col-xl-6"
>
{% include cards/subscribe.html person-id=2 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html icon="dollar-sign" color="blue" count=132 subtitle="Sales" description="12 waiting payments" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html icon="shopping-bag" color="green" count=78 subtitle="Orders" description="32 shipped" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html icon="users" color="red" count=1352 subtitle="Members" description="163 registered today" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html icon="message-square" color="yellow" count=132 subtitle="Comments" description="16 waitings" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html chart-position="left" chart-type="donut" chart-data="56/100" color="blue" count=132 subtitle="Sales" description="12 waiting payments" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html chart-position="left" chart-type="donut" chart-data="56/100" color="green" count=78 subtitle="Orders" description="32 shipped" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html chart-position="left" chart-type="pie" chart-data="56/100" color="red" count=1352 subtitle="Members" description="163 registered today" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html chart-position="left" chart-type="pie" chart-data="56/100" color="yellow" count=132 subtitle="Comments" description="16 waitings" %}
</div>
<div
class=
"col-md-6 col-lg-4"
>
{% include cards/small-stats.html chart-type="line" chart-data="20,40,30,40,60,80,100" color="yellow" %}
{% include cards/small-stats.html chart-type="bar" chart-data="20,40,30,40,60,80,70" color="red" icon="heart" %}
{% include cards/small-stats.html chart-type="bar" chart-data="20,40,20,-10,-30,10,40,60,80,70" color="green" icon="github" %}
{% include cards/small-stats.html chart-type="donut" chart-data="12/100" chart-label="12%" person-id=10 %}
{% include cards/small-stats.html chart-type="donut" chart-data="12/100" chart-label-icon="trending-up" person-id=11 %}
{% include cards/small-stats.html chart-type="pie" chart-data="56/100" person-id=1 %}
{% include cards/small-stats.html second-icon="trending-up" color="green" person-id=4 %}
{% include cards/small-stats.html small-icon="trending-down" color="red" person-id=3 %}
{% include cards/code.html %}
</div>
<div
class=
"col-md-6 col-lg-4"
>
{% include cards/small-stats-2.html title="Customers" count="1,950" growth=5.2 color="yellow" %}
{% include cards/small-stats-2.html title="Orders" count="8256" growth=0 color="green" %}
{% include cards/small-stats-2.html title="Revenue" count="$58,924" growth=-3.1 color="red" light=true %}
</div>
<div
class=
"col-md-6 col-lg-4"
>
{% include cards/project-kanban.html title="Tabler UI" badge="v1.0" value=30 percentage-color="red" limit=4 offset=0 due="72 days" %}
{% include cards/project-kanban.html title="Tabler React" value=80 offset=20 %}
{% include cards/user-info.html %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card.html person-id=5 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card.html person-id=6 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card.html person-id=7 right=true %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card.html person-id=8 right=true %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-big.html person-id=15 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-big.html person-id=16 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-big.html person-id=17 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-big.html person-id=18 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-bg.html person-id=25 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-bg.html person-id=26 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-bg.html person-id=27 blurred=true %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/user-card-bg.html person-id=28 blurred=true %}
</div>
<div
class=
"col-xl-6"
>
{% include cards/subscribe.html person-id=0 %}
</div>
<div
class=
"col-xl-6"
>
{% include cards/subscribe.html person-id=2 %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html icon="dollar-sign" color="blue" count=132
subtitle="Sales" description="12 waiting payments" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html icon="shopping-bag" color="green" count=78
subtitle="Orders" description="32 shipped" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html icon="users" color="red" count=1352
subtitle="Members" description="163 registered today" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html icon="message-square" color="yellow" count=132
subtitle="Comments" description="16 waitings" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html chart-position="left" chart-type="pie"
chart-data="56/100" color="blue" count=132 subtitle="Sales" description="12 waiting payments" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html chart-position="left" chart-type="pie"
chart-data="56/100" color="green" count=78 subtitle="Orders" description="32 shipped" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html chart-position="left" chart-type="pie"
chart-data="56/100" color="red" count=1352 subtitle="Members" description="163 registered today" %}
</div>
<div
class=
"col-md-6 col-xl-3"
>
{% include cards/small-stats.html chart-position="left" chart-type="pie"
chart-data="56/100" color="yellow" count=132 subtitle="Comments" description="16 waitings" %}
</div>
<div
class=
"col-md-6 col-lg-4"
>
{% include cards/small-stats.html chart-type="line" chart-data="20,0,40,30,40,30,80,60" %}
{% include cards/small-stats.html chart-type="bar" chart-data="20,40,30,10,40,60,80,70" color="red" icon="heart" %}
{% include cards/small-stats.html chart-type="bar" chart-data="20,40,20,-10,-30,10,40,60,80,70" color="green"
icon="github" %}
{% include cards/small-stats.html chart-type="pie" chart-data="12/100" person-id=10 %}
{% include cards/small-stats.html chart-type="pie" chart-data="12/100" person-id=11 %}
{% include cards/small-stats.html chart-type="pie" chart-data="56/100" person-id=1 %}
{% include cards/small-stats.html color="green" person-id=4 %}
{% include cards/small-stats.html small-icon="trending-down" color="red" person-id=3 %}
{% include cards/code.html %}
</div>
<div
class=
"col-md-6 col-lg-4"
>
{% include cards/small-stats-2.html title="Customers" count="1,950" growth=5.2 color="yellow" %}
{% include cards/small-stats-2.html title="Orders" count="8256" growth=0 color="green" %}
{% include cards/small-stats-2.html title="Revenue" count="$58,924" growth=-3.1 color="red" light=true %}
</div>
<div
class=
"col-md-6 col-lg-4"
>
{% include cards/project-kanban.html title="Tabler UI" badge="v1.0" value=30 percentage-color="red" limit=4 offset=0
due="72 days" %}
{% include cards/project-kanban.html title="Tabler React" value=80 offset=20 %}
{% include cards/user-info.html %}
</div>
</div>
pages/tmp.html
浏览文件 @
004cf028
...
...
@@ -4,7 +4,10 @@ tmp: true
<div
class=
"row"
>
<div
class=
"col-md-6 col-xl-4"
>
{% include cards/small-stats.html chart-position="right" %}
{% include cards/small-stats.html chart-type="bar" chart-data="20,40,30,40,60,80,70" color="red" icon="heart" %}
</div>
<div
class=
"col-md-6 col-xl-4"
>
{% include cards/small-stats.html chart-type="bar" chart-data="5,8,2,5,-1,3,5,3" color="blue" icon="heart" %}
</div>
{% for chart in site.data.charts %}
...
...
scss/_debug.scss
浏览文件 @
004cf028
$debug
:
tru
e
;
$debug
:
fals
e
;
@if
$debug
{
$colors
:
(
"blue"
:
$blue
,
"azure"
:
$azure
,
"indigo"
:
$indigo
,
"purple"
:
$purple
,
"pink"
:
$pink
,
"red"
:
$red
,
"orange"
:
$orange
,
"yellow"
:
$yellow
,
"green"
:
$green
,
"teal"
:
$teal
,
"cyan"
:
$cyan
);
...
...
scss/_utilities.scss
浏览文件 @
004cf028
...
...
@@ -25,7 +25,7 @@ $utilities: (
class
:
leading
,
values
:
(
none
:
1
,
tight
:
1
.
25
,
tight
:
1
.
3333334
,
normal
:
$line-height-base
,
loose
:
2
!
important
,
)
...
...
scss/_variables.scss
浏览文件 @
004cf028
...
...
@@ -104,7 +104,7 @@ $colors: (
)
!
default
;
$avatar-sizes
:
(
"sm"
:
1
.25
rem
,
"sm"
:
2
rem
,
"md"
:
3rem
,
"lg"
:
4
.5rem
,
"xl"
:
6rem
...
...
@@ -228,7 +228,7 @@ $card-status-size: $border-width-wide !default;
$card-group-margin
:
1
.5rem
!
default
;
$card-shadow
:
rgba
(
$dark
,
.04
)
0
2px
4px
0
!
default
;
$card-shadow-hover
:
rgba
(
$dark
,
.
08
)
0
2px
12
px
0
!
default
;
$card-shadow-hover
:
rgba
(
$dark
,
.
16
)
0
2px
16
px
0
!
default
;
//close
$close-font-weight
:
400
!
default
;
...
...
scss/tabler.scss
浏览文件 @
004cf028
...
...
@@ -60,7 +60,6 @@
@import
"vendor/selectize"
;
@import
"vendor/jqvmap"
;
@import
"vendor/apexcharts"
;
@import
"vendor/sparkline"
;
@import
"vendor/fullcalendar"
;
@import
"utils/border"
;
...
...
scss/ui/_avatars.scss
浏览文件 @
004cf028
.avatar
{
position
:
relative
;
display
:
inline-block
;
width
:
2rem
;
height
:
2rem
;
width
:
2
.5rem
;
height
:
2
.5rem
;
line-height
:
2
.5rem
;
font-size
:
.875rem
;
font-weight
:
400
;
line-height
:
2rem
;
color
:
$text-muted
;
text-align
:
center
;
text-transform
:
uppercase
;
...
...
scss/ui/_charts.scss
浏览文件 @
004cf028
...
...
@@ -17,8 +17,35 @@
//outline: 1px solid red;
}
.chart-placeholder
{
background-image
:
linear-gradient
(
135deg
,
$border-color
25%
,
transparent
25%
,
transparent
50%
,
$border-color
50%
,
$border-color
75%
,
transparent
75%
,
transparent
100%
);
background-size
:
14
.14px
14
.14px
;
.chart-sparkline
{
position
:
relative
;
width
:
4rem
;
height
:
2
.5rem
;
line-height
:
1
;
}
.chart-sparkline-square
{
width
:
2
.5rem
;
}
.chart-sparkline-wide
{
width
:
6rem
;
}
.chart-sparkline-label
{
position
:
absolute
;
top
:
0
;
right
:
0
;
bottom
:
0
;
left
:
0
;
display
:
flex
;
align-items
:
center
;
justify-content
:
center
;
font-size
:
$h6-font-size
;
.icon
{
width
:
1rem
;
height
:
1rem
;
}
}
scss/vendor/_sparkline.scss
已删除
100644 → 0
浏览文件 @
b83202d7
.sparkline
{
position
:
relative
;
width
:
4rem
;
height
:
2
.5rem
;
line-height
:
1
;
}
.sparkline-square
{
width
:
2
.5rem
;
}
.sparkline-wide
{
width
:
6rem
;
}
.sparkline-label
{
position
:
absolute
;
top
:
0
;
right
:
0
;
bottom
:
0
;
left
:
0
;
display
:
flex
;
align-items
:
center
;
justify-content
:
center
;
font-size
:
$h6-font-size
;
.icon
{
width
:
1rem
;
height
:
1rem
;
}
}
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录