alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

code review

Browse Source
This commit is contained in:
cookfront
2017-03-31 14:05:30 +08:00
parent a884fc4e4c
commit 4626b1483f
13 changed files with 303 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/examples-dist/tab.vue
+34 -13
View File
@@ -7,17 +7,27 @@
<zan-tab title="选项五">内容五</zan-tab>
</zan-tabs>
</example-block><example-block title="禁用用法">
</example-block><example-block title="基础用法">
<zan-tabs :active="active">
<zan-tab title="选项一">内容一</zan-tab>
<zan-tab disable="" title="选项二" @disable="popalert">内容二</zan-tab>
<zan-tab title="选项二">内容二</zan-tab>
<zan-tab title="选项三">内容三</zan-tab>
<zan-tab title="选项四">内容四</zan-tab>
<zan-tab title="选项五">内容五</zan-tab>
</zan-tabs>
</example-block><example-block title="禁用tab">
<zan-tabs>
<zan-tab title="选项一">内容一</zan-tab>
<zan-tab title="选项二" disabled @disabled="popalert">内容二</zan-tab>
<zan-tab title="选项三">内容三</zan-tab>
<zan-tab title="选项四">内容四</zan-tab>
<zan-tab title="选项五">内容五</zan-tab>
</zan-tabs>
</example-block><example-block title="card样式用法">
</example-block><example-block title="card样式">
<zan-tabs type="card">
<zan-tab title="选项一">内容一</zan-tab>
<zan-tab title="选项二">内容二</zan-tab>
@@ -26,8 +36,8 @@
<zan-tab title="选项五">内容五</zan-tab>
</zan-tabs>
</example-block><example-block title="自定义样式用法">
<zan-tabs active="2" navclass="custom-tabwrap">
</example-block><example-block title="自定义样式">
<zan-tabs active="2" class="custom-tabwrap">
<zan-tab title="选项一" class="custom-pane">内容一</zan-tab>
<zan-tab title="选项二" class="custom-pane">内容二</zan-tab>
<zan-tab title="选项三" class="custom-pane">内容三</zan-tab>
@@ -36,6 +46,7 @@
</zan-tabs>
</example-block><example-block title="click事件">
<zan-tabs @click="handleTabClick">
<zan-tab title="选项一">内容一</zan-tab>
@@ -55,21 +66,31 @@
background-color: #fff;
padding: 20px;
}
.zan-tabs--card .zan-tab__pane {
background-color: transparent;
}
.custom-tabwrap .zan-tab-active {
color: #20a0ff;
}
.custom-tabwrap .zan-tabs-nav-bar {
background: #20a0ff;
}
.custom-pane {
text-align: center;
height: 50px;
line-height: 50px;
}
}
}
</style><style>
.page-tab {
padding: 0 15px;
}
.custom-tabwrap .zan-tab-active{
.custom-tabwrap .zan-tab-active {
color: #20a0ff;
}
.custom-tabwrap .zan-tabs-nav-bar{
.custom-tabwrap .zan-tabs-nav-bar {
background: #20a0ff;
}
.custom-tab {
font-weight: bold;
}
.custom-pane {
text-align: center;
height: 50px;