Widget:SearchQuestStyle: mudanças entre as edições
Ir para navegação
Ir para pesquisar
(Criou página com 'a { text-decoration: none; color: inherit; } #quests-container { padding: 1rem 2rem; width: 100%; display: grid; grid-template-columns: repeat(auto-fill, minmax(32rem, 1fr)); gap: 1.5rem; } #quests-form { padding: 2rem; display: flex; flex-direction: column; align-items: center; gap: 1rem; } .level { opacity: .6; font-size: .8rem; letter-spacing: .05rem; padding-inline-start: .2rem; } .card { width: clamp(37...') |
(Sem diferença)
|
Edição das 00h31min de 3 de novembro de 2023
a {
text-decoration: none; color: inherit;
}
- quests-container {
padding: 1rem 2rem; width: 100%; display: grid; grid-template-columns: repeat(auto-fill, minmax(32rem, 1fr)); gap: 1.5rem;
}
- quests-form {
padding: 2rem; display: flex; flex-direction: column; align-items: center; gap: 1rem;
}
.level {
opacity: .6; font-size: .8rem; letter-spacing: .05rem; padding-inline-start: .2rem;
}
.card {
width: clamp(37rem, 2vw, 44rem); height: clamp(11rem, 2vh, 14rem); display: flex; align-items: flex-start;
gap: .725rem; border-radius: 8px; overflow: hidden; border: 2px solid #9D72D6;
}
.card main {
flex-basis: 60%; height: 100%; padding: 1rem;
}
.card main h2 {
font-size: 1.5rem; font-weight: 500; color: #200245; margin-bottom: .35rem;
}
.description-container {
display: -webkit-box; -webkit-box-orient: vertical; -moz-box-orient: vertical; -ms-box-orient: vertical; box-orient: vertical; -webkit-line-clamp: 5; -moz-line-clamp: 5; -ms-line-clamp: 5; line-clamp: 5; overflow: hidden;
text-overflow: ellipsis; overflow: hidden;
}
.card main p {
font-size: clamp(.75rem, 1vw, .8rem); font-weight: 400; text-align: justify; color: #717072;
}
aside {
flex-basis: 40%; height: 100%; aspect-ratio: 9/7;
display: flex; align-items: stretch; overflow: hidden;
}
aside img {
width: 103%; height: auto; transition: transform .25s ease;
}
.card:hover aside img {
transform: scale(1.17) rotate(2.5deg);
}
.icon-container {
display: flex; align-items: flex-start; gap: .5rem;
margin-block-end: .3rem;
}
.icon-container img {
width: 16px;
}
.d-flex {
display: flex; gap: 1.5rem;
}