|
|
Строка 98: |
Строка 98: |
| | | |
| background-color: var(--color-surface-4); | | background-color: var(--color-surface-4); |
| }
| |
|
| |
| /*** Оформление блока слота и его содержимого ***/
| |
| .item-slot {
| |
| display: flex;
| |
| justify-content: center;
| |
| align-items: center;
| |
| background-image: url("https://wiki.adventurestation.space/images/d/dd/SlotBackground.png");
| |
| background-size: cover;
| |
| width: 110px;
| |
| height: 110px;
| |
| }
| |
|
| |
| .item-slot.back {
| |
| background-image: url("https://wiki.adventurestation.space/images/3/38/Minimal-slot-back.png");
| |
| }
| |
| .item-slot.gloves {
| |
| background-image: url("https://wiki.adventurestation.space/images/0/03/Minimal-slot-gloves.png");
| |
| }
| |
| .item-slot.belt {
| |
| background-image: url("https://wiki.adventurestation.space/images/f/f8/Minimal-slot-belt.png");
| |
| }
| |
| .item-slot.ears {
| |
| background-image: url("https://wiki.adventurestation.space/images/6/6a/Minimal-slot-ears.png");
| |
| }
| |
| .item-slot.headset {
| |
| background-image: url("https://wiki.adventurestation.space/images/e/e1/Minimal-slot-ears_headset.png");
| |
| }
| |
| .item-slot.glasses {
| |
| background-image: url("https://wiki.adventurestation.space/images/a/aa/Minimal-slot-glasses.png");
| |
| }
| |
| .item-slot.lhand {
| |
| background-image: url("https://wiki.adventurestation.space/images/3/3c/Minimal-slot-hand_l.png");
| |
| }
| |
| .item-slot.rhand {
| |
| background-image: url("https://wiki.adventurestation.space/images/6/6f/Minimal-slot-hand_r.png");
| |
| }
| |
| .item-slot.head {
| |
| background-image: url("https://wiki.adventurestation.space/images/2/22/Minimal-slot-head.png");
| |
| }
| |
| .item-slot.id {
| |
| background-image: url("https://wiki.adventurestation.space/images/3/32/Minimal-slot-id.png");
| |
| }
| |
| .item-slot.mask {
| |
| background-image: url("https://wiki.adventurestation.space/images/c/c4/Minimal-slot-mask.png");
| |
| }
| |
| .item-slot.neck {
| |
| background-image: url("https://wiki.adventurestation.space/images/9/9b/Minimal-slot-neck.png");
| |
| }
| |
| .item-slot.pda {
| |
| background-image: url("https://wiki.adventurestation.space/images/6/69/Minimal-slot-pda.png");
| |
| }
| |
| .item-slot.pocket {
| |
| background-image: url("https://wiki.adventurestation.space/images/3/3c/Minimal-slot-pocket.png");
| |
| }
| |
| .item-slot.shoes {
| |
| background-image: url("https://wiki.adventurestation.space/images/3/30/Minimal-slot-shoes.png");
| |
| }
| |
| .item-slot.suit {
| |
| background-image: url("https://wiki.adventurestation.space/images/3/36/Minimal-slot-suit.png");
| |
| }
| |
| .item-slot.suit_storage {
| |
| background-image: url("https://wiki.adventurestation.space/images/4/44/Minimal-slot-suit_storage.png");
| |
| }
| |
| .item-slot.uniform {
| |
| background-image: url("https://wiki.adventurestation.space/images/d/dc/Minimal-slot-uniform.png");
| |
| }
| |
|
| |
| .item-slot .item {
| |
| position: relative;
| |
| }
| |
|
| |
| .item-slot .popup {
| |
| opacity: 0;
| |
| position: absolute;
| |
| width: 0%;
| |
| max-width: 360px;
| |
| max-height: 180px;
| |
| min-width: 0px;
| |
| min-height: 0px;
| |
| left: 80%;
| |
| top: 0%;
| |
| padding: 2px 6px;
| |
| overflow: hidden;
| |
| border: 2px solid #464966;
| |
| background-color: #25272cf2;
| |
| transition: opacity 0.05s linear, min-width 0.1s cubic-bezier(0, 0, 0.2, 1), min-height 0.1s cubic-bezier(0, 0, 0.2, 1);
| |
| }
| |
|
| |
| .item-slot .item:hover .popup {
| |
| opacity: 1;
| |
| z-index: 1;
| |
| min-width: 150px;
| |
| min-height: 50px;
| |
| }
| |
|
| |
| .item-slot .item:hover>span img {
| |
| opacity: 0.25;
| |
| transition: opacity 0.1s linear;
| |
| } | | } |
/*** Блок оформления слота - минимализм ***/
.minimal-slot:hover {
border-image: url("https://wiki.adventurestation.space/images/e/ed/Minimal-slot_highlight.png") 128 stretch;
}
.minimal-slot {
border: 12px solid #242230;
border-image: url("https://wiki.adventurestation.space/images/a/af/Minimal-slot-border.png") 128 stretch;
border-radius: 10px 25px;
background-image: url("https://wiki.adventurestation.space/images/b/b2/Minimal-slot-background.png");
background-size: 2.6px;
}
/*** Чередование строк в таблице ***/
.alternation tr:nth-child(even) {
background-color: var(--color-surface-1);
}
/*** Инфобоксы ***/
/* Мобильная адаптация */
@media(max-width: 700px) {
div.infobox {
float: none;
margin: 16px;
width: auto;
}
}
/* Основные селекторы */
.infobox {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
float: right;
margin-left: 16px;
width: 318px;
background: #000;
}
.inf-title {
padding: 2px 4px;
background-color: var(--color-surface-1);
text-align: center;
font-size: 1.8em;
}
div.infobox > p {
text-align: center; /* Костыль для позиционирования изображений внутри инфобокса*/
}
.inf-row {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
padding: 6px 6px;
border-bottom: solid black 1px;
background-color: var(--color-surface-2);
}
.inf-row:last-child {
border-bottom: none;
}
.inf-row:hover {
background-color: var(--color-surface-2--hover);
}
.inf-label {
flex: 1 2 35%;
text-align: left;
font-weight: bold;
}
.inf-data {
flex: 3 1 65%;
padding-left: 6px;
text-align: left;
}
.inf-header {
padding: 2px 4px;
text-align: center;
font-size: 1.2em;
font-weight: bold;
background-color: var(--color-surface-4);
}