diff --git a/react/components/Html/styles.css b/react/components/Html/styles.css
index 38702cf..961c1b0 100644
--- a/react/components/Html/styles.css
+++ b/react/components/Html/styles.css
@@ -20,7 +20,10 @@
display: flex;
flex-direction: column;
}
-.html--pdp-pixPrice div span[datatype='span_wrapper'] span[class="pix_wrapper-price"]{
+.html--pdp-pixPrice div span[datatype='span_wrapper'] p{
+ margin: 0;
+}
+.html--pdp-pixPrice div span[datatype='span_wrapper'] p[class="pix_wrapper-price"]{
font-family: 'Open Sans',sans-serif;
font-style: normal;
font-weight: 700;
@@ -29,7 +32,7 @@
color: rgba(0, 0, 0, 0.58);
white-space: nowrap;
}
-.html--pdp-pixPrice div span[datatype='span_wrapper'] span[class='pix_wrapper-Discount']{
+.html--pdp-pixPrice div span[datatype='span_wrapper'] p[class='pix_wrapper-Discount']{
font-family: 'Open Sans',sans-serif;
font-style: normal;
font-weight: 300;
diff --git a/react/components/ProductContext/Pix.tsx b/react/components/ProductContext/Pix.tsx
index d26a5ca..dd63cfa 100644
--- a/react/components/ProductContext/Pix.tsx
+++ b/react/components/ProductContext/Pix.tsx
@@ -17,10 +17,10 @@ const Pix = () => {
-
+
R$ {formattedNumber}
-
- {desconto} % de desconto
+
+ {desconto} % de desconto
)
diff --git a/react/components/ProductContext/Placeholder.tsx b/react/components/ProductContext/Placeholder.tsx
index f8f0fc1..136ddd4 100644
--- a/react/components/ProductContext/Placeholder.tsx
+++ b/react/components/ProductContext/Placeholder.tsx
@@ -3,6 +3,15 @@ import React from 'react';
const Placeholder = () => {
if (typeof document !== "undefined") {
const Placeholder = document.querySelector(".vtex-address-form-4-x-input")
+ const placeholdertamanho = document.querySelector(".vtex-store-components-3-x-skuSelectorSubcontainer--tamanho .vtex-store-components-3-x-skuSelectorName");
+ const placeholdercor = document.querySelector(".vtex-store-components-3-x-skuSelectorSubcontainer--cor .vtex-store-components-3-x-skuSelectorName");
+ console.log(placeholdertamanho)
+ if(placeholdertamanho){
+ placeholdertamanho.textContent = "OUTROS TAMANHOS:";
+ }
+ if(placeholdercor){
+ placeholdercor.textContent = "OUTRAS CORES:";
+ }
Placeholder?.setAttribute("Placeholder","Digite seu CEP")
}
return(
diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc
index eb3bd21..15e7ed2 100644
--- a/store/blocks/pdp/product.jsonc
+++ b/store/blocks/pdp/product.jsonc
@@ -10,20 +10,20 @@
"html#carousel"
]
},
- "html#Pix":{
+ "html#Pix": {
"props": {
"testId": "pix-price",
"blockClass": "pdp-pixPrice"
},
"children": ["Pix"]
},
- "html#Placeholder":{
+ "html#Placeholder": {
"children": ["Placeholder"]
},
- "html#CEP":{
+ "html#CEP": {
"children": ["CEP"]
},
- "html#tab-layout":{
+ "html#tab-layout": {
"props": {
"testId": "tab-layout"
},
@@ -133,13 +133,14 @@
},
"html#prateleira": {
"props": {
- "testId": "vtex-product-sumary"
+ "testId": "vtex-product-summary"
},
"children": [
- "product-summary-image#shelfpdp",
+ "stack-layout#pdp",
"product-summary-name",
"product-list-price#summary",
- "product-selling-price#summarypdp"
+ "html#selling-price",
+ "flex-layout.row#selling-price-savingspdp"
]
},
"html#carousel": {
@@ -162,9 +163,7 @@
"props": {
"testId": "product-summary-list"
},
- "children": [
- "slider-layout#demo-products#pdp"
- ]
+ "children": ["slider-layout#demo-products#pdp"]
},
"slider-layout#demo-products#pdp": {
"props": {
@@ -178,14 +177,9 @@
"blockClass": "pdp-carrousel"
}
},
-
"product-summary.shelf#Pdp": {
"children": [
- "stack-layout#pdp",
- "product-summary-name",
- "product-list-price#summary",
- "html#selling-price",
- "flex-layout.row#selling-price-savingspdp"
+ "html#prateleira"
]
},
@@ -198,7 +192,7 @@
"marginBottom": 4
},
"children": [
- "product-selling-price#summarypdp",
+ "product-selling-price#summary",
"product-price-savings#summary"
]
},
@@ -231,8 +225,6 @@
"children": ["breadcrumb"]
},
-
-
"flex-layout.row#specifications-title": {
"children": ["rich-text#specifications"]
},
@@ -272,7 +264,7 @@
"testId": "Product-Images",
"blockClass": "pdp-productMain"
},
- "children": ["html#stack", "html#right-col"]
+ "children": ["html#stack", "html#right-col"]
},
"flex-layout.row#product-main": {
"props": {
@@ -283,8 +275,8 @@
"marginBottom": 0,
"paddingTop": 0,
"paddingBottom": 0,
- "paddingright":0,
- "paddingleft":0
+ "paddingright": 0,
+ "paddingleft": 0
}
},
@@ -330,12 +322,13 @@
"children": ["stack-layout"],
"props": {
"width": "50%",
- "blockClass": "StackLayout"
+ "blockClass": "StackLayout",
+ "testId": "product-images"
}
},
"flex-layout.row#product-image": {
- "props":{
+ "props": {
"blockClass": "product-image"
},
"children": ["product-images"]
@@ -389,28 +382,28 @@
"share#default"
]
},
- "html#shipping-simulator":{
- "props":{
+ "html#shipping-simulator": {
+ "props": {
"testId": "shipping-simulator"
},
- "children": ["shipping-simulator"]
- },
- "html#product-installments":{
- "props":{
+ "children": ["shipping-simulator"]
+ },
+ "html#product-installments": {
+ "props": {
"testId": "product-installments"
},
- "children": ["product-installments"]
- },
+ "children": ["product-installments"]
+ },
"product-installments": {
"props": {
"message": "{installmentsNumber} de {installmentValue} sem juros"
}
},
- "html#selling-price":{
- "props":{
- "testId": "product-price"
- },
+ "html#selling-price": {
+ "props": {
+ "testId": "product-price"
+ },
"children": ["product-selling-price#summarypdp"]
},
@@ -432,10 +425,7 @@
"marginBottom": 3,
"blockClass": "title"
},
- "children": [
- "html#código",
- "vtex.store-components:product-name"
- ]
+ "children": ["html#código", "vtex.store-components:product-name"]
},
"html#código": {
"props": {
@@ -502,10 +492,7 @@
"props": {
"blockClass": "availability"
},
- "children": [
- "html#stack",
- "html#right-col-availability"
- ]
+ "children": ["html#stack", "html#right-col-availability"]
},
"html#right-col-availability": {
"props": {
@@ -524,7 +511,7 @@
"children": ["availability-subscriber"]
},
- "availability-subscriber":{
+ "availability-subscriber": {
"props": {
"blockClass": "message-availability"
}
diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css
index eed5941..051d83d 100644
--- a/styles/css/vtex.store-components.css
+++ b/styles/css/vtex.store-components.css
@@ -63,22 +63,16 @@
left: 0;
right: 0;
}
+.skuSelectorContainer .skuSelectorName {
+ text-transform: uppercase;
+ font-family: "Open Sans", sans-serif;
+}
.skuSelectorContainer .skuSelectorSubcontainer--cor {
height: 75px;
}
.skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorOptionsList {
height: 48px;
}
-.skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorTextContainer .skuSelectorName {
- text-transform: uppercase;
- font-family: "Open Sans", sans-serif;
-}
-.skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorTextContainer .skuSelectorName::after {
- content: "ES:";
-}
-.skuSelectorContainer .skuSelectorSubcontainer--cor .skuSelectorTextContainer .skuSelectorName::before {
- content: "OUTRAS ";
-}
.skuSelectorContainer .skuSelectorSubcontainer--tamanho .frameAround {
width: 40px;
height: 40px;
@@ -91,16 +85,6 @@
width: 40px;
height: 40px;
}
-.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorTextContainer .skuSelectorName {
- text-transform: uppercase;
- font-family: "Open Sans", sans-serif;
-}
-.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorTextContainer .skuSelectorName::after {
- content: "S:";
-}
-.skuSelectorContainer .skuSelectorSubcontainer--tamanho .skuSelectorTextContainer .skuSelectorName::before {
- content: "OUTROS ";
-}
.skuSelectorContainer .skuSelectorInternalBox {
border: 2px solid #B9B9B9;
}
diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss
index 71fd205..61f2b5c 100644
--- a/styles/sass/pages/product/vtex.store-components.scss
+++ b/styles/sass/pages/product/vtex.store-components.scss
@@ -50,24 +50,16 @@
left: 0;
right: 0;
}
+ .skuSelectorName{
+ text-transform: uppercase;
+ font-family: 'Open Sans',sans-serif;
+ }
.skuSelectorSubcontainer-{
&-cor{
height: 75px;
.skuSelectorOptionsList{
height: 48px;
}
- .skuSelectorTextContainer{
- .skuSelectorName{
- text-transform: uppercase;
- font-family: 'Open Sans',sans-serif;
- &::after{
- content: "ES:";
- }
- &::before{
- content: "OUTRAS ";
- }
- }
- }
}
&-tamanho{
.frameAround{
@@ -82,18 +74,6 @@
width: 40px;
height: 40px;
}
- .skuSelectorTextContainer{
- .skuSelectorName{
- text-transform: uppercase;
- font-family: 'Open Sans',sans-serif;
- &::after{
- content: "S:";
- }
- &::before{
- content: "OUTROS ";
- }
- }
- }
}
}