Mudanças entre as edições de "Predefinição:Teste/styles.css"
Ir para navegação
Ir para pesquisar
m Etiqueta: Revertido |
m Etiqueta: Revertido |
||
| Linha 1: | Linha 1: | ||
@media (min-width: 800px) and (max-width: 1610px) and (min-aspect-ratio: 3/4) and (max-aspect-ratio: 16/10){ | @media (min-width: 800px) and (max-width: 1610px) and (min-aspect-ratio: 3/4) and (max-aspect-ratio: 16/10){ | ||
. | .character-class{ font-size: 1.15em; } | ||
.tab-btn { | .character-tab-btn { | ||
padding: 6px 18px; | padding: 6px 18px; | ||
} | } | ||
| Linha 7: | Linha 7: | ||
width: 100% !important; | width: 100% !important; | ||
} | } | ||
.art | .character-art { | ||
display: none; | display: none; | ||
width: 360px; | width: 360px; | ||
| Linha 16: | Linha 16: | ||
z-index: 9; | z-index: 9; | ||
} | } | ||
.tab-content{ | .character-tab-content{ | ||
padding: 0 8px 20px; | padding: 0 8px 20px; | ||
} | } | ||
. | .character-details { | ||
flex: 1; | flex: 1; | ||
display: flex; | display: flex; | ||
| Linha 28: | Linha 28: | ||
align-self: center; | align-self: center; | ||
} | } | ||
. | .character-container{ | ||
flex-direction:column-reverse; | flex-direction:column-reverse; | ||
} | } | ||
. | .character-skillbar { | ||
display: flex; | display: flex; | ||
flex-wrap: nowrap; | flex-wrap: nowrap; | ||
| Linha 44: | Linha 44: | ||
} | } | ||
. | .character-description h3{ | ||
justify-self: center; | justify-self: center; | ||
} | } | ||
. | .character-skillbar .character-skill { | ||
flex: 0 0 auto; | flex: 0 0 auto; | ||
width: 40px; | width: 40px; | ||
| Linha 55: | Linha 55: | ||
transition: transform 0.2s, box-shadow 0.2s; | transition: transform 0.2s, box-shadow 0.2s; | ||
} | } | ||
. | .character-description .descLevel{ | ||
margin-top: 5px; | margin-top: 5px; | ||
justify-self: center; | justify-self: center; | ||
| Linha 61: | Linha 61: | ||
border-bottom: 2px solid #9d9c9c; | border-bottom: 2px solid #9d9c9c; | ||
} | } | ||
.video-container { | .character-video-container { | ||
width: 50%; | width: 50%; | ||
display: flex; | display: flex; | ||
| Linha 72: | Linha 72: | ||
border-radius: 1%; | border-radius: 1%; | ||
} | } | ||
. | .character-box{ | ||
width:97%; | width:97%; | ||
} | } | ||
} | } | ||
Edição das 17h09min de 8 de agosto de 2025
@media (min-width: 800px) and (max-width: 1610px) and (min-aspect-ratio: 3/4) and (max-aspect-ratio: 16/10){
.character-class{ font-size: 1.15em; }
.character-tab-btn {
padding: 6px 18px;
}
.attribute-title, .card-skins-title {
width: 100% !important;
}
.character-art {
display: none;
width: 360px;
height: 267px;
position: absolute;
right: 0.7rem;
top: 0.9rem;
z-index: 9;
}
.character-tab-content{
padding: 0 8px 20px;
}
.character-details {
flex: 1;
display: flex;
flex-direction: column;
gap: 10px;
justify-content: center;
width: 90%;
align-self: center;
}
.character-container{
flex-direction:column-reverse;
}
.character-skillbar {
display: flex;
flex-wrap: nowrap;
gap: 16px;
width: 95%;
overflow-x: auto;
overflow-y: hidden;
padding-bottom: 8px;
margin-bottom: 1%;
justify-self: center;
justify-content: center;
}
.character-description h3{
justify-self: center;
}
.character-skillbar .character-skill {
flex: 0 0 auto;
width: 40px;
height: 40px;
border-radius: 5px;
cursor: pointer;
transition: transform 0.2s, box-shadow 0.2s;
}
.character-description .descLevel{
margin-top: 5px;
justify-self: center;
font-weight: bold;
border-bottom: 2px solid #9d9c9c;
}
.character-video-container {
width: 50%;
display: flex;
align-items: center;
justify-content: center;
background-color: #000;
padding: 0;
overflow: hidden;
align-self: center;
border-radius: 1%;
}
.character-box{
width:97%;
}
}