From a6e52e4a74f78b112af556dd1e315d00de00a072 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Sun, 17 Jun 2018 12:00:05 +0800
Subject: [PATCH] no message

Former-commit-id: 37c15613f04c755a95d4c0e5b3c86534c5694f7a [formerly f14135211d4d7dd1b3b9ed084aefd794c6f9cdcb] [formerly 37c15613f04c755a95d4c0e5b3c86534c5694f7a [formerly f14135211d4d7dd1b3b9ed084aefd794c6f9cdcb] [formerly 37c15613f04c755a95d4c0e5b3c86534c5694f7a [formerly f14135211d4d7dd1b3b9ed084aefd794c6f9cdcb] [formerly f14135211d4d7dd1b3b9ed084aefd794c6f9cdcb [formerly 347f5301d25da297c101d941af81a67f0a8d7240 [formerly dbde0ddc84a48a2bf821a4d019aa141abf78c676]]]]]
Former-commit-id: c1aff8b6f148067e928f23c48a7e46db8047897f
Former-commit-id: f0ec1a348c262479effc5288c7384b38984915b1
Former-commit-id: dbaf1d11571c2ac62a9710612478004b804baf67 [formerly f8af2ab177e82cecfd1eb61cef519e10b69d73d8]
Former-commit-id: 1c3e19c4069737d736aebe8c6d3161dbeef0a31f
Former-commit-id: aab7fd820f04c9423d82273ff5c1086037d0355d
Former-commit-id: db518aed306c55ccd671d8270c7fd233718836c9
Former-commit-id: 1454fa10f3f3c5de355b310a894ce8ef8640d44e
Former-commit-id: 53e42a082b9356f05921f415360a0e0bb7448250
---
 .../basic-color/components/color-info.vue     |  5 ++
 src/pages/demo/element/basic-color/index.vue  | 61 +++++++++++++++++--
 2 files changed, 61 insertions(+), 5 deletions(-)
 create mode 100644 src/pages/demo/element/basic-color/components/color-info.vue

diff --git a/src/pages/demo/element/basic-color/components/color-info.vue b/src/pages/demo/element/basic-color/components/color-info.vue
new file mode 100644
index 00000000..d22c7e27
--- /dev/null
+++ b/src/pages/demo/element/basic-color/components/color-info.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <p>颜色</p>
+  </div>
+</template>
diff --git a/src/pages/demo/element/basic-color/index.vue b/src/pages/demo/element/basic-color/index.vue
index c7f2b77b..105ce536 100644
--- a/src/pages/demo/element/basic-color/index.vue
+++ b/src/pages/demo/element/basic-color/index.vue
@@ -5,7 +5,7 @@
       <el-row :gutter="20">
         <el-col :span="6">
           <div class="color color-primary">
-            <!-- <h1>$color-primary</h1> -->
+            <d2-demo-color-info/>
           </div>
         </el-col>
       </el-row>
@@ -29,33 +29,58 @@
     </el-card>
     <el-card shadow="never">
       <template slot="header">中性色</template>
+      <el-row :gutter="20" class="d2-mb">
+        <el-col :span="6">
+          <div class="color color-text-main"></div>
+        </el-col>
+        <el-col :span="6">
+          <div class="color color-text-normal"></div>
+        </el-col>
+        <el-col :span="6">
+          <div class="color color-text-sub"></div>
+        </el-col>
+        <el-col :span="6">
+          <div class="color color-text-placehoder"></div>
+        </el-col>
+      </el-row>
       <el-row :gutter="20">
         <el-col :span="6">
-          <div class="color color-info"></div>
+          <div class="color color-border-1"></div>
         </el-col>
         <el-col :span="6">
-          <div class="color color-success"></div>
+          <div class="color color-border-2"></div>
         </el-col>
         <el-col :span="6">
-          <div class="color color-warning"></div>
+          <div class="color color-border-3"></div>
         </el-col>
         <el-col :span="6">
-          <div class="color color-danger"></div>
+          <div class="color color-border-4"></div>
         </el-col>
       </el-row>
     </el-card>
   </d2-container>
 </template>
 
+<script>
+export default {
+  components: {
+    'd2-demo-color-info': () => import('./components/color-info.vue')
+  }
+}
+</script>
+
+
 <style lang="scss" scoped>
 @import '~@/assets/style/unit/_color.scss';
 .color {
   border-radius: 4px;
   height: 100px;
 }
+
 .color-primary {
   background-color: $color-primary;
 }
+
 .color-info {
   background-color: $color-info;
 }
@@ -68,5 +93,31 @@
 .color-danger {
   background-color: $color-danger;
 }
+
+.color-text-main {
+  background-color: $color-text-main;
+}
+.color-text-normal {
+  background-color: $color-text-normal;
+}
+.color-text-sub {
+  background-color: $color-text-sub;
+}
+.color-text-placehoder {
+  background-color: $color-text-placehoder;
+}
+
+.color-border-1 {
+  background-color: $color-border-1;
+}
+.color-border-2 {
+  background-color: $color-border-2;
+}
+.color-border-3 {
+  background-color: $color-border-3;
+}
+.color-border-4 {
+  background-color: $color-border-4;
+}
 </style>