style: tag demo 优化

src/packages/__VUE/tag/demo.vue

@@ -9,13 +9,13 @@
       <nut-cell title="success 类型">
         <template v-slot:link>
           <nut-tag type="success">标签</nut-tag>
-        </template></nut-cell
-      >
+        </template>
+      </nut-cell>
       <nut-cell title="danger 类型">
         <template v-slot:link>
           <nut-tag type="danger">标签</nut-tag>
-        </template></nut-cell
-      >
+        </template>
+      </nut-cell>
       <nut-cell title="warning 类型">
         <template v-slot:link>
           <nut-tag type="warning">标签</nut-tag>
@@ -27,33 +27,33 @@
       <nut-cell title="空心样式">
         <template v-slot:link>
           <nut-tag plain>标签</nut-tag>
-        </template></nut-cell
-      >
+        </template>
+      </nut-cell>
       <nut-cell title="圆角样式">
         <template v-slot:link>
           <nut-tag round type="primary">标签</nut-tag>
-        </template></nut-cell
-      >
+        </template>
+      </nut-cell>
       <nut-cell title="标记样式">
         <template v-slot:link>
           <nut-tag mark type="primary">标签</nut-tag>
-        </template></nut-cell
-      >
+        </template>
+      </nut-cell>
       <nut-cell title="可关闭标签">
         <template v-slot:link>
           <nut-tag v-if="show" closeable @close="close" type="primary"
             >标签</nut-tag
           >
-        </template></nut-cell
-      >
+        </template>
+      </nut-cell>
     </nut-cell-group>
 
     <nut-cell-group title="自定义">
       <nut-cell title="背景颜色">
         <template v-slot:link>
           <nut-tag color="#FA685D">标签</nut-tag>
-        </template></nut-cell
-      >
+        </template>
+      </nut-cell>
       <nut-cell title="文字颜色">
         <template v-slot:link>
           <nut-tag color="#E9E9E9" textColor="#999999">标签</nut-tag>
@@ -87,24 +87,3 @@ export default createDemo({
   }
 });
 </script>
-
-<style lang="scss" scoped>
-.nut-tag {
-  margin-right: 15px;
-  &:last-child {
-    margin-bottom: 0;
-    margin-right: 0;
-  }
-}
-
-.nut-cell {
-  align-items: flex-end;
-  border-radius: 0;
-  .nut-cell__title {
-    font-size: 13px;
-    font-family: PingFangSC;
-    font-weight: 500;
-    color: rgba(102, 102, 102, 1);
-  }
-}
-</style>

src/packages/__VUE/tag/doc.md

@@ -62,7 +62,7 @@ app.use(Tag);
 
 ```html
  <nut-tag color="#FA685D">标签</nut-tag>
- <nut-tag color="#E9E9E9" textColor="#999999">标签</nut-tag>
+ <nut-tag color="#E9E9E9" text-color="#999999">标签</nut-tag>
  <nut-tag color="#FA2400" plain>标签</nut-tag>
 ```
 
@@ -70,13 +70,25 @@ app.use(Tag);
 
 ### Prop  
 
-| 字段            | 说明                 | 类型    | 默认值  |
-|-----------------|------------------------------------------|---------|---------|
-| type           | 标签类型，可选值为primary success danger warning         | String | `default`       |
-| color         | 标签颜色    | String  | -       |
-| textColor        | 文本颜色，优先级高于color属性         | String |     `white`   |
-| plain     | 是否为空心样式   | Boolean  | `false`      |
-| round         | 是否为圆角样式   | Boolean  | `false`       |  
-| mark         | 是否为标记样式   | Boolean  | `false`       |  
-| closeable         | 是否为可关闭标签   | Boolean  | `false`       |                                          
+| 字段       | 说明                                             | 类型    | 默认值    |
+|------------|--------------------------------------------------|---------|-----------|
+| type       | 标签类型，可选值为primary success danger warning | String  | `default` |
+| color      | 标签颜色                                         | String  | -         |
+| text-color | 文本颜色，优先级高于color属性                    | String  | `white`   |
+| plain      | 是否为空心样式                                   | Boolean | `false`   |
+| round      | 是否为圆角样式                                   | Boolean | `false`   |
+| mark       | 是否为标记样式                                   | Boolean | `false`   |
+| closeable  | 是否为可关闭标签                                 | Boolean | `false`   |
 
+
+### Slots
+
+| 名称    | 说明         |
+|---------|--------------|
+| default | 标签显示内容 |
+
+### Event
+
+| 事件名称 | 说明     | 回调参数 |
+|----------|----------|----------|
+| close    | 关闭事件 | event    |

src/packages/__VUE/tag/index.scss

@@ -1,5 +1,8 @@
 .nut-tag {
   padding: 0 4px;
+  display: inline-flex;
+  align-items: center;
+  font-size: 12px;
   &--default {
     color: $tag-default-color;
     background: $tag-default-background-color;

src/packages/__VUE/tag/index.vue

@@ -6,7 +6,7 @@
         class="nut-tag--close"
         v-if="closeable"
         name="close"
-        size="11"
+        size="12"
         @click="onClose"
       ></nut-icon>
     </view>