From b8570d96a40a7f4e091f4d3f73fd12e3c46b11ef Mon Sep 17 00:00:00 2001
From: augushong <augushong@ulthon.com>
Date: Thu, 14 Apr 2022 21:38:58 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=95=B0=E6=8D=AE=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85=E5=8D=A1=E7=89=87-=E7=AE=80=E7=BA=A6=EF=BC=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 demo/pc/card.html                   | 51 +++++++++++++++++++++++++++++
 source/scss/card/_index.scss        |  3 +-
 source/scss/card/_ul-data-card.scss | 51 +++++++++++++++++++++++++++++
 3 files changed, 104 insertions(+), 1 deletion(-)
 create mode 100644 source/scss/card/_ul-data-card.scss

diff --git a/demo/pc/card.html b/demo/pc/card.html
index cf9752a..61ce22f 100644
--- a/demo/pc/card.html
+++ b/demo/pc/card.html
@@ -347,4 +347,55 @@
 
         </div>
     </div>
+</fieldset>
+
+<fieldset class="layui-elem-field layui-field-title">
+    <legend>数据详情卡片-简约</legend>
+    <div class="layui-field-box">
+        <div class="ul-mobile-box">
+            <div class="ul-data-card">
+                <div class="header">
+                    <div class="mian">
+                        <i class="layui-icon layui-icon-user"></i>
+                        <span>奥古斯宏</span>
+                    </div>
+                    <div class="plus">
+                        <div class="layui-btn layui-btn-sm">详情</div>
+                    </div>
+                </div>
+                <div class="body">
+                    <div class="main">
+                        <div class="item" data-repeat="3">
+                            <div class="item-title">
+                                姓名：
+                            </div>
+                            <div class="item-value">
+                                张三
+                            </div>
+                        </div>
+
+                        <div class="item">
+                            <div class="item-title">
+                                地址：
+                            </div>
+                            <div class="item-value">
+                                内蒙古大兴安岭雷达峰红岸基地
+                            </div>
+                        </div>
+
+                    </div>
+                </div>
+                <div class="footer">
+                    <div class="main">
+                        2022年4月14日21:28:44
+                    </div>
+                    <div class="plus">
+                        <div class="layui-btn layui-btn-sm layui-btn-normal">删除</div>
+                        <div class="layui-btn layui-btn-sm layui-btn-primary">修改</div>
+                    </div>
+                </div>
+
+            </div>
+        </div>
+    </div>
 </fieldset>
\ No newline at end of file
diff --git a/source/scss/card/_index.scss b/source/scss/card/_index.scss
index e1f5a38..0d8b83e 100644
--- a/source/scss/card/_index.scss
+++ b/source/scss/card/_index.scss
@@ -2,4 +2,5 @@
 @import './ul-card-message';
 @import './ul-info-card';
 @import './ul-card-data-simple';
-@import './ul-card-data-simple-bg-black';
\ No newline at end of file
+@import './ul-card-data-simple-bg-black';
+@import './_ul-data-card';
\ No newline at end of file
diff --git a/source/scss/card/_ul-data-card.scss b/source/scss/card/_ul-data-card.scss
new file mode 100644
index 0000000..8aa324a
--- /dev/null
+++ b/source/scss/card/_ul-data-card.scss
@@ -0,0 +1,51 @@
+.ul-data-card {
+    margin       : 15px;
+    padding      : 15px;
+    box-shadow   : 0 0 3px #bbb;
+    border-radius: 5px;
+
+    .header {
+        display        : flex;
+        align-items    : center;
+        justify-content: space-between;
+        padding-bottom : 10px;
+        border-bottom  : 1px solid #eee;
+
+    }
+
+    .body {
+        padding: 10px 0;
+
+        .main {
+            display        : flex;
+            align-items    : flex-start;
+            justify-content: flex-start;
+            flex-wrap      : wrap;
+
+            .item {
+                min-width    : 50%;
+                display      : flex;
+                align-items  : center;
+                margin-bottom: 10px;
+
+                .item-title {
+                    font-size  : 14px;
+                    font-weight: 600;
+                }
+
+                .item-value {
+                    font-size: 14px;
+                }
+            }
+        }
+
+    }
+
+    .footer {
+        border-top     : 1px solid #eee;
+        padding-top    : 10px;
+        display        : flex;
+        justify-content: space-between;
+        align-items    : center
+    }
+}
\ No newline at end of file