feat(body): Estilizando o carrinho

This commit is contained in:
Savio Carvalho Moraes 2022-12-16 18:19:55 -03:00
parent 71bb9076ea
commit 194d9ddbc6

View File

@ -12,7 +12,7 @@
align-items: center; align-items: center;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin: 0 !important; margin: 50px 0 0 0 !important;
} }
.container { .container {
width: 100%; width: 100%;
@ -36,54 +36,82 @@
line-height: 38px; line-height: 38px;
} }
.infoCards { .infoCards {
width: 79.375%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 16px;
.infoCard { .infoCard {
width: 23.81%; width: 242px;
height: 390px; height: 390px;
border: 1px solid #000; border: 1px solid #000;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
&__image { &__image {
width: 100%; max-width: 100%;
object-fit: fill; height: 242px;
object-fit: cover;
border-radius: 8px; border-radius: 8px;
} }
&__text { &__text {
display: flex;
width: 100%;
margin-top: 20px; margin-top: 20px;
margin-bottom: 0; margin-bottom: 0;
font-family: $font-family; font-family: $font-family;
font-size: 13px; font-size: 13px;
color: #000; color: #000;
font-weight: 400; font-weight: 400;
justify-content: center;
} }
&__tamanhos { &__tamanhos {
margin-top: 20px; margin-top: 20px;
width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
list-style: none; list-style: none;
margin-left: 0%;
gap: 5px;
justify-content: center;
} }
&__tamanho { &__tamanho {
margin-right: 5px;
background-color: $color-blue-300; background-color: $color-blue-300;
border-radius: 8px; border-radius: 8px;
height: 28px;
display: flex;
justify-content: center;
&__numero { &__numero {
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
&__link { &__link {
color: $color-white; color: $color-white;
margin: 5px; margin: 4px;
font-family: $font-family; font-family: $font-family;
font-size: 13px; font-size: 13px;
font-weight: 700; font-weight: 700;
} }
} }
&__link {
padding: 12px 0;
display: flex;
justify-content: center;
width: 242px;
height: 42px;
margin-top: 32px;
font-family: $font-family;
font-weight: 700;
font-size: 13px;
line-height: 18px;
color: $color-white;
background-color: $color-blue-300;
border-radius: 8px;
&::hoover {
cursor: pointer;
}
}
} }
} }
} }