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

feat: cria responsidade reader #5

Merged
ThiagoDutraSampaioLeite merged 1 commits from feature/criaHeader into main 2022-12-14 19:03:56 +00:00
Conversation 0 Commits 1 Files Changed 2 +56 -4
2 changed files with 56 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
checkout/src/arquivos/js/components/Header.js
View File

@ -10,6 +10,7 @@ export default class Header {
await this.selectors(); await this.selectors();
this.progressBarDesktop(); this.progressBarDesktop();
await this.stepBarProcess(); await this.stepBarProcess();
this.containerMain();
} }
async selectors() { async selectors() {
@ -58,7 +59,7 @@ export default class Header {
</ul> </ul>
`; `;
} }
if (this.progressBar && window.innerWidth < 1024) { if (this.progressBar && window.innerWidth <= 1024) {
this.progressBar.innerHTML = ""; this.progressBar.innerHTML = "";
} }
} }

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

@ -3,14 +3,26 @@
max-width: 100%; max-width: 100%;
width: 100%; width: 100%;
border-bottom: 1px solid $color-black; border-bottom: 1px solid $color-black;
.container { .container {
width: 80% !important; width: 80%;
padding: 29px 0; padding: 29px 0;
@media (min-width: 275px) and (max-width: 1024px) {
width: 100%;
margin: 16px 0;
padding: 0;
} }
}
&__wrapper { &__wrapper {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
@media (max-width: 1024px) {
margin: 0 16px;
}
} }
&__logo { &__logo {
@ -18,6 +30,10 @@
height: 37px; height: 37px;
width: auto; width: auto;
} }
@media (max-width: 375px) {
width: 100%;
}
} }
&__safeBuy { &__safeBuy {
@ -42,6 +58,10 @@
height: 15px; height: 15px;
margin-right: 8px; margin-right: 8px;
} }
@media (max-width: 375px) {
width: 100%;
}
} }
#progressBar { #progressBar {
width: 43%; width: 43%;
@ -100,7 +120,7 @@
&__line { &__line {
position: absolute; position: absolute;
left: 27%; left: 27%;
width: calc(100% + 25px); width: calc(100% + 50px);
bottom: 5px; bottom: 5px;
transform: translateY(-50%); transform: translateY(-50%);
height: 1px; height: 1px;
@ -110,7 +130,7 @@
&__line2 { &__line2 {
position: absolute; position: absolute;
right: 21%; right: 21%;
width: calc(100% + 30px); width: calc(100% + 60px);
bottom: 5px; bottom: 5px;
transform: translateY(-50%); transform: translateY(-50%);
height: 1px; height: 1px;
@ -126,3 +146,34 @@
} }
} }
} }
.container-main {
// background-color: burlywood;
#cart-title {
// display: none !important;
}
.empty-cart-content {
.empty-cart-title {
font-size: 24px;
font-family: $font-family;
}
.empty-cart-message {
display: none;
}
.empty-cart-links {
.btn {
width: 327px;
background-color: transparent;
border: 1px solid $color-black;
border-radius: 0;
color: $color-black;
}
// .btn::after {
// content: "continuar comprando";
// color: $color-black;
// }
}
}
}