naianfelix/m3-academy-template-checkout-naian-felix
1
0
Fork 0
forked from M3-Academy/m3-academy-template-checkout
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feature: estiliza footer desktop

Browse Source
This commit is contained in:
Naian Felix dos Santos 2022-12-18 21:13:35 -03:00
parent 3e7a81c220
commit b6c0ed5b4f
1 changed files with 81 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -6,30 +6,69 @@
&__wrapper { &__wrapper {
align-items: center; align-items: center;
display: flex; display: flex;
}
.container {
display: flex;
align-items: center;
margin: 0;
justify-content: space-between; justify-content: space-between;
@media (min-width: 1200px) {
width: 100%;
}
@include mq(md, max) {
margin: 0 0 0 9px;
display: grid;
}
}
.color-img {
background-color: rgb(238, 238, 238);
} }
&__address { &__address {
color: $color-gray2;
font-family: $font-family; font-family: $font-family;
font-style: normal; color: $color-gray2;
font-weight: normal; margin: 27px 0 24px 0;
width: 269px;
font-size: 10px; font-size: 10px;
line-height: 12px; line-height: 12px;
text-transform: capitalize; text-transform: capitalize;
max-width: 40%;
@include mq(md, max) { @include mq(md, max) {
margin-bottom: 24px; margin-bottom: 24px;
max-width: 100%; max-width: 100%;
} }
@include mq(xl, min) {
font-family: $font-family;
color: $color-black;
width: 537px;
font-size: 20px;
line-height: 27px;
text-transform: capitalize;
}
@include mq(md, max) {
margin: 0px 0 16px 7px;
font-family: $font-family;
color: $color-black;
font-size: 10px;
line-height: 14px;
width: 269px;
text-transform: capitalize;
}
} }
&__stamps { &__stamps {
align-items: center;
display: flex; display: flex;
align-items: center;
justify-self: center; justify-self: center;
list-style: none; list-style: none;
width: 404px;
margin: 16px 189px 16px 137px;
@include mq(md, max) { @include mq(md, max) {
align-self: center; align-self: center;
@ -37,33 +76,61 @@
} }
&__divider { &__divider {
background-color: $color-gray4;
display: inline-block; display: inline-block;
background-color: $color-gray4;
height: 24px; height: 24px;
margin: 0 8px; margin: 0 8px;
width: 1px; width: 1px;
} }
@include mq(xl, min) {
width: 690px;
}
@include mq(md, max) {
width: 342px;
margin: 16px 0 16px 0;
order: -1;
}
} }
&__developedBy { &__developedBy {
align-items: center;
display: flex; display: flex;
list-style-type: none; align-items: center;
width: 217px;
margin: 0; margin: 0;
list-style-type: none;
li:last-child { .vtex-rigth1 {
margin-left: 16px; width: 15%;
}
.vtex-rigth2 {
width: 8%;
}
.list {
@include mq(xl, min) {
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 25px;
width: 388px;
}
@include mq(md, max) {
margin: 0 0 16px 7px;
}
} }
a { a {
align-items: center;
color: $color-gray2;
display: flex; display: flex;
font-family: $font-family; font-family: $font-family;
font-style: normal; color: $color-gray2;
font-weight: normal;
font-size: 10px; font-size: 10px;
line-height: 12px; line-height: 12px;
align-items: center;
text-decoration: none; text-decoration: none;
span { span {