mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
feat(Tabbar): add @tabbar-z-index less var
This commit is contained in:
parent
a2d870ad8e
commit
0441f7ba09
@ -687,6 +687,7 @@
|
|||||||
|
|
||||||
// Tabbar
|
// Tabbar
|
||||||
@tabbar-height: 50px;
|
@tabbar-height: 50px;
|
||||||
|
@tabbar-z-index: 1;
|
||||||
@tabbar-background-color: @white;
|
@tabbar-background-color: @white;
|
||||||
|
|
||||||
// TabbarItem
|
// TabbarItem
|
||||||
|
@ -9,6 +9,7 @@ export default createComponent({
|
|||||||
|
|
||||||
props: {
|
props: {
|
||||||
route: Boolean,
|
route: Boolean,
|
||||||
|
zIndex: Number,
|
||||||
activeColor: String,
|
activeColor: String,
|
||||||
inactiveColor: String,
|
inactiveColor: String,
|
||||||
safeAreaInsetBottom: Boolean,
|
safeAreaInsetBottom: Boolean,
|
||||||
@ -24,10 +25,6 @@ export default createComponent({
|
|||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true,
|
default: true,
|
||||||
},
|
},
|
||||||
zIndex: {
|
|
||||||
type: Number,
|
|
||||||
default: 1,
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
|
|
||||||
watch: {
|
watch: {
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
@import '../style/var';
|
@import '../style/var';
|
||||||
|
|
||||||
.van-tabbar {
|
.van-tabbar {
|
||||||
|
z-index: @tabbar-z-index;
|
||||||
display: flex;
|
display: flex;
|
||||||
box-sizing: content-box;
|
box-sizing: content-box;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
@ -3,7 +3,7 @@
|
|||||||
exports[`renders demo correctly 1`] = `
|
exports[`renders demo correctly 1`] = `
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<div>
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item van-tabbar-item--active">
|
<div class="van-tabbar-item van-tabbar-item--active">
|
||||||
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
||||||
<!----></i>
|
<!----></i>
|
||||||
@ -35,7 +35,7 @@ exports[`renders demo correctly 1`] = `
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item van-tabbar-item--active">
|
<div class="van-tabbar-item van-tabbar-item--active">
|
||||||
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
||||||
<!----></i>
|
<!----></i>
|
||||||
@ -75,7 +75,7 @@ exports[`renders demo correctly 1`] = `
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item van-tabbar-item--active">
|
<div class="van-tabbar-item van-tabbar-item--active">
|
||||||
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
||||||
<!----></i>
|
<!----></i>
|
||||||
@ -111,7 +111,7 @@ exports[`renders demo correctly 1`] = `
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item van-tabbar-item--active">
|
<div class="van-tabbar-item van-tabbar-item--active">
|
||||||
<div class="van-tabbar-item__icon"><img src="https://img.yzcdn.cn/vant/user-active.png">
|
<div class="van-tabbar-item__icon"><img src="https://img.yzcdn.cn/vant/user-active.png">
|
||||||
<div class="van-info">3</div>
|
<div class="van-info">3</div>
|
||||||
@ -135,7 +135,7 @@ exports[`renders demo correctly 1`] = `
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item van-tabbar-item--active" style="color: rgb(7, 193, 96);">
|
<div class="van-tabbar-item van-tabbar-item--active" style="color: rgb(7, 193, 96);">
|
||||||
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
||||||
<!----></i>
|
<!----></i>
|
||||||
@ -167,7 +167,7 @@ exports[`renders demo correctly 1`] = `
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item van-tabbar-item--active">
|
<div class="van-tabbar-item van-tabbar-item--active">
|
||||||
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
<div class="van-tabbar-item__icon"><i class="van-icon van-icon-home-o">
|
||||||
<!----></i>
|
<!----></i>
|
||||||
|
@ -1,9 +1,9 @@
|
|||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
exports[`disable border 1`] = `<div class="van-tabbar van-tabbar--fixed" style="z-index: 1;"></div>`;
|
exports[`disable border 1`] = `<div class="van-tabbar van-tabbar--fixed"></div>`;
|
||||||
|
|
||||||
exports[`route mode 1`] = `
|
exports[`route mode 1`] = `
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item van-tabbar-item--active">
|
<div class="van-tabbar-item van-tabbar-item--active">
|
||||||
<div class="van-tabbar-item__icon">
|
<div class="van-tabbar-item__icon">
|
||||||
<!---->
|
<!---->
|
||||||
@ -40,7 +40,7 @@ exports[`route mode 1`] = `
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`route mode 2`] = `
|
exports[`route mode 2`] = `
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item">
|
<div class="van-tabbar-item">
|
||||||
<div class="van-tabbar-item__icon">
|
<div class="van-tabbar-item__icon">
|
||||||
<!---->
|
<!---->
|
||||||
@ -77,7 +77,7 @@ exports[`route mode 2`] = `
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`route mode 3`] = `
|
exports[`route mode 3`] = `
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item">
|
<div class="van-tabbar-item">
|
||||||
<div class="van-tabbar-item__icon">
|
<div class="van-tabbar-item__icon">
|
||||||
<!---->
|
<!---->
|
||||||
@ -114,7 +114,7 @@ exports[`route mode 3`] = `
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`route mode match by name 1`] = `
|
exports[`route mode match by name 1`] = `
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item van-tabbar-item--active">
|
<div class="van-tabbar-item van-tabbar-item--active">
|
||||||
<div class="van-tabbar-item__icon">
|
<div class="van-tabbar-item__icon">
|
||||||
<!---->
|
<!---->
|
||||||
@ -135,7 +135,7 @@ exports[`route mode match by name 1`] = `
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`route mode match by name 2`] = `
|
exports[`route mode match by name 2`] = `
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item">
|
<div class="van-tabbar-item">
|
||||||
<div class="van-tabbar-item__icon">
|
<div class="van-tabbar-item__icon">
|
||||||
<!---->
|
<!---->
|
||||||
@ -156,7 +156,7 @@ exports[`route mode match by name 2`] = `
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`watch tabbar value 1`] = `
|
exports[`watch tabbar value 1`] = `
|
||||||
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed" style="z-index: 1;">
|
<div class="van-hairline--top-bottom van-tabbar van-tabbar--fixed">
|
||||||
<div class="van-tabbar-item">
|
<div class="van-tabbar-item">
|
||||||
<div class="van-tabbar-item__icon">
|
<div class="van-tabbar-item__icon">
|
||||||
<!---->
|
<!---->
|
||||||
|
Loading…
x
Reference in New Issue
Block a user