From aa056c6a4ea9498d5dfd7920ab908bd70262b57a Mon Sep 17 00:00:00 2001
From: Sabrina Miranda <sabrina.miranda1@bol.com.br>
Date: Tue, 31 Jan 2023 22:24:18 -0300
Subject: [PATCH] feat: cria e estiliza o bloco product-installments#m3

---
 store/blocks/pdp/product.jsonc                    | 11 ++++++++++-
 styles/css/vtex.product-price.css                 |  7 +++++--
 styles/sass/pages/product/vtex.product-price.scss |  7 +++++--
 3 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc
index f624186..6a42453 100644
--- a/store/blocks/pdp/product.jsonc
+++ b/store/blocks/pdp/product.jsonc
@@ -110,7 +110,7 @@
       "product-identifier.product",
       "product-rating-summary",
       "flex-layout.row#selling-price",
-      "product-installments",
+      "product-installments#m3",
       "sku-selector",
       "product-quantity",
       "product-assembly-options",
@@ -122,6 +122,15 @@
     ]
   },
 
+  "product-installments#m3": {
+    "props": {
+      "markers": ["highlight"],
+      "blockClass": "m3-custom-installments",
+      "message": "<highlight>{installmentsNumber} x</highlight> de <highlight>{installmentValue}</highlight> sem juros",
+      "installmentsCriteria": "max-quantity-without-interest"
+    }
+  },
+
   "flex-layout.row#product-name": {
     "props": {
       "marginBottom": 3
diff --git a/styles/css/vtex.product-price.css b/styles/css/vtex.product-price.css
index b41b0ed..cb88bd8 100644
--- a/styles/css/vtex.product-price.css
+++ b/styles/css/vtex.product-price.css
@@ -14,9 +14,12 @@
   color: #000000;
 }
 
-.installments {
-  font-weight: 700;
+.installments--m3-custom-installments {
   font-size: 16px;
   line-height: 22px;
   color: #929292;
+}
+
+.installments-highlight--m3-custom-installments {
+  font-weight: 700;
 }
\ No newline at end of file
diff --git a/styles/sass/pages/product/vtex.product-price.scss b/styles/sass/pages/product/vtex.product-price.scss
index 4ec1fff..82c2f52 100644
--- a/styles/sass/pages/product/vtex.product-price.scss
+++ b/styles/sass/pages/product/vtex.product-price.scss
@@ -5,9 +5,12 @@
   color: #000000;
 }
 
-.installments {
-  font-weight: 700;
+.installments--m3-custom-installments {
   font-size: 16px;
   line-height: 22px;
   color: #929292;
 }
+
+.installments-highlight--m3-custom-installments {
+  font-weight: 700;
+}