diff --git a/react/PaymentPix.tsx b/react/PaymentPix.tsx
new file mode 100644
index 0000000..1eb71bb
--- /dev/null
+++ b/react/PaymentPix.tsx
@@ -0,0 +1,3 @@
+import { PaymentPix } from "./components/PaymentPix/PaymentPix";
+
+export default PaymentPix;
diff --git a/react/ProductDescription.tsx b/react/ProductDescription.tsx
deleted file mode 100644
index 9a2edfb..0000000
--- a/react/ProductDescription.tsx
+++ /dev/null
@@ -1,3 +0,0 @@
-import { ProductDescription } from "./components/ProductDescription/ProductDescription";
-
-export default ProductDescription;
diff --git a/react/components/PaymentPix/PaymentPix.tsx b/react/components/PaymentPix/PaymentPix.tsx
new file mode 100644
index 0000000..60bf463
--- /dev/null
+++ b/react/components/PaymentPix/PaymentPix.tsx
@@ -0,0 +1,23 @@
+import React from "react";
+import { useProduct } from "vtex.product-context";
+
+const PaymentPix = () => {
+ const product = useProduct();
+ const pricePix = (
+ (product?.product?.priceRange.sellingPrice.highPrice || 0.0) * 0.9
+ ).toFixed(2);
+ {
+ /*const imagePix =*/
+ }
+
+ const convertPrice = pricePix.toString().replace(".", ",");
+
+ return (
+
+
R$ {convertPrice}
+
10% de desconto
+
+ );
+};
+
+export { PaymentPix };
diff --git a/react/components/ProductDescription/ProductDescription.tsx b/react/components/ProductDescription/ProductDescription.tsx
deleted file mode 100644
index ca68644..0000000
--- a/react/components/ProductDescription/ProductDescription.tsx
+++ /dev/null
@@ -1,7 +0,0 @@
-import React from "react";
-
-const ProductDescription = () => {
- return Oaswq
;
-};
-
-export { ProductDescription };
diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc
index fa56ba1..fc0558e 100644
--- a/store/blocks/pdp/product.jsonc
+++ b/store/blocks/pdp/product.jsonc
@@ -2,7 +2,9 @@
"store.product": {
"children": [
"html#breadcrumb",
+
"condition-layout.product#availability",
+
"flex-layout.row#description",
"flex-layout.row#specifications-title",
"tab-layout#product",
@@ -117,6 +119,7 @@
"flex-layout.row#list-price-savings",
"flex-layout.row#selling-price",
"product-installments",
+ "product-paymentPix-component",
"product-separator",
"product-identifier.product",
"sku-selector",
diff --git a/store/interfaces.json b/store/interfaces.json
index 714e4e6..1e7bec4 100644
--- a/store/interfaces.json
+++ b/store/interfaces.json
@@ -6,7 +6,7 @@
"component": "html",
"composition": "children"
},
- "product-payment-component": {
- "component": "ProductDescription"
+ "product-paymentPix-component": {
+ "component": "PaymentPix"
}
}
diff --git a/styles/css/vtex.breadcrumb.css b/styles/css/vtex.breadcrumb.css
index 9964bda..58f9518 100644
--- a/styles/css/vtex.breadcrumb.css
+++ b/styles/css/vtex.breadcrumb.css
@@ -13,9 +13,4 @@
.homeLink::after {
content: "Home";
-}
-
-.link--1 {
- display: flex;
- order: -1;
}
\ No newline at end of file
diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css
index 3533ae1..b00a4d4 100644
--- a/styles/css/vtex.store-components.css
+++ b/styles/css/vtex.store-components.css
@@ -7,6 +7,7 @@
*/
/* Media Query M3 */
/* Grid breakpoints */
-.productDescriptionContainer {
+/*.productDescriptionContainer {
background: red;
-}
\ No newline at end of file
+}
+*/
\ No newline at end of file
diff --git a/styles/sass/pages/product/vtex.breadcrumb.scss b/styles/sass/pages/product/vtex.breadcrumb.scss
index 0dd25c0..80c6236 100644
--- a/styles/sass/pages/product/vtex.breadcrumb.scss
+++ b/styles/sass/pages/product/vtex.breadcrumb.scss
@@ -6,7 +6,3 @@
content: "Home";
}
}
-.link--1 {
- display: flex;
- order: -1;
-}
diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss
index 926f0da..4f63d46 100644
--- a/styles/sass/pages/product/vtex.store-components.scss
+++ b/styles/sass/pages/product/vtex.store-components.scss
@@ -1,3 +1,4 @@
-.productDescriptionContainer {
+/*.productDescriptionContainer {
background: red;
}
+*/
diff --git a/styles/sass/utils/_vars.scss b/styles/sass/utils/_vars.scss
index daf3adb..4c6da1c 100644
--- a/styles/sass/utils/_vars.scss
+++ b/styles/sass/utils/_vars.scss
@@ -1,3 +1,5 @@
+@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap");
+
$color-black: #292929;
$color-white: #fff;
@@ -14,18 +16,18 @@ $color-green: #4caf50;
/* Grid breakpoints */
$grid-breakpoints: (
- xs: 0,
- cstm: 400,
- sm: 576px,
- md: 768px,
- lg: 992px,
- xl: 1200px
+ xs: 0,
+ cstm: 400,
+ sm: 576px,
+ md: 768px,
+ lg: 992px,
+ xl: 1200px,
) !default;
$z-index: (
- level1: 5,
- level2: 10,
- level3: 15,
- level4: 20,
- level5: 25
+ level1: 5,
+ level2: 10,
+ level3: 15,
+ level4: 20,
+ level5: 25,
) !default;