feat(footer): criado e alterado estilização.

This commit is contained in:
Luiz Felipe Silva 2022-12-26 20:52:42 -03:00
parent 565fe07952
commit 390b738e76

View File

@ -1,23 +1,52 @@
/* _footer.scss */
.footerCheckout {
border-top: none;
color: $color-gray2;
figure {
margin: 0;
}
ul {
padding: 0;
margin: 0 0 0 0;
}
p {
margin: 0;
}
&__wrapper {
align-items: center;
display: flex;
justify-content: space-between;
.container {
border-top: 1px solid $color-black2;
display: flex;
align-items: center;
justify-content: space-between;
width: 95%;
padding: 23px 32px;
@include mq(xl, min) {
padding: 29px 63px;
}
}
.container::before,
.container::after {
display: none;
}
}
&__address {
color: $color-gray2;
font-family: $font-family;
font-style: normal;
font-weight: normal;
font-size: 10px;
line-height: 12px;
font-weight: 400;
line-height: 14px;
color: $color-black1;
text-transform: capitalize;
max-width: 40%;
max-width: 269px;
@include mq(xl, min) {
font-size: 20px;
line-height: 27px;
max-width: 537px;
}
@include mq(md, max) {
margin-bottom: 24px;
@ -31,40 +60,103 @@
justify-self: center;
list-style: none;
li {
display: flex;
}
li:nth-child(1) {
display: flex;
}
li:last-child {
img {
max-width: 53px;
height: 33px;
margin: 0 0 0 10px;
@include mq(xl, min) {
max-width: 103px;
height: 64px;
}
}
}
img {
height: 20px;
max-width: 34px;
margin-right: 13px;
@include mq(xl, min) {
max-width: 69px;
height: 39px;
}
}
@include mq(md, max) {
align-self: center;
margin-bottom: 12px;
}
&__divider {
background-color: $color-gray4;
display: inline-block;
height: 24px;
margin: 0 8px;
width: 1px;
height: 24px;
background-color: $color-gray6;
@include mq(xl, min) {
height: 43px;
}
}
}
&__developedBy {
align-items: center;
display: flex;
align-items: center;
list-style-type: none;
margin: 0;
li:last-child {
li {
margin-left: 16px;
img {
margin-left: 11px;
}
}
a {
align-items: center;
color: $color-gray2;
li:first-child {
img {
max-width: 44px;
height: 16px;
@include mq(xl, min) {
max-width: 87px;
height: 31px;
}
}
}
li:last-child {
img {
max-width: 28px;
height: 15px;
@include mq(xl, min) {
max-width: 55px;
height: 30px;
}
}
}
div {
display: flex;
align-items: center;
font-family: $font-family;
font-style: normal;
font-weight: normal;
font-size: 10px;
line-height: 12px;
text-decoration: none;
font-size: 9px;
font-weight: 400;
color: $color-black1;
@include mq(xl, min) {
font-size: 18px;
line-height: 25px;
}
span {
margin-right: 8px;