993
edições
Sem resumo de edição |
Sem resumo de edição |
||
(9 revisões intermediárias pelo mesmo usuário não estão sendo mostradas) | |||
Linha 19: | Linha 19: | ||
#app-quests{ | #app-quests{ | ||
box-sizing: border-box; | box-sizing: border-box; | ||
padding: 1rem | padding: 1rem 0; | ||
width: 100%; | width: 100%; | ||
display: grid; | display: grid; | ||
grid-template-columns: repeat(auto-fill, minmax(32rem, 1fr)); | grid-template-columns: repeat(auto-fill, minmax(32rem, 1fr)); | ||
gap: | place-items: center; | ||
gap: 2rem; | |||
} | } | ||
Linha 43: | Linha 44: | ||
.card { | .card { | ||
font-family: "Sora"; | font-family: "Sora"; | ||
width: clamp( | width: clamp(33.5rem, 2vw, 45rem); | ||
height: clamp( | height: clamp(10.7rem, 2vh, 14rem); | ||
display: flex; | display: flex; | ||
align-items: flex-start; | align-items: flex-start; | ||
Linha 52: | Linha 53: | ||
overflow: hidden; | overflow: hidden; | ||
border: 2px solid #9D72D6; | border: 2px solid #9D72D6; | ||
transition: all .25s ease; | |||
} | |||
.card:hover { | |||
transform: scale(.975); | |||
} | } | ||
.card main { | .card main { | ||
position: relative; | |||
flex-basis: 60%; | flex-basis: 60%; | ||
height: 100%; | height: 100%; | ||
padding: 1rem; | padding: 1rem; | ||
padding-top: .5rem; | |||
} | } | ||
Linha 64: | Linha 72: | ||
font-weight: 500; | font-weight: 500; | ||
color: #200245; | color: #200245; | ||
margin-bottom: | margin-bottom: 0; | ||
} | } | ||
Linha 73: | Linha 81: | ||
-ms-box-orient: vertical; | -ms-box-orient: vertical; | ||
box-orient: vertical; | box-orient: vertical; | ||
-webkit-line-clamp: | -webkit-line-clamp: 3; | ||
-moz-line-clamp: | -moz-line-clamp: 3; | ||
-ms-line-clamp: | -ms-line-clamp: 3; | ||
line-clamp: | line-clamp: 3; | ||
overflow: hidden; | overflow: hidden; | ||
Linha 100: | Linha 108: | ||
aside img { | aside img { | ||
width: 105%; | |||
width: | |||
height: auto; | height: auto; | ||
transition: transform .25s ease; | transition: transform .25s ease; | ||
} | } | ||
.icon-container { | .icon-container { | ||
position: absolute; | |||
bottom: 1.4rem; | |||
display: flex; | display: flex; | ||
align-items: flex-start; | align-items: flex-start; | ||
Linha 119: | Linha 124: | ||
.icon-container img { | .icon-container img { | ||
width: | width: 28px; | ||
} | } | ||
Linha 130: | Linha 135: | ||
color: #fff; | color: #fff; | ||
border-radius: 6px; | border-radius: 6px; | ||
cursor: pointer; | |||
transition: all .25s ease; | transition: all .25s ease; | ||
} | } |