169 lines
3.0 KiB
CSS
169 lines
3.0 KiB
CSS
.wareaitem {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
background: rgba(255, 255, 255, 0.7);
|
|
}
|
|
.wareaitem .tp uni-image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.wareaitem .annotation {
|
|
width: 7vw;
|
|
height: 8vw;
|
|
z-index: 20;
|
|
}
|
|
.wareaitem .annotation > uni-view {
|
|
position: relative;
|
|
}
|
|
.wareaitem .annotation > uni-view:nth-child(1) {
|
|
width: 7vw;
|
|
height: 2vw;
|
|
background: #F2F3F7;
|
|
box-shadow: 0 0 0 0 rgba(182, 186, 196, 0.35);
|
|
border: 0.0625rem solid #FFFFFF;
|
|
font-weight: 400;
|
|
font-size: 1vw;
|
|
color: #333333;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
z-index: 3;
|
|
}
|
|
.wareaitem .annotation > uni-view:nth-child(2) {
|
|
width: 4vw;
|
|
height: 2vw;
|
|
margin: -0.0625rem auto 0;
|
|
z-index: 2;
|
|
}
|
|
.wareaitem .annotation > uni-view:nth-child(3) {
|
|
width: 3vw;
|
|
height: 5vw;
|
|
z-index: 1;
|
|
margin: -1vw auto 0;
|
|
}
|
|
.wareaitem > uni-view {
|
|
position: absolute;
|
|
}
|
|
.wareaitem > uni-view:nth-child(1) {
|
|
width: 26vw;
|
|
height: 22vw;
|
|
top: 17vw;
|
|
left: 8vw;
|
|
z-index: 10;
|
|
}
|
|
.wareaitem > uni-view:nth-child(2) {
|
|
width: 68vw;
|
|
height: 22vw;
|
|
top: 4vw;
|
|
left: 18vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(3) {
|
|
width: 20vw;
|
|
height: 13vw;
|
|
top: 15vw;
|
|
left: 43vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(4) {
|
|
width: 20vw;
|
|
height: 14vw;
|
|
top: 26vw;
|
|
left: 45vw;
|
|
z-index: 10;
|
|
}
|
|
.wareaitem > uni-view:nth-child(5) {
|
|
width: 11vw;
|
|
height: 7vw;
|
|
top: 28vw;
|
|
left: 56vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(6) {
|
|
width: 11vw;
|
|
height: 9vw;
|
|
top: 23vw;
|
|
left: 63vw;
|
|
z-index: 5;
|
|
}
|
|
.wareaitem > uni-view:nth-child(7) {
|
|
width: 13vw;
|
|
height: 11vw;
|
|
top: 25vw;
|
|
left: 80vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(8) {
|
|
width: 15vw;
|
|
height: 14vw;
|
|
top: 31vw;
|
|
left: 67vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(9) {
|
|
width: 48vw;
|
|
height: 22vw;
|
|
top: 34vw;
|
|
left: 21vw;
|
|
z-index: 11;
|
|
}
|
|
.wareaitem > uni-view:nth-child(10) {
|
|
width: 17vw;
|
|
height: 10vw;
|
|
top: 48vw;
|
|
left: 26vw;
|
|
z-index: 12;
|
|
}
|
|
.wareaitem > uni-view:nth-child(11) {
|
|
width: 11vw;
|
|
height: 8vw;
|
|
top: 22vw;
|
|
left: 56vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(12) {
|
|
width: 3vw;
|
|
height: 3vw;
|
|
top: 21vw;
|
|
left: 57vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(13) {
|
|
top: 15.5vw;
|
|
left: 21.5vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(14) {
|
|
top: 12vw;
|
|
left: 48vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(15) {
|
|
top: 20vw;
|
|
left: 47vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(16) {
|
|
top: 27vw;
|
|
left: 71vw;
|
|
}
|
|
.wareaitem > uni-view:nth-child(17) {
|
|
top: 21vw;
|
|
left: 83vw;
|
|
}
|
|
.backgroundContainer {
|
|
display: flex;
|
|
flex-direction: column;
|
|
position: relative;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
background-image: url('../../static/index/lightbgcnew.png');
|
|
background-size: cover;
|
|
background-position: center center;
|
|
overflow: hidden;
|
|
}
|
|
.darkbackgroundContainer {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
position: relative;
|
|
background-image: url('../../static/index/background.png');
|
|
background-size: cover;
|
|
background-position: center center;
|
|
overflow: hidden;
|
|
}
|