Mudanças entre as edições de "Predefinição:Achiev/styles.css"
Ir para navegação
Ir para pesquisar
| Linha 1: | Linha 1: | ||
.conquista-box { | |||
display: flex; | |||
background-color: #f0f4fa; | |||
border: 1px solid #a0b8d0; | |||
border-radius: 6px; | |||
padding: 8px; | |||
font-family: sans-serif; | |||
color: #333; | |||
box-shadow: 0 2px 6px rgba(0,0,0,0.1); | |||
max-width: 600px; | |||
} | |||
.conquista-icon { | .conquista-icon { | ||
width: 82px; | width: 82px; | ||
height: 82px; | height: 82px; | ||
/* moldura via Common.css */ | |||
background-color: #ffffff; | background-color: #ffffff; | ||
border: 3px solid #4a90e2; | border: 3px solid #4a90e2; | ||
| Linha 12: | Linha 25: | ||
justify-content: center; | justify-content: center; | ||
margin-right: 16px; | margin-right: 16px; | ||
padding: 0; | |||
} | } | ||
.conquista-icon img { | .conquista-icon img { | ||
width: 100%; | width: 100%; | ||
| Linha 18: | Linha 33: | ||
border-radius: 7px; | border-radius: 7px; | ||
} | } | ||
.conquista-conteudo { flex-grow: 1; } | |||
.conquista-conteudo { | |||
flex-grow: 1; | |||
} | |||
.conquista-titulo { | .conquista-titulo { | ||
font-weight: bold; | font-weight: bold; | ||
| Linha 24: | Linha 43: | ||
margin-bottom: 4px; | margin-bottom: 4px; | ||
} | } | ||
.conquista-descricao { | .conquista-descricao { | ||
font-size: 1em; | font-size: 1em; | ||
color: #555; | color: #555; | ||
} | } | ||
.conquista-recompensas { | .conquista-recompensas { | ||
display: flex; | display: flex; | ||
| Linha 35: | Linha 56: | ||
margin-top: 10px; | margin-top: 10px; | ||
} | } | ||
.conquista-recompensas .item { | .conquista-recompensas .item { | ||
display: inline-block; | display: inline-block; | ||
position: relative; | position: relative; | ||
margin: 0 4px; | margin: 0 4px; | ||
overflow: visible; | |||
} | } | ||
.conquista-recompensas .item .item-img { | .conquista-recompensas .item .item-img { | ||
display: block; | display: block; | ||
vertical-align: bottom; | vertical-align: bottom; | ||
/* mantém tamanho original da imagem */ | |||
} | } | ||
.conquista-recompensas .item .item-qtd { | .conquista-recompensas .item .item-qtd { | ||
position: absolute; | position: absolute; | ||
| Linha 59: | Linha 85: | ||
z-index: 2; | z-index: 2; | ||
} | } | ||
.conquista-recompensas .item:hover .item-qtd { | .conquista-recompensas .item:hover .item-qtd { | ||
background: rgba(0,0,0,0.9); | background: rgba(0,0,0,0.9); | ||
} | } | ||
Edição das 13h45min de 7 de junho de 2025
.conquista-box {
display: flex;
background-color: #f0f4fa;
border: 1px solid #a0b8d0;
border-radius: 6px;
padding: 8px;
font-family: sans-serif;
color: #333;
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
max-width: 600px;
}
.conquista-icon {
width: 82px;
height: 82px;
/* moldura via Common.css */
background-color: #ffffff;
border: 3px solid #4a90e2;
border-radius: 10px;
box-shadow:
0 0 0 2px #b0cce8 inset,
0 0 6px rgba(74,144,226,0.4);
display: flex;
align-items: center;
justify-content: center;
margin-right: 16px;
padding: 0;
}
.conquista-icon img {
width: 100%;
height: 100%;
border-radius: 7px;
}
.conquista-conteudo {
flex-grow: 1;
}
.conquista-titulo {
font-weight: bold;
font-size: 1.3em;
margin-bottom: 4px;
}
.conquista-descricao {
font-size: 1em;
color: #555;
}
.conquista-recompensas {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
gap: 6px;
margin-top: 10px;
}
.conquista-recompensas .item {
display: inline-block;
position: relative;
margin: 0 4px;
overflow: visible;
}
.conquista-recompensas .item .item-img {
display: block;
vertical-align: bottom;
/* mantém tamanho original da imagem */
}
.conquista-recompensas .item .item-qtd {
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;
}
.conquista-recompensas .item:hover .item-qtd {
background: rgba(0,0,0,0.9);
}