city-casereport/miniprogram_npm/tdesign-miniprogram/image-viewer/image-viewer.wxss

103 lines
2.0 KiB
Plaintext
Raw Normal View History

2023-12-06 14:22:42 +08:00
.t-float-left {
float: left;
}
.t-float-right {
float: right;
}
@keyframes tdesign-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
.hotspot-expanded.relative {
position: relative;
}
.hotspot-expanded::after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
transform: scale(1.5);
}
.t-image-viewer {
position: fixed;
top: var(--td-image-viewer-top, var(--td-position-fixed-top, 0));
left: 0;
bottom: 0;
right: 0;
z-index: 1001;
height: 100%;
transform: translateZ(0);
overflow: hidden;
}
.t-image-viewer__mask {
position: absolute;
z-index: 1000;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.t-image-viewer__content {
width: 100vw;
display: inline-block;
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 1005;
}
.t-image-viewer .swiper {
outline: 0;
}
.t-image-viewer__image {
width: 100%;
display: inline-block;
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.t-image-viewer .t-image--external {
width: inherit;
height: inherit;
display: block;
}
.t-image-viewer__nav {
width: 100%;
position: absolute;
display: flex;
align-items: center;
justify-content: space-between;
height: var(--td-image-viewer-nav-height, 96rpx);
background-color: var(--td-image-viewer-nav-bg-color, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)));
left: 0;
color: var(--td-image-viewer-nav-color, var(--td-font-white-1, #ffffff));
z-index: 1005;
}
.t-image-viewer__nav-close {
margin-left: var(--td-image-viewer-close-margin-left, var(--td-spacer-1, 24rpx));
}
.t-image-viewer__nav-close:empty {
display: none;
}
.t-image-viewer__nav-delete {
margin-right: var(--td-image-viewer-delete-margin-right, var(--td-spacer-1, 24rpx));
}
.t-image-viewer__nav-delete:empty {
display: none;
}
.t-image-viewer__nav-close,
.t-image-viewer__nav-delete {
font-size: 48rpx;
}
.t-image-viewer__nav-index {
flex: 1;
font-size: var(--td-image-viewer-nav-index-font-size, var(--td-font-size-base, 28rpx));
text-align: center;
}