ソースを参照

Merge branch 'v3-dev' of https://github.com/jdf2e/nutui into v3-dev

lilinsen 5 年 前
コミット
646246dcd3

+ 1 - 1
src/packages/badge/badge.scss

@@ -27,7 +27,7 @@
 		min-width: 0;
 		padding: 0;
 		border-radius: 50%;
-		background: $primary-color;
+		background: $primary-color-jd-red;
 	}
 
 	.single-val {

+ 5 - 1
src/packages/badge/demo.vue

@@ -40,7 +40,11 @@ export default {
 
 <style lang="scss" scoped>
 .item {
-	margin: 16px 26px 10px 10px;
+  margin: 16px 26px 10px 10px;
+  line-height: 15px;
+  font-family: PingFangSC-Regular;
+  font-size: 15px;
+  color: #646464;
 }
 
 .demo-w {

+ 1 - 1
src/packages/card/card.vue

@@ -85,7 +85,7 @@ export default {
       this.$emit(event);
     },
     headerClickHandler() {
-      this.$emit('switchClick');
+      this.$emit('switch-click');
     }
   }
 };

+ 11 - 6
src/packages/card/demo.vue

@@ -1,9 +1,9 @@
 <template>
-  <div class="demo-list">
+  <div class="demo-list card-list">
     <h4>基础样式</h4>
     <nut-card
       title="这里是默认卡片内容"
-      :footerButtons="footerButtons"
+      :footer-buttons="footerButtons"
       @click1="clickHandler1"
       @click2="clickHandler2"
     ></nut-card>
@@ -15,19 +15,19 @@
     <nut-card
       title="卡片标题"
       content="这里是卡片内容区域"
-      :footerButtons="footerButtons"
+      :footer-buttons="footerButtons"
       @click1="clickHandler1"
       @click2="clickHandler2"
     ></nut-card>
 
     <h4>可展开/收起的卡片</h4>
-    <nut-card title="卡片标题" content="这里是卡片内容区域" openIcon :isOpen="isOpen"  @switchClick="switchClick"></nut-card>
+    <nut-card title="卡片标题" content="这里是卡片内容区域" open-icon :is-open="isOpen"  @switch-click="switchClick"></nut-card>
 
     <h4>通栏卡片</h4>
-    <nut-card title="卡片标题" content="这里是卡片内容区域" isFull></nut-card>
+    <nut-card title="卡片标题" content="这里是卡片内容区域" is-full></nut-card>
 
     <h4>通过Slot插槽分发内容</h4>
-    <nut-card hasContent hasFooter>
+    <nut-card has-content has-footer>
       <div slot="title" class="card-title">
         <div class="right">我是标题</div>
         <div class="left">一小时</div>
@@ -70,6 +70,11 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.card-list{
+  h4{
+    padding: 0 15px;
+  }
+}
 .card-title {
   display: flex;
   justify-content: space-between;

+ 11 - 11
src/packages/card/doc.md

@@ -8,7 +8,7 @@
 ```html
 <nut-card
   title="这里是默认卡片内容"
-  :footerButtons="footerButtons"
+  :footer-buttons="footerButtons"
   @click1="clickHandler1"
   @click2="clickHandler2"
 ></nut-card>
@@ -26,7 +26,7 @@
 <nut-card
   title="卡片标题"
   content="这里是卡片内容区域"
-  :footerButtons="footerButtons"
+  :footer-buttons="footerButtons"
   @click1="clickHandler1"
   @click2="clickHandler2"
 ></nut-card>
@@ -36,19 +36,19 @@
 可展开/收起的卡片
 
 ```html
-<nut-card title="卡片标题" content="这里是卡片内容区域" openIcon :isOpen="isOpen"  @switchClick="switchClick"></nut-card>
+<nut-card title="卡片标题" content="这里是卡片内容区域" open-icon :is-open="isOpen"  @switch-click="switchClick"></nut-card>
 ```
 
 通栏卡片
 
 ```html
-<nut-card title="卡片标题" content="这里是卡片内容区域" isFull></nut-card>
+<nut-card title="卡片标题" content="这里是卡片内容区域" is-full></nut-card>
 ```
 ## 自定义内容
 Card组件提供了多个插槽,可以灵活地自定义内容
 
 ```html
-<nut-card hasContent hasFooter>
+<nut-card has-content has-footer>
   <div slot="title" class="card-title">
     <div class="right">我是标题</div>
     <div class="left">一小时</div>
@@ -98,10 +98,10 @@ export default {
 | 字段    | 说明                                  | 类型   | 默认值                                                   |
 |---------|---------------------------------------|--------|----------------------------------------------------------|
 | title     | 标题 | String | '' |
-| openIcon  | 展开收起图标是否展示 | Boolean | false |
+| open-icon  | 展开收起图标是否展示 | Boolean | false |
 | content  | 内容 | String  | '' |
-| isOpen  | 是否展开卡片内容 | Boolean  | true |
-| footerButtons  | 底部按钮 | Array  | [] |
-| isFull  | 是否为通栏卡片 | Boolean  | false |
-| hasContent  | 使用slot自定义content内容 | Boolean  | false |
-| hasFooter  | 使用slot自定义底部按钮 | Boolean  | false |
+| is-open  | 是否展开卡片内容 | Boolean  | true |
+| footer-buttons  | 底部按钮 | Array  | [] |
+| is-full  | 是否为通栏卡片 | Boolean  | false |
+| has-content  | 使用slot自定义content内容 | Boolean  | false |
+| has-footer  | 使用slot自定义底部按钮 | Boolean  | false |