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

Merge pull request 'feat: checkout' (#9) from feature/checkout into main

Browse Source 
Reviewed-on: #9
This commit is contained in:
ThiagoDutraSampaioLeite 2022-12-22 18:24:44 +00:00
commit d3e34a2a51
3 changed files with 79 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
checkout/src/arquivos/sass/checkout/_checkout-autenticacao.scss
View File

@ -1,13 +1,9 @@
.checkout-container { .checkout-container {
i {
display: none;
}
.client-pre-email { .client-pre-email {
border-color: $color-black-500; border-color: $color-black-500;
font-family: $font-family; font-family: $font-family;
padding-top: 8px; padding-top: 8px;
input { input {
// color: $color-black-500;
font-size: 12px; font-size: 12px;
} }
@ -151,17 +147,23 @@
margin-bottom: 8px; margin-bottom: 8px;
padding: 0; padding: 0;
i::before { i {
fill: #303030; display: none;
}
.icon-edit {
display: block;
color: #00c8ff;
font-size: 20px;
width: 20px;
height: 20px;
} }
} }
a { a {
align-items: center; align-items: center;
background-color: #303030; background-color: transparent;
border-radius: 8px; border-radius: 8px;
border: none; border: none;
color: $color-white;
display: flex; display: flex;
justify-content: center; justify-content: center;
padding: 6px 5px 6px 8px; padding: 6px 5px 6px 8px;
@ -180,15 +182,22 @@
p { p {
label { label {
color: $color-gray2; color: $color-gray2;
font-weight: 500; font-weight: 700;
font-size: 12px;
} }
select, select,
input { input {
display: flex;
max-width: 100%;
border-radius: 5px; border-radius: 5px;
border: 1px solid $color-gray7; border: 1px solid $color-gray7;
box-shadow: none; box-shadow: none;
} }
#ship-postalCode {
width: 100%;
max-width: 94%;
}
.help.error { .help.error {
color: red; color: red;
@ -249,13 +258,13 @@
.vtex-omnishipping-1-x-deliveryGroup { .vtex-omnishipping-1-x-deliveryGroup {
p { p {
color: #303030; color: $color-gray2;
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 700;
line-height: 19px;
} }
.shp-lean { .shp-lean {
border: 1px solid $color-gray4;
border-radius: 0; border-radius: 0;
label { label {
@ -283,19 +292,19 @@
.address-summary { .address-summary {
background: none; background: none;
border-color: $color-gray4;
border-radius: 0; border-radius: 0;
color: #303030; color: #303030;
padding: 12px; padding: 12px;
border-radius: 8px;
@include mq(md, max) { @include mq(md, max) {
background-position: 8px 9px; background-position: 8px 9px;
} }
a { a {
color: #303030; color: $color-blue-100;
font-weight: 500; font-weight: 500;
text-decoration: underline; margin-left: 24px;
} }
} }
@ -318,12 +327,18 @@
} }
.vtex-omnishipping-1-x-deliveryChannelsToggle { .vtex-omnishipping-1-x-deliveryChannelsToggle {
background-color: #d8c8ac; background-color: $color-white;
border: 1px solid #d8c8ac; border: 1px solid $color-black-500;
} }
.vtex-omnishipping-1-x-deliveryOptionActive { .vtex-omnishipping-1-x-deliveryOptionActive {
text-shadow: 1.3px 1px lighten($color-black, 50); color: $color-black-500;
line-height: 19px;
}
.vtex-omnishipping-1-x-addressFormPart1 {
small {
margin-left: 0;
}
} }
} }
} }

39
checkout/src/arquivos/sass/checkout/_checkout-carrinho.scss
View File

@ -19,13 +19,11 @@
display: none; display: none;
} }
.cart { .cart {
border: 1px solid $color-gray3;
box-sizing: border-box; box-sizing: border-box;
border-radius: 5px; border-radius: 5px;
padding: 16px;
@include mq(md, max) { @include mq(md, max) {
margin: 0px 0 25px 0; margin: 0px 0 48px 0;
border-left: none; border-left: none;
border-right: none; border-right: none;
border-radius: 0; border-radius: 0;
@ -37,12 +35,15 @@
.cart-fixed { .cart-fixed {
font-family: $font-family; font-family: $font-family;
width: 100%; width: 100%;
border: 1px solid $color-gray3;
border-radius: 5px;
h2 { h2 {
background: $color-white; background: $color-white;
border: none; border: none;
color: #303030; color: #303030;
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
text-align: start;
} }
.item-unavailable { .item-unavailable {
@ -54,7 +55,7 @@
} }
.cart { .cart {
border: 1px solid $color-gray4; // border: 1px solid $color-gray4;
ul li { ul li {
border-top: none; border-top: none;
@ -112,8 +113,27 @@
} }
.cart-items { .cart-items {
.badge {
display: none;
}
@media (max-width: 1024px) {
thead {
display: none;
}
td {
vertical-align: top;
}
}
.product-item { .product-item {
padding: 16px 0; padding: 16px 0;
@media (max-width: 1024px) {
.shipping-date,
.quantity-price {
display: none;
}
}
} }
th { th {
@ -511,11 +531,11 @@
text-transform: uppercase; text-transform: uppercase;
&:hover { &:hover {
background-color: lighten($color-black, 5); background-color: lighten($color-blue-100, 5);
} }
&:active { &:active {
background-color: darken($color-black, 5); background-color: darken($color-blue-100, 5);
} }
} }
@ -703,11 +723,11 @@
} }
&:hover { &:hover {
background-color: lighten($color-black, 5); background-color: lighten($color-blue-100, 5);
} }
&:active { &:active {
background-color: darken($color-black, 5); background-color: darken($color-blue-100, 5);
} }
} }
} }
@ -761,6 +781,9 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 343px; width: 343px;
@media (max-width: 1024px) {
width: 100%;
}
@include mq(md, max) { @include mq(md, max) {
padding: 0 16px; padding: 0 16px;

15
checkout/src/arquivos/sass/partials/_body.scss
View File

@ -40,4 +40,19 @@
} }
} }
} }
@media (max-width: 1024px) {
.row-fluid .summary {
display: flex;
flex-direction: column;
.totalizers {
display: flex;
flex-direction: column;
width: 100%;
margin: 0;
}
.coupon-fieldset {
margin-top: 48px;
}
}
}
} }