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

feat: ajuste na logo e adicionando o html

Browse Source
This commit is contained in:
Matheus Mariosa 2022-12-20 17:36:37 -03:00
parent 30555d9098
commit 2284341c74
3 changed files with 26 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -4,18 +4,31 @@ import { waitElement } from "m3-utils";
export default class Header { export default class Header {
constructor() { constructor() {
this.init(); this.init();
this.ProgresseBar.bind(this);
} }
async init() { async init() {
await this.selectors(); await this.selectors();
console.log(this.item); this.ProgresseBar();
} }
async selectors() { async selectors() {
this.item = await waitElement("#my-element", { this.barHTML = await waitElement(".progress-bar");
//#my-element pode ser a class ou o id do elemento html qeu vocÊ quer pegar }
timeout: 5000, // vai esperar 5 segundos antes de rejeitar a promise
interval: 1000, // vai verificar a cada 1 segundo se o elemento existe ProgresseBar() {
}); this.barHTML.innerHTML = `
<ul>
<li class="conteiner-progressBar">
<div class="conteinerItems"><p class="textBar">Meu Carrinho</p><div class="circle"></div></div>
</li>
<li class="conteiner-progressBar">
<div class="conteinerItems"><p class="textBar">Meu Carrinho</p><div class="circle"></div></div>
</li>
<li class="conteiner-progressBar">
<div class="conteinerItems"><p class="textBar">Meu Carrinho</p><div class="circle"></div></div>
</li>
</ul>
`;
} }
} }

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

@ -1,5 +1,6 @@
/* _header.scss */ /* _header.scss */
.headerCheckout { .headerCheckout {
border-bottom: 1px solid #000;
.container { .container {
width: auto !important; width: auto !important;
} }
@ -7,12 +8,12 @@
align-items: center; align-items: center;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} margin: 29px 0;
};
&__logo { &__logo {
img { img {
height: 52px; height: 37.14px;
width: auto;
} }
} }
@ -33,4 +34,5 @@
margin-right: 8px; margin-right: 8px;
} }
} }
} }

2
package-lock.json generated
View File

@ -45,6 +45,7 @@
"jquery": "^3.6.0", "jquery": "^3.6.0",
"m3-utils": "^0.1.0", "m3-utils": "^0.1.0",
"sass": "^1.38.1", "sass": "^1.38.1",
"slick-carousel": "^1.8.1",
"terser-webpack-plugin": "^5.1.4" "terser-webpack-plugin": "^5.1.4"
}, },
"devDependencies": { "devDependencies": {
@ -19345,6 +19346,7 @@
"m3-utils": "^0.1.0", "m3-utils": "^0.1.0",
"prettier": "^2.3.2", "prettier": "^2.3.2",
"sass": "^1.38.1", "sass": "^1.38.1",
"slick-carousel": "^1.8.1",
"terser-webpack-plugin": "^5.1.4", "terser-webpack-plugin": "^5.1.4",
"webpack": "^5.51.1", "webpack": "^5.51.1",
"webpack-merge": "^5.8.0" "webpack-merge": "^5.8.0"