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

feat(Footer): Estiliza botão checkout vazio

Browse Source
This commit is contained in:
William Simão Cavalcante 2022-12-15 11:05:11 -03:00
parent 6c553ca7e5
commit 2983fcbe2e
4 changed files with 46 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
checkout/src/arquivos/js/components/CheckoutUI.js
View File

@ -41,6 +41,7 @@ export default class CheckoutUI {
this.configThumb(); this.configThumb();
waitForEl(".product-image img", this.resizeImages.bind(this)); waitForEl(".product-image img", this.resizeImages.bind(this));
$(window).on("orderFormUpdated.vtex", this.resizeImages.bind(this)); $(window).on("orderFormUpdated.vtex", this.resizeImages.bind(this));
this.changeTitleChooseProduct();
} }
configThumb() { configThumb() {
@ -66,4 +67,5 @@ export default class CheckoutUI {
); );
}); });
} }
} }

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

@ -10,30 +10,61 @@
} }
&-title { &-title {
font-size: 20px; font-size: 24px;
font-family: $font-family;
font-weight: 700;
line-height: 33px;
text-align: center;
text-transform: uppercase;
font-style: normal;
} }
&-links { &-links {
display: flex;
justify-content: center;
align-items: center;
.link-choose-products { .link-choose-products {
background: $color-black; display: flex;
border: none; justify-content: center;
border-radius: 5px; align-items: center;
width: 327px;
height: 48px;
background: $color-white;
border: 1px solid $color-black-500;
border-radius: 0;
transition: ease-in 0.22s all; transition: ease-in 0.22s all;
outline: none; outline: none;
font-family: $font-family; font-family: $font-family-secundary;
font-style: normal; font-style: normal;
font-weight: 500; font-weight: 400;
font-size: 14px; font-size: 14px;
line-height: 16px; line-height: 16px;
text-align: center; text-align: center;
letter-spacing: 0.05em; letter-spacing: 0.05em;
color: $color-white; color: $color-black-500;
text-transform: uppercase; text-transform: uppercase;
&:hover { &:hover {
background: lighten($color-black, 5); background: $color-blue-200;
color: $color-white;
} }
} }
.btn {
padding: 0;
}
.btn-large {
padding: 0;
}
}
.hide {
display: none;
}
&-message {
display: none;
} }
} }

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

@ -49,6 +49,10 @@ body {
.container-order-form, .container-order-form,
.container-cart { .container-cart {
width: 80%; width: 80%;
#cart-title {
display: none !important;
}
} }
} }

1
checkout/src/arquivos/sass/utils/_variaveis.scss
View File

@ -16,6 +16,7 @@ $color-gray3: #f0f0f0;
$color-gray4: #8d8d8d; $color-gray4: #8d8d8d;
$color-gray5: #e5e5e5; $color-gray5: #e5e5e5;
$color-blue-200: #00C8FF;
$color-blue: #4267b2; $color-blue: #4267b2;
$color-green: #4caf50; $color-green: #4caf50;