luizfelipe9627/m3-academy-template-checkout-luiz-felipe
1
0
Fork 0
forked from M3-Academy/m3-academy-template-checkout
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Luiz Felipe Silva 2022-12-26 20:52:42 -03:00
parent 565fe07952
commit 390b738e76
1 changed files with 116 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

136
checkout/src/arquivos/sass/partials/_footer.scss
View File

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