180 lines
2.4 KiB
CSS
180 lines
2.4 KiB
CSS
#main-container__fulleq {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: url(./assets/full-lines.png) 100% / cover no-repeat;
|
|
}
|
|
|
|
.name-tag {
|
|
padding: 5px;
|
|
border-radius: 5px;
|
|
background: #ccc3;
|
|
backdrop-filter: blur(3px);
|
|
color: #000a;
|
|
font-size: 12px;
|
|
/* font-weight: 600; */
|
|
transition: background 0.1s ease-out;
|
|
user-select: none;
|
|
width: 72px;
|
|
text-align: center;
|
|
position: absolute;
|
|
/* cursor: pointer; */
|
|
/* transform: rotate(-45deg); */
|
|
box-shadow: 0 0 5px 2px #0003;
|
|
}
|
|
|
|
/* .name-tag:hover {
|
|
background: #666c;
|
|
} */
|
|
|
|
.tag-container > .name-tag:first-child {
|
|
bottom: 214px;
|
|
left: -128px;
|
|
}
|
|
.tag-container > .name-tag:nth-child(2) {
|
|
bottom: 182px;
|
|
left: -100px;
|
|
}
|
|
.tag-container > .name-tag:nth-child(3) {
|
|
bottom: 150px;
|
|
left: -88px;
|
|
}
|
|
.tag-container > .name-tag:nth-child(4) {
|
|
bottom: 118px;
|
|
left: -68px;
|
|
}
|
|
.tag-container > .name-tag:nth-child(5) {
|
|
bottom: 86px;
|
|
left: -52px;
|
|
}
|
|
.tag-container > .name-tag:nth-child(6) {
|
|
bottom: 32px;
|
|
left: -20px;
|
|
}
|
|
.tag-container > .name-tag:nth-child(7) {
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.absolute {
|
|
position: absolute;
|
|
padding: 8px;
|
|
}
|
|
|
|
.v-1 {
|
|
bottom: 160px;
|
|
left: 430px;
|
|
}
|
|
|
|
.v-2 {
|
|
bottom: 200px;
|
|
left: 480px;
|
|
}
|
|
|
|
.v-3 {
|
|
bottom: 250px;
|
|
left: 620px;
|
|
}
|
|
|
|
.z-1 > .name-tag:first-child {
|
|
bottom: 205px;
|
|
left: -155px;
|
|
}
|
|
.z-1 > .name-tag:nth-child(2) {
|
|
bottom: 180px;
|
|
left: -130px;
|
|
}
|
|
.v-4 {
|
|
bottom: 300px;
|
|
left: 730px;
|
|
}
|
|
|
|
.v-5 {
|
|
bottom: 340px;
|
|
left: 780px;
|
|
}
|
|
|
|
.v-6 {
|
|
bottom: 360px;
|
|
left: 840px;
|
|
}
|
|
|
|
.z-2 > .name-tag:first-child {
|
|
bottom: 205px;
|
|
left: -140px;
|
|
}
|
|
.z-2 > .name-tag:nth-child(2) {
|
|
bottom: 180px;
|
|
left: -110px;
|
|
}
|
|
.z-2 > .name-tag:nth-child(3) {
|
|
bottom: 152px;
|
|
left: -70px;
|
|
}
|
|
.z-2 > .name-tag:nth-child(4) {
|
|
bottom: 128px;
|
|
left: -50px;
|
|
}
|
|
.z-2 > .name-tag:nth-child(5) {
|
|
bottom: 100px;
|
|
left: -36px;
|
|
}
|
|
|
|
.v-7 {
|
|
bottom: 380px;
|
|
left: 880px;
|
|
}
|
|
|
|
.v-8 {
|
|
bottom: 410px;
|
|
left: 930px;
|
|
}
|
|
|
|
.v-9 {
|
|
bottom: 440px;
|
|
left: 1020px;
|
|
}
|
|
|
|
.v-10 {
|
|
bottom: 260px;
|
|
left: 1100px;
|
|
}
|
|
|
|
.z-3 {
|
|
bottom: 550px;
|
|
left: 1400px;
|
|
/* background: #c003; */
|
|
}
|
|
|
|
.z-3 > .name-tag:first-child {
|
|
bottom: 235px;
|
|
left: -155px;
|
|
}
|
|
|
|
.z-3 > .name-tag:nth-child(2) {
|
|
bottom: 188px;
|
|
left: -85px;
|
|
}
|
|
|
|
.z-3 > .name-tag:nth-child(3) {
|
|
bottom: 120px;
|
|
left: 35px;
|
|
}
|
|
|
|
.b-1 {
|
|
bottom: 570px;
|
|
left: 1440px;
|
|
}
|
|
|
|
.b-2 {
|
|
bottom: 600px;
|
|
left: 1490px;
|
|
}
|
|
|
|
.b-3 {
|
|
bottom: 620px;
|
|
left: 1530px;
|
|
}
|