vant/packages/zanui-css/src/popup.pcss
2017-02-17 16:26:31 +08:00

76 lines
1.4 KiB
Plaintext

.v-modal {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.701961);
}
@component-namespace z {
@component popup {
position: fixed;
background-color: #fff;
top: 50%;
left: 50%;
transform: translate3d(-50%, -50%, 0);
backface-visibility: hidden;
transition: .2s ease-out;
@modifier top {
top: 0;
right: auto;
bottom: auto;
left: 50%;
transform: translate3d(-50%, 0, 0);
}
@modifier right {
top: 50%;
right: 0;
bottom: auto;
left: auto;
transform: translate3d(0, -50%, 0);
}
@modifier bottom {
top: auto;
bottom: 0;
right: auto;
left: 50%;
transform: translate3d(-50%, 0, 0);
}
@modifier left {
top: 50%;
right: auto;
bottom: auto;
left: 0;
transform: translate3d(0, -50%, 0);
}
}
}
.popup-slide-top-enter,
.popup-slide-top-leave-active {
transform: translate3d(-50%, -100%, 0);
}
.popup-slide-right-enter,
.popup-slide-right-leave-active {
transform: translate3d(100%, -50%, 0);
}
.popup-slide-bottom-enter,
.popup-slide-bottom-leave-active {
transform: translate3d(-50%, 100%, 0);
}
.popup-slide-left-enter, .popup-slide-left-leave-active {
transform: translate3d(-100%, -50%, 0);
}
.popup-fade-enter, .popup-fade-leave-active {
opacity: 0;
}