diff --git a/demo/pc/card.html b/demo/pc/card.html index e7c1b22..c8ad476 100644 --- a/demo/pc/card.html +++ b/demo/pc/card.html @@ -1,157 +1,171 @@
- 卡片A -
-
-
-
-
- -
-
-
-
- 卡片标题 -
-
- 这是卡片说明 -
+ 卡片A +
+
+
+
+
+ +
+
+
+
+ 卡片标题 +
+
+ 这是卡片说明 +
+
+
+
-
-
-
- 银行卡 -
-
-
-
-
- 中国银行 -
-
- 尾号 ********123456 -
+ 银行卡 +
+
+
+
+
+ 中国银行 +
+
+ 尾号 ********123456 +
+
+
+
+
+
+
+ 默认 +
+
+
+
+ 绑定日期:2021-03-15 +
+
+ **宏 +
+
+
-
-
-
-
-
- 默认 -
-
-
-
- 绑定日期:2021-03-15 -
-
- **宏 -
-
-
-
- 详细属性卡片 -
-
-
-
- 意向 - 卡片面板 - - 2021年3月29日 - - + 详细属性卡片 +
+
+
+
+ 意向 + 卡片面板 + + 2021年3月29日 + + +
+
+
+ 入库时间: + 2021年3月29日16:33:21 +
+
+ 用户名称: + 奥古斯宏 +
+
+ 公司名称: + 临沂奥宏网络科技有限公司 +
+
+ 电话: + 13012341234 +
+
+ 相册: + + + + + +
+
+
-
-
- 入库时间: - 2021年3月29日16:33:21 -
-
- 用户名称: - 奥古斯宏 -
-
- 公司名称: - 临沂奥宏网络科技有限公司 -
-
- 电话: - 13012341234 -
-
- 相册: - - - - - -
-
-
-
- 数据卡片 -
-
-
-
- 509778.80 -
-
-
- - 余额 -
-
-
充值
-
提现
-
记录
-
-
-
-
-
- -
- -
-
-
- 盈亏总额(元) + 数据卡片 +
+
+
+
+ 509778.80 +
+
+
+ + 余额 +
+
+
充值
+
提现
+
记录
+
+
-
- 0.00 +
+
+ +
+ +
+
+
+ 盈亏总额(元) +
+
+ 0.00 +
+
+
+
-
-
+
-
-
+
+
+ 0 +
+
+ 余额 +
+ +
+
-
-
- 0 -
-
- 余额 -
-
- -
-
+
+ +
+ 极简图标卡片 +
+
+
+ +
+
+ 图标 +
+
+
\ No newline at end of file diff --git a/source/scss/card/_index.scss b/source/scss/card/_index.scss new file mode 100644 index 0000000..14627ae --- /dev/null +++ b/source/scss/card/_index.scss @@ -0,0 +1 @@ +@import './ul-card-simple-icon'; \ No newline at end of file diff --git a/source/scss/card/_ul-card-simple-icon.scss b/source/scss/card/_ul-card-simple-icon.scss new file mode 100644 index 0000000..e516ad9 --- /dev/null +++ b/source/scss/card/_ul-card-simple-icon.scss @@ -0,0 +1,29 @@ +.ul-card-simple-icon { + display : inline-block; + margin-right : 15px; + margin-bottom : 15px; + box-shadow : 0 2px 12px 0 #bbb; + border-radius : 4px; + border : 1px solid #ebeef5; + background-color: #fff; + box-sizing : border-box; + width : 100px; + padding : 10px; + + text-align: center; + + .ul-card-simple-icon-image { + width : 80px; + height : 80px; + background-size : cover; + background-position: center; + display : inline-block; + } + + .ul-card-simple-icon-title { + border-top : 2px solid #ebeef5; + margin-top : 8px; + padding-top: 8px; + } + +} \ No newline at end of file diff --git a/source/scss/layui-ul.scss b/source/scss/layui-ul.scss index f1e30b3..9baef86 100644 --- a/source/scss/layui-ul.scss +++ b/source/scss/layui-ul.scss @@ -3,6 +3,7 @@ @import './nav/index'; @import './form/index'; @import './fieldset/index'; +@import './card/index'; /* 头部开始 */