mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
feat(Overlay): add @overlay-z-index less var
This commit is contained in:
parent
7609389623
commit
95d19f70d1
@ -4,6 +4,7 @@
|
|||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
z-index: @overlay-z-index;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
background-color: @overlay-background-color;
|
background-color: @overlay-background-color;
|
||||||
|
@ -57,13 +57,10 @@ function Overlay(
|
|||||||
|
|
||||||
Overlay.props = {
|
Overlay.props = {
|
||||||
show: Boolean,
|
show: Boolean,
|
||||||
|
zIndex: [Number, String],
|
||||||
duration: [Number, String],
|
duration: [Number, String],
|
||||||
className: null as any,
|
className: null as any,
|
||||||
customStyle: Object,
|
customStyle: Object,
|
||||||
zIndex: {
|
|
||||||
type: [Number, String],
|
|
||||||
default: 1,
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export default createComponent<OverlayProps, OverlayEvents>(Overlay);
|
export default createComponent<OverlayProps, OverlayEvents>(Overlay);
|
||||||
|
@ -3,10 +3,10 @@
|
|||||||
exports[`renders demo correctly 1`] = `
|
exports[`renders demo correctly 1`] = `
|
||||||
<div>
|
<div>
|
||||||
<div><button class="van-button van-button--primary van-button--normal" style="margin-left: 16px;"><span class="van-button__text">显示遮罩层</span></button>
|
<div><button class="van-button van-button--primary van-button--normal" style="margin-left: 16px;"><span class="van-button__text">显示遮罩层</span></button>
|
||||||
<div class="van-overlay" style="z-index: 1; display: none;" name="van-fade"></div>
|
<div class="van-overlay" style="display: none;" name="van-fade"></div>
|
||||||
</div>
|
</div>
|
||||||
<div><button class="van-button van-button--primary van-button--normal" style="margin-left: 16px;"><span class="van-button__text">嵌入内容</span></button>
|
<div><button class="van-button van-button--primary van-button--normal" style="margin-left: 16px;"><span class="van-button__text">嵌入内容</span></button>
|
||||||
<div class="van-overlay" style="z-index: 1; display: none;" name="van-fade">
|
<div class="van-overlay" style="display: none;" name="van-fade">
|
||||||
<div class="wrapper">
|
<div class="wrapper">
|
||||||
<div class="block"></div>
|
<div class="block"></div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
exports[`class-name prop 1`] = `<div class="van-overlay my-overlay" style="z-index: 1;" name="van-fade"></div>`;
|
exports[`class-name prop 1`] = `<div class="van-overlay my-overlay" name="van-fade"></div>`;
|
||||||
|
|
||||||
exports[`custom style prop 1`] = `<div class="van-overlay" style="z-index: 1; background-color: red;" name="van-fade"></div>`;
|
exports[`custom style prop 1`] = `<div class="van-overlay" style="background-color: red;" name="van-fade"></div>`;
|
||||||
|
|
||||||
exports[`default slot 1`] = `<div class="van-overlay" style="z-index: 1; display: none;" name="van-fade">Custom Default</div>`;
|
exports[`default slot 1`] = `<div class="van-overlay" style="display: none;" name="van-fade">Custom Default</div>`;
|
||||||
|
|
||||||
exports[`duration prop 1`] = `<div class="van-overlay" style="z-index: 1; animation-duration: 1s;" name="van-fade"></div>`;
|
exports[`duration prop 1`] = `<div class="van-overlay" style="animation-duration: 1s;" name="van-fade"></div>`;
|
||||||
|
|
||||||
exports[`z-index prop 1`] = `<div class="van-overlay" style="z-index: 99;" name="van-fade"></div>`;
|
exports[`z-index prop 1`] = `<div class="van-overlay" style="z-index: 99;" name="van-fade"></div>`;
|
||||||
|
@ -16,7 +16,7 @@ exports[`renders demo correctly 1`] = `
|
|||||||
</ul>
|
</ul>
|
||||||
<div class="van-password-input__info">密码为 6 位数字</div>
|
<div class="van-password-input__info">密码为 6 位数字</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="van-number-keyboard van-number-keyboard--default van-number-keyboard--safe-area-inset-bottom" style="z-index: 100;" name="van-slide-up">
|
<div class="van-number-keyboard van-number-keyboard--default van-number-keyboard--safe-area-inset-bottom" name="van-slide-up">
|
||||||
<div class="van-number-keyboard__body"><i role="button" tabindex="0" class="van-hairline van-key">1</i><i role="button" tabindex="0" class="van-hairline van-key">2</i><i role="button" tabindex="0" class="van-hairline van-key">3</i><i role="button" tabindex="0" class="van-hairline van-key">4</i><i role="button" tabindex="0" class="van-hairline van-key">5</i><i role="button" tabindex="0" class="van-hairline van-key">6</i><i role="button" tabindex="0" class="van-hairline van-key">7</i><i role="button" tabindex="0" class="van-hairline van-key">8</i><i role="button" tabindex="0" class="van-hairline van-key">9</i><i role="button" tabindex="0" class="van-hairline van-key van-key--gray van-key--extra"></i><i role="button" tabindex="0" class="van-hairline van-key">0</i><i role="button" tabindex="0" class="van-hairline van-key van-key--gray van-key--delete">删除</i></div>
|
<div class="van-number-keyboard__body"><i role="button" tabindex="0" class="van-hairline van-key">1</i><i role="button" tabindex="0" class="van-hairline van-key">2</i><i role="button" tabindex="0" class="van-hairline van-key">3</i><i role="button" tabindex="0" class="van-hairline van-key">4</i><i role="button" tabindex="0" class="van-hairline van-key">5</i><i role="button" tabindex="0" class="van-hairline van-key">6</i><i role="button" tabindex="0" class="van-hairline van-key">7</i><i role="button" tabindex="0" class="van-hairline van-key">8</i><i role="button" tabindex="0" class="van-hairline van-key">9</i><i role="button" tabindex="0" class="van-hairline van-key van-key--gray van-key--extra"></i><i role="button" tabindex="0" class="van-hairline van-key">0</i><i role="button" tabindex="0" class="van-hairline van-key van-key--gray van-key--delete">删除</i></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -471,6 +471,7 @@
|
|||||||
@number-keyboard-z-index: 100;
|
@number-keyboard-z-index: 100;
|
||||||
|
|
||||||
// Overlay
|
// Overlay
|
||||||
|
@overlay-z-index: 1;
|
||||||
@overlay-background-color: rgba(0, 0, 0, 0.7);
|
@overlay-background-color: rgba(0, 0, 0, 0.7);
|
||||||
|
|
||||||
// Pagination
|
// Pagination
|
||||||
|
Loading…
x
Reference in New Issue
Block a user