diff --git a/checkout/src/arquivos/js/components/Footer.js b/checkout/src/arquivos/js/components/Footer.js
index ddbfee7..5d05f7c 100644
--- a/checkout/src/arquivos/js/components/Footer.js
+++ b/checkout/src/arquivos/js/components/Footer.js
@@ -8,12 +8,14 @@ export default class Footer {
async init() {
await this.selectors();
// this.onUpdate();
+ await this.footerCheckout();
}
async selectors() {
//Para verificar se o carrinho está vazio e remover a prateleira de produtos:
// vocês devem olhar a doc fornecida no Desafio para aprender a usar o waitElement
this.checkoutVazio = await waitElement(".empty-cart-content");
+ this.footerCheckoutstamps = await waitElement(".footerCheckout__stamps");
}
onUpdate() {
@@ -37,4 +39,42 @@ export default class Footer {
slidesToScroll: 1,
});
}
+
+ footerCheckout() {
+ this.footerCheckoutstamps.innerHTML = `
+
+
+
+
+
+
+ `;
+ }
+
}
diff --git a/checkout/src/arquivos/sass/partials/_footer.scss b/checkout/src/arquivos/sass/partials/_footer.scss
index 32641ba..b4aa12c 100644
--- a/checkout/src/arquivos/sass/partials/_footer.scss
+++ b/checkout/src/arquivos/sass/partials/_footer.scss
@@ -1,14 +1,17 @@
/* _footer.scss */
.footerCheckout {
- border-top: none;
+ border-top: 1px solid #000000;
color: $color-gray2;
-
+ bottom: 0;
+ position: absolute;
+ width: 100%;
&__wrapper {
& .container {
display: flex;
justify-content: space-between;
align-items: center;
padding: 16px 0;
+ width: 100%;
&::before, &::after {
content: none;
}
@@ -43,6 +46,22 @@
// margin-bottom: 12px;
}
+ & li {
+ display: flex;
+ & .footerCheckout__payments {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-left: 0;
+ & li {
+ height: 20px;
+ }
+ & .vtexPCIM {
+ height: 33px;
+ }
+ }
+ }
+
&__divider {
background-color: $color-gray4;
display: inline-block;