feat(checkout): melhora checkout #3
@ -161,22 +161,23 @@
|
||||
padding: 16px;
|
||||
|
||||
.accordion-heading {
|
||||
.accordion-toggle {
|
||||
margin: 0;
|
||||
.icon-home {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
span {
|
||||
color: #292929;
|
||||
margin-bottom: 8px;
|
||||
font-size: 0px;
|
||||
font-size: 16px;
|
||||
margin-top: 7px;
|
||||
margin-bottom: 25px;
|
||||
padding: 0;
|
||||
|
||||
&::after {
|
||||
content: "Identificação";
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 19px;
|
||||
}
|
||||
i::before {
|
||||
fill: #303030;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@ -195,22 +196,91 @@
|
||||
.accordion-inner {
|
||||
padding: 0;
|
||||
|
||||
.totalizers-list {
|
||||
color: $color-gray2;
|
||||
|
||||
tr {
|
||||
border: 1px solid $color-gray5;
|
||||
}
|
||||
}
|
||||
|
||||
.notification {
|
||||
margin-top: 14px;
|
||||
color: $color-gray2;
|
||||
}
|
||||
|
||||
.box-step {
|
||||
.vtex-omnishipping-1-x-addressForm {
|
||||
.vtex-omnishipping-1-x-address {
|
||||
.ship-number {
|
||||
display: block;
|
||||
width: 100%;
|
||||
#ship-number {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.ship-complement {
|
||||
#ship-complement {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.vtex-omnishipping-1-x-addressFormPart1 {
|
||||
.ship-country {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ship-postalCode {
|
||||
max-width: 100%;
|
||||
#ship-postalCode {
|
||||
display: block;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.box-info {
|
||||
padding-top: 25px;
|
||||
}
|
||||
.shipping-summary-info {
|
||||
color: $color-gray2;
|
||||
padding-top: 15px;
|
||||
}
|
||||
.box-edit {
|
||||
.row-fluid {
|
||||
.box-client-info-pf {
|
||||
margin-top: 36px;
|
||||
}
|
||||
}
|
||||
|
||||
.box-client-info {
|
||||
.newsletter {
|
||||
margin: 12px 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* General configurations */
|
||||
|
||||
.client-notice {
|
||||
color: $color-black;
|
||||
display: none;
|
||||
}
|
||||
|
||||
p {
|
||||
label {
|
||||
color: $color-black;
|
||||
color: #7d7d7d;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
select,
|
||||
input {
|
||||
border-radius: 0;
|
||||
border: 1px solid $color-gray4;
|
||||
border-radius: 5px;
|
||||
border: 1px solid $color-gray5;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@ -220,11 +290,13 @@
|
||||
}
|
||||
|
||||
.box-client-info-pj {
|
||||
display: none;
|
||||
.link a#is-corporate-client,
|
||||
.link a#not-corporate-client {
|
||||
color: $color-black;
|
||||
font-weight: 500;
|
||||
text-decoration: underline;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@ -235,17 +307,24 @@
|
||||
button.submit {
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
background: $color-black;
|
||||
margin-top: 8px;
|
||||
background: $color-blue;
|
||||
margin-top: 39px;
|
||||
outline: none;
|
||||
transition: all 0.2s linear;
|
||||
color: $color-white;
|
||||
width: 100%;
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
line-height: 19.07px;
|
||||
cursor: pointer;
|
||||
text-transform: uppercase;
|
||||
|
||||
&:hover {
|
||||
background: lighten($color-black, 5);
|
||||
background: lighten($color-blue, 5);
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: darken($color-black, 5);
|
||||
background: darken($color-blue, 5);
|
||||
}
|
||||
}
|
||||
|
||||
@ -303,7 +382,7 @@
|
||||
}
|
||||
|
||||
a {
|
||||
color: #303030;
|
||||
color: $color-blue;
|
||||
font-weight: 500;
|
||||
text-decoration: underline;
|
||||
}
|
||||
@ -328,12 +407,12 @@
|
||||
}
|
||||
|
||||
.vtex-omnishipping-1-x-deliveryChannelsToggle {
|
||||
background-color: #d8c8ac;
|
||||
border: 1px solid #d8c8ac;
|
||||
background-color: $color-white;
|
||||
border: 1px solid $color-black;
|
||||
}
|
||||
|
||||
.vtex-omnishipping-1-x-deliveryOptionActive {
|
||||
text-shadow: 1.3px 1px lighten($color-black, 50);
|
||||
color: $color-black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -16,7 +16,6 @@
|
||||
.cart {
|
||||
border: 3px solid $color-gray3;
|
||||
box-sizing: border-box;
|
||||
|
||||
border-radius: 5px;
|
||||
margin-bottom: 48px !important;
|
||||
|
||||
@ -29,10 +28,21 @@
|
||||
}
|
||||
.cart-fixed.affix {
|
||||
position: relative !important;
|
||||
z-index: none !important;
|
||||
}
|
||||
.cart-fixed {
|
||||
font-family: $font-family;
|
||||
width: 100%;
|
||||
z-index: none !important;
|
||||
|
||||
.summary-cart-template-holder {
|
||||
z-index: none !important;
|
||||
overflow: none;
|
||||
|
||||
.cart {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
h2 {
|
||||
background: $color-white;
|
||||
border: none;
|
||||
@ -66,17 +76,6 @@
|
||||
.price {
|
||||
color: #7d7d7d;
|
||||
}
|
||||
|
||||
.shipping-date {
|
||||
font-size: 0 !important;
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: "Frete";
|
||||
color: #7d7d7d;
|
||||
font-size: 14px;
|
||||
line-height: 16.38px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -98,18 +97,18 @@
|
||||
}
|
||||
|
||||
#payment-data-submit {
|
||||
background: $color-black;
|
||||
background: $color-green;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
border-radius: 8px;
|
||||
color: $color-white;
|
||||
outline: none;
|
||||
transition: all 0.2s linear;
|
||||
&:hover {
|
||||
background: lighten($color-black, 5);
|
||||
background: lighten($color-green, 5);
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: darken($color-black, 5);
|
||||
background: darken($color-green, 5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,6 +4,7 @@ body .container-main.container-order-form .orderform-template.active {
|
||||
margin-left: unset;
|
||||
margin-right: 0;
|
||||
float: right;
|
||||
overflow: none !important;
|
||||
}
|
||||
.orderform-template-holder {
|
||||
width: 66.1132%;
|
||||
|
||||
@ -13,7 +13,7 @@ $color-gray: #6c6c6c;
|
||||
$color-gray2: #7d7d7d;
|
||||
$color-gray3: #f0f0f0;
|
||||
$color-gray4: #8d8d8d;
|
||||
$color-gray5: #e5e5e5;
|
||||
$color-gray5: #e0e0e0;
|
||||
$color-blue: #00c8ff;
|
||||
|
||||
$color-green: #4caf50;
|
||||
|
||||
@ -1,18 +1,18 @@
|
||||
.sprite{
|
||||
.sprite {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.no-buttom {
|
||||
border: none;
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: auto;
|
||||
overflow: visible;
|
||||
|
||||
background: transparent;
|
||||
outline: none;
|
||||
text-align: inherit;
|
||||
outline: none;
|
||||
text-align: inherit;
|
||||
|
||||
/* inherit font & color from ancestor */
|
||||
color: inherit;
|
||||
@ -26,24 +26,24 @@
|
||||
-moz-osx-font-smoothing: inherit;
|
||||
|
||||
/* Corrects inability to style clickable `input` types in iOS */
|
||||
appearance: none;
|
||||
appearance: none;
|
||||
|
||||
&::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
&::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.itens-inline{
|
||||
>*{ display: inline-block;}
|
||||
.itens-inline {
|
||||
> * {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
%notificacao{
|
||||
|
||||
padding: 7.5px 10px ;
|
||||
min-height: 1em;
|
||||
border-radius: 3px;
|
||||
border-right: solid 5px;
|
||||
display: block;
|
||||
%notificacao {
|
||||
padding: 7.5px 10px;
|
||||
min-height: 1em;
|
||||
border-radius: 3px;
|
||||
border-right: solid 5px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user