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 +158 -10932
5 changed files with 158 additions and 10932 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit f771f512d8 - Show all commits

10970
checkout/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

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

@ -3,10 +3,11 @@ import { Container } from "m3-utils";
import "slick-carousel"; import "slick-carousel";
import Header from "./components/Header"; import Header from "./components/Header";
import Footer from "./components/Footer"; import Footer from "./components/Footer";
import Content from "./components/content";
const m3Checkout = new Container({ const m3Checkout = new Container({
appName: "m3-checkout", appName: "m3-checkout",
components: [CheckoutUI, Header, Footer], components: [CheckoutUI, Content, Header, Footer],
}); });
m3Checkout.start(); m3Checkout.start();

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

@ -1,38 +1,59 @@
.empty-cart { .empty-cart {
font-family: $font-family; &-content {
&-content { color: $color-black-neutra;
color: $color-black; text-align: center;
text-align: center; margin: 170px 0 262px 0;
width: 100%;
@include mq(md, max) { @include mq(md, max) {
padding: 0 16px; padding: 0 16px;
} }
} }
&-title { &-title {
font-size: 20px; font-family: "Open Sans";
} font-style: normal;
font-weight: 700;
font-size: 24px;
line-height: 33px;
text-transform: uppercase;
margin: 0;
}
&-links { &-links {
.link-choose-products { .link-choose-products {
background: $color-black; background: $color-white;
border: none; border: 1px solid $color-black-neutra;
border-radius: 5px; transition: ease-in 0.22s all;
transition: ease-in 0.22s all; border-radius: 0;
outline: none; font-family: "Tenor Sans";
font-family: $font-family; font-style: normal;
font-style: normal; font-weight: 400;
font-weight: 500; font-size: 14px;
font-size: 14px; line-height: 16px;
line-height: 16px; text-align: center;
text-align: center; text-transform: uppercase;
letter-spacing: 0.05em; color: $color-black-neutra;
color: $color-white;
text-transform: uppercase;
&:hover { box-sizing: border-box;
background: lighten($color-black, 5); width: 34.4936%;
} height: 48px;
} margin: 32px 0 0 0;
} padding-top: 15px;
&:hover {
background: $color-white;
}
}
}
}
#cart-title,
.empty-cart-message,
.transactions-container {
display: none !important;
}
.cart-template {
margin: 0 !important;
} }

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

@ -11,11 +11,12 @@ html {
footer .footerCheckout__wrapper { footer .footerCheckout__wrapper {
width: 94.9734%; width: 94.9734%;
margin: auto auto 0 auto; margin: auto auto 0 auto;
padding: 16px 0;
} }
footer .footerCheckout__prateleira, footer .footerCheckout__prateleira,
header { header {
width: 79.53125%; width: 100%;
margin: 0 auto; border-bottom: 1px solid #000000;
} }
body { body {

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

@ -2,12 +2,13 @@
@import url("https://fonts.googleapis.com/css2?family=Tenor+Sans&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Tenor+Sans&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap");
$font-family: "Open Sans", sans-serif; $font-family: "Open Sans", sans-serif;
$font-family-secundary:"Tenor Sans", sans-serif; $font-family-secundary: "Tenor Sans", sans-serif;
/* Colors */ /* Colors */
$color-black: #292929; $color-black: #292929;
$color-black-neutra: #000000;
$color-white: #fff; $color-white: #ffffff;
$color-gray: #6c6c6c; $color-gray: #6c6c6c;
$color-gray2: #7d7d7d; $color-gray2: #7d7d7d;
@ -21,18 +22,18 @@ $color-green: #4caf50;
/* Grid breakpoints */ /* Grid breakpoints */
$grid-breakpoints: ( $grid-breakpoints: (
xs: 0, xs: 0,
cstm: 400, cstm: 400,
sm: 576px, sm: 576px,
md: 768px, md: 768px,
lg: 992px, lg: 992px,
xl: 1200px xl: 1200px,
) !default; ) !default;
$z-index: ( $z-index: (
level1: 5, level1: 5,
level2: 10, level2: 10,
level3: 15, level3: 15,
level4: 20, level4: 20,
level5: 25 level5: 25,
) !default; ) !default;