Mudanças entre as edições de "Predefinição:Reward/styles.css"
Ir para navegação
Ir para pesquisar
| Linha 2: | Linha 2: | ||
content: attr(data-tooltip); | content: attr(data-tooltip); | ||
position: absolute; | position: absolute; | ||
bottom: | bottom: 120%; | ||
left: 50%; | left: 50%; | ||
transform: translateX(-50%); | transform: translateX(-50%); | ||
background: # | background: #2c2c2c; | ||
color: #fff; | color: #fff; | ||
padding: | padding: 8px 10px; | ||
font-size: 12px; | font-size: 12px; | ||
line-height: 1.4; | |||
border-radius: 6px; | |||
box-shadow: 0 2px 6px rgba(0,0,0,0.3); | |||
white-space: pre-line; | white-space: pre-line; | ||
max-width: 200px; | |||
text-align: center; | |||
z-index: | z-index: 999; | ||
} | } | ||
| Linha 19: | Linha 21: | ||
content: ""; | content: ""; | ||
position: absolute; | position: absolute; | ||
bottom: calc( | bottom: calc(120% - 4px); | ||
left: 50%; | left: 50%; | ||
transform: translateX(-50%); | transform: translateX(-50%); | ||
border: 6px solid transparent; | border: 6px solid transparent; | ||
border-top-color: # | border-top-color: #2c2c2c; | ||
z-index: | z-index: 998; | ||
} | } | ||
Edição das 20h32min de 8 de junho de 2025
.item-wrapper[data-tooltip]:hover::after {
content: attr(data-tooltip);
position: absolute;
bottom: 120%;
left: 50%;
transform: translateX(-50%);
background: #2c2c2c;
color: #fff;
padding: 8px 10px;
font-size: 12px;
line-height: 1.4;
border-radius: 6px;
box-shadow: 0 2px 6px rgba(0,0,0,0.3);
white-space: pre-line;
max-width: 200px;
text-align: center;
z-index: 999;
}
.item-wrapper[data-tooltip]:hover::before {
content: "";
position: absolute;
bottom: calc(120% - 4px);
left: 50%;
transform: translateX(-50%);
border: 6px solid transparent;
border-top-color: #2c2c2c;
z-index: 998;
}
.reward-wrapper {
display: inline-block;
margin: 8px 0;
font-family: Arial, sans-serif;
}
.reward-title {
font-weight: bold;
font-size: 16px;
text-transform: uppercase;
color: #444;
margin-bottom: 4px;
}
.reward-items {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
}
.item-wrapper {
display: inline-block;
position: relative;
margin: 0 4px;
overflow: visible;
}
.item-wrapper img {
vertical-align: bottom;
}
.item-count {
position: absolute;
bottom: -4px;
right: -4px;
font-size: 10px;
font-weight: bold;
background: rgba(0, 0, 0, 0.75);
color: white;
padding: 1px 4px;
border-radius: 4px;
line-height: 1;
box-shadow: 0 0 2px #000;
white-space: nowrap;
z-index: 2;
}
.item-wrapper:hover .item-count {
background: rgba(0, 0, 0, 0.9);
}