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

feature/optimization #1

Merged
josecarloslins merged 16 commits from feature/optimization into main 2022-12-17 01:38:19 +00:00
Conversation 0 Commits 16 Files Changed 14 +85 -32
4 changed files with 85 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit cffddb1ead - Show all commits

25
checkout/src/arquivos/sass/checkout/_checkout-vazio.scss
View File

@ -15,7 +15,7 @@
margin: 0; margin: 0;
line-height: 0; line-height: 0;
&::before { &::before {
content: "Seu carrinho está vazio"; content: "Seu carrinho está vazio.";
font-family: "Open Sans"; font-family: "Open Sans";
font-style: normal; font-style: normal;
font-weight: 700; font-weight: 700;
@ -23,6 +23,13 @@
line-height: 33px; line-height: 33px;
text-transform: uppercase; text-transform: uppercase;
} }
@media (max-width: 1024px) {
&::before {
font-size: 18px;
line-height: 25px;
}
}
} }
&-links { &-links {
@ -33,10 +40,9 @@
transition: ease-in 0.22s all; transition: ease-in 0.22s all;
border-radius: 0; border-radius: 0;
box-sizing: border-box; box-sizing: border-box;
width: 34.4936%;
height: 48px; height: 48px;
margin: 32px 0 0 0; margin: 32px 0 0 0;
padding-top: 15px; padding: 16px 64px;
&::before { &::before {
content: "Continuar comprando"; content: "Continuar comprando";
font-family: "Tenor Sans"; font-family: "Tenor Sans";
@ -52,6 +58,12 @@
&:hover { &:hover {
background: $color-white; background: $color-white;
} }
@media (max-width: 1024px) {
width: max-content;
padding: 16px 26px;
margin-top: 22px;
}
} }
} }
} }
@ -68,3 +80,10 @@
.elementInvisible { .elementInvisible {
display: none !important; display: none !important;
} }
@media screen and (max-width: 1024px) {
.link-choose-products .link-choose-products {
padding: 16px 26px;
width: max-content;
}
}

6
checkout/src/arquivos/sass/checkout/_checkout.scss
View File

@ -3,6 +3,12 @@
@import "./checkout-pagamento"; @import "./checkout-pagamento";
@import "./checkout-autenticacao"; @import "./checkout-autenticacao";
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html { html {
height: 100%; height: 100%;
min-height: 100%; min-height: 100%;

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

@ -20,6 +20,16 @@
&::after { &::after {
display: none; display: none;
} }
@media (max-width: 1024px) {
display: grid;
grid-template-areas:
"stamps"
"address"
"develop";
width: 100%;
gap: 16px;
}
} }
} }
@ -33,9 +43,9 @@
text-transform: capitalize; text-transform: capitalize;
max-width: 40%; max-width: 40%;
@include mq(md, max) { @media (max-width: 1024px) {
margin-bottom: 24px;
max-width: 100%; max-width: 100%;
margin-left: 16px;
} }
} }
@ -45,9 +55,9 @@
justify-self: center; justify-self: center;
list-style: none; list-style: none;
@include mq(md, max) { @media (max-width: 1024px) {
align-self: center; grid-area: stamps;
margin-bottom: 12px; margin: 0 0 0 8px;
} }
&__divider { &__divider {
@ -108,6 +118,14 @@
width: 28.66px; width: 28.66px;
height: 15.65px; height: 15.65px;
} }
@media (max-width: 1024px) {
margin-left: 16px;
li:last-child {
margin-left: 11px;
}
}
} }
&__prateleira { &__prateleira {

58
checkout/src/arquivos/sass/partials/_header.scss
View File

@ -37,30 +37,6 @@
// @media (min-width: 1140px) { // @media (min-width: 1140px) {
// width: 82%; // width: 82%;
// } // }
// @media (min-width: 1270px) {
// width: 84%;
// }
// @media (min-width: 1440px) {
// width: 87%;
// }
// @media (min-width: 1810px) {
// width: 89%;
// }
// @media (min-width: 2160px) {
// width: 91%;
// }
// @media (min-width: 2880px) {
// width: 93%;
// }
// @media (min-width: 3510px) {
// width: 95%;
// }
} }
.ProgressBar-step { .ProgressBar-step {
list-style: none; list-style: none;
@ -140,3 +116,37 @@
} }
} }
} }
@media screen and (max-width: 1024px) {
.headerCheckout {
box-sizing: border-box;
.container {
width: 100%;
padding: 0 16px !important;
box-sizing: border-box;
}
.headerCheckout__safeBuy {
white-space: nowrap;
img {
width: 12px;
height: 13.33px;
}
}
&__wrapper {
padding: 16px 0;
#progressBar {
display: none;
}
}
&__logo {
width: 155.58px;
img {
width: 100%;
}
}
}
}