forked from M3-Academy/m3-academy-template-checkout
feat: Aplica css desktop
This commit is contained in:
parent
452357eebf
commit
08274cec63
@ -8,8 +8,22 @@
|
||||
|
||||
@include mq(xg, min) {
|
||||
height: 61px;
|
||||
font-size: 24px;
|
||||
line-height: 32px;
|
||||
font-size: 28px;
|
||||
line-height: 38px;
|
||||
}
|
||||
|
||||
option {
|
||||
font-family: $font-family;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 12px !important;
|
||||
line-height: 16px !important;
|
||||
color: $color-gray2;
|
||||
|
||||
@include mq(xg, min) {
|
||||
font-size: 14px !important;
|
||||
line-height: 18px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -430,7 +444,16 @@
|
||||
}
|
||||
|
||||
.ship-country,
|
||||
.ship-postalCode {
|
||||
.ship-postalCode,
|
||||
.ship-street,
|
||||
.ship-number,
|
||||
.ship-complement,
|
||||
.ship-neighborhood,
|
||||
.ship-city,
|
||||
.ship-state,
|
||||
.ship-receiverName {
|
||||
width: 100%;
|
||||
|
||||
label {
|
||||
font-family: $font-family;
|
||||
font-style: normal;
|
||||
@ -446,6 +469,42 @@
|
||||
}
|
||||
}
|
||||
|
||||
#ship-country,
|
||||
#ship-postalCode,
|
||||
#ship-street,
|
||||
#ship-number,
|
||||
#ship-complement,
|
||||
#ship-neighborhood,
|
||||
#ship-city,
|
||||
#ship-state,
|
||||
#ship-receiverName {
|
||||
border: 1px solid #E0E0E0;
|
||||
border-radius: 8px;
|
||||
height: 35px;
|
||||
width: 100%;
|
||||
outline: none;
|
||||
|
||||
@include mq(xg, min) {
|
||||
height: 61px;
|
||||
font-size: 28px;
|
||||
line-height: 38px;
|
||||
}
|
||||
|
||||
option {
|
||||
font-family: $font-family;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 12px !important;
|
||||
line-height: 16px !important;
|
||||
color: $color-gray2;
|
||||
|
||||
@include mq(xg, min) {
|
||||
font-size: 14px !important;
|
||||
line-height: 18px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.accordion-heading {
|
||||
.accordion-toggle {
|
||||
font-family: $font-family;
|
||||
@ -463,29 +522,6 @@
|
||||
|
||||
}
|
||||
|
||||
.accordion-toggle-active {
|
||||
|
||||
span {
|
||||
font-size: 0;
|
||||
&::after {
|
||||
content: "Identificação";
|
||||
font-family: $font-family-secundary;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 19px;
|
||||
color: $color-black;
|
||||
margin-top: 24px;
|
||||
padding: 0;
|
||||
|
||||
@include mq(xg, min) {
|
||||
font-size: 32px;
|
||||
line-height: 37px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
i::before {
|
||||
fill: #303030;
|
||||
@ -575,6 +611,14 @@
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
||||
@include mq(xg, min) {
|
||||
font-size: 28px;
|
||||
line-height: 38px;
|
||||
height: 63px;
|
||||
padding: 12px 110px;
|
||||
margin-top: 27px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $color-blue3;
|
||||
}
|
||||
@ -768,6 +812,83 @@
|
||||
}
|
||||
}
|
||||
|
||||
.vtex-omnishipping-1-x-shippingSectionTitle {
|
||||
|
||||
font-family: $font-family;
|
||||
font-style: normal;
|
||||
font-weight: 700 !important;
|
||||
font-size: 14px !important;
|
||||
line-height: 19px;
|
||||
letter-spacing: 0.05em;
|
||||
color: $color-gray2 !important;
|
||||
margin-bottom: 11px;
|
||||
|
||||
@include mq(xg, min) {
|
||||
font-size: 28px !important;
|
||||
line-height: 38px;
|
||||
}
|
||||
}
|
||||
|
||||
.vtex-omnishipping-1-x-svg {
|
||||
background-image: url(" https://agenciamagma.vteximg.com.br/arquivos/icon-radios-input-M3Academy.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 18px;
|
||||
width: auto;
|
||||
height: 18px;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
|
||||
@include mq(xg, min) {
|
||||
background-size: 34px;
|
||||
height: 34px;
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-image: url(" https://agenciamagma.vteximg.com.br/arquivos/icon-radios-input-Active-M3Academy.png");
|
||||
}
|
||||
}
|
||||
|
||||
#delivery-packages-options {
|
||||
border: 1px solid #E0E0E0;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.delivery-address-title {
|
||||
font-size: 12px !important;
|
||||
line-height: 16px;
|
||||
|
||||
@include mq(xg, min) {
|
||||
font-size: 24px !important;
|
||||
line-height: 33px;
|
||||
}
|
||||
}
|
||||
|
||||
.vtex-omnishipping-1-x-leanShippingTextLabel,
|
||||
.vtex-omnishipping-1-x-leanShippingOption,
|
||||
.vtex-omnishipping-1-x-optionPrice {
|
||||
font-family: $font-family;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
color: $color-gray2 !important;
|
||||
|
||||
@include mq(xg, min) {
|
||||
font-size: 24px;
|
||||
line-height: 33px;
|
||||
}
|
||||
}
|
||||
|
||||
.vtex-omnishipping-1-x-leanShippingTextLabel {
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
#CHEAPEST {
|
||||
&:active {
|
||||
background-color: #F2F2F2;
|
||||
}
|
||||
}
|
||||
|
||||
#find-pickups-manualy-button-denied {
|
||||
background-color: $color-blue2;
|
||||
border: 1px solid $color-blue2;
|
||||
@ -792,17 +913,24 @@
|
||||
.shipping-data,
|
||||
.payment-data {
|
||||
.accordion-heading {
|
||||
.accordion-toggle{
|
||||
.accordion-toggle {
|
||||
background-image: url("https://agenciamagma.vteximg.com.br/arquivos/lapisM3Academy.png");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right;
|
||||
background-size: 20px;
|
||||
cursor: pointer;
|
||||
width: auto;
|
||||
height: 20px;
|
||||
|
||||
@include mq(xg, min) {
|
||||
background-size: 38px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.accordion-toggle-active {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -861,3 +989,80 @@
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.checkout-container .shipping-data .accordion-group .accordion-inner .vtex-omnishipping-1-x-deliveryGroup .shp-lean label svg path {
|
||||
fill: transparent;
|
||||
}
|
||||
|
||||
.checkout-container .client-profile-data .accordion-group .accordion-heading a {
|
||||
background-color: $color-white;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
border: none;
|
||||
background-image: url("https://agenciamagma.vteximg.com.br/arquivos/lapisM3Academy.png");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right;
|
||||
background-size: 20px;
|
||||
cursor: pointer;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
||||
@include mq(xg, min) {
|
||||
background-size: 38px;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.checkout-container .client-profile-data .accordion-group .accordion-heading .accordion-toggle {
|
||||
font-size: 0;
|
||||
|
||||
&::after {
|
||||
content: "Identificação";
|
||||
font-family: $font-family-secundary;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 19px;
|
||||
color: $color-black;
|
||||
margin-top: 24px;
|
||||
padding: 0;
|
||||
|
||||
@include mq(xg, min) {
|
||||
font-size: 32px;
|
||||
line-height: 37px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.street,
|
||||
.neighborhood,
|
||||
.city,
|
||||
.state-delimiter,
|
||||
.state,
|
||||
#force-shipping-fields {
|
||||
font-family: $font-family;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
color: $color-gray2;
|
||||
|
||||
@include mq(xg, min) {
|
||||
font-size: 24px;
|
||||
line-height: 33px;
|
||||
}
|
||||
}
|
||||
|
||||
#force-shipping-fields {
|
||||
color: $color-blue2;
|
||||
}
|
||||
|
||||
.checkout-container .shipping-data .accordion-group .accordion-inner .address-summary {
|
||||
border-radius: 8px;
|
||||
border-color: #E0E0E0;
|
||||
}
|
||||
|
||||
/*url("https://agenciamagma.vteximg.com.br/homeM3Academy.png");*/
|
||||
|
||||
Loading…
Reference in New Issue
Block a user