Commit 0c5aa9962db80f28737e0d9da285ead253f25fcf
1 parent
2a17d843
tabbar组件样式优化
Showing
3 changed files
with
9 additions
and
7 deletions
src/components/imgListBox/imgListBox.less
src/components/tabBox/tabBox.less
| ... | ... | @@ -8,7 +8,7 @@ |
| 8 | 8 | .van-tabs--line .van-tabs__wrap{ |
| 9 | 9 | height: 60px; |
| 10 | 10 | line-height: 30px; |
| 11 | - padding: 30px 0; | |
| 11 | + padding: 30px 0 0 0; | |
| 12 | 12 | } |
| 13 | 13 | // tab标题颜色和字号 |
| 14 | 14 | .van-tab{ |
| ... | ... | @@ -49,11 +49,11 @@ |
| 49 | 49 | width: 100%; |
| 50 | 50 | height: 100%; |
| 51 | 51 | background-color: #F9F9F9; |
| 52 | - //.column-commodity-excessive { | |
| 53 | - // background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(249, 249, 249, 1) 100%); | |
| 54 | - // width: 750px; | |
| 55 | - // height: 30px; | |
| 56 | - //} | |
| 52 | + .column-commodity-excessive { | |
| 53 | + background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(249, 249, 249, 1) 100%); | |
| 54 | + width: 750px; | |
| 55 | + height: 30px; | |
| 56 | + } | |
| 57 | 57 | } |
| 58 | 58 | } |
| 59 | 59 | } | ... | ... |
src/components/tabBox/tabBox.vue
| ... | ... | @@ -43,6 +43,8 @@ |
| 43 | 43 | <!-- 商品推荐 --> |
| 44 | 44 | <div :style="{backgroundColor:tabbar[2].color || tabbarBackgroud}" class="skeleton commodity" ref="commodity"> |
| 45 | 45 | <!--infinite-scroll-immediate-check="true"可避免上拉多次调用接口问题--> |
| 46 | + <!-- 渐变过度 --> | |
| 47 | + <div class="column-commodity-excessive"></div> | |
| 46 | 48 | <div class="column-commodity-list" infinite-scroll-immediate-check="true" v-infinite-scroll="loadCommodity" infinite-scroll-disabled="paging.commodity.loading" :infinite-scroll-distance="paging.distance"> |
| 47 | 49 | <column-commodity-list-box |
| 48 | 50 | v-if="item.style === '15'" | ... | ... |