diff --git a/docs/README.md b/docs/README.md index bb52d110..95fa5d15 100644 --- a/docs/README.md +++ b/docs/README.md @@ -34,7 +34,7 @@ Store GraphQL is a middleware to access all VTEX APIs. - [Search Result](https://github.com/vtex-apps/search-result/blob/master/docs/README.md) - [Product Details](https://github.com/vtex-apps/product-details/blob/master/docs/README.md) - [Store Components](https://github.com/vtex-apps/store-components/blob/master/docs/README.md) -- [Order Placed](https://github.com/vtex-apps/order-placed/blob/master/docs/README.md) +- [Order Placed](https://github.com/vtex-apps/order-placed/blob/master/docs/README.md) ### Store Pixel Apps diff --git a/manifest.json b/manifest.json index 4c5aacdb..bdd5bad9 100644 --- a/manifest.json +++ b/manifest.json @@ -60,7 +60,10 @@ "vtex.store-form": "0.x", "vtex.product-highlights": "2.x", "vtex.product-specifications": "1.x", - "vtex.tab-layout": "0.x" + "vtex.tab-layout": "0.x", + "vtex.condition-layout": "2.x", + "vtex.css-handles": "1.x", + "vtex.store-newsletter": "1.x" }, "peerDependencies": { "vtex.reviews-and-ratings": "2.x" diff --git a/store/blocks/home/home.jsonc b/store/blocks/home/home.jsonc index 0e7cfad4..d8f57744 100644 --- a/store/blocks/home/home.jsonc +++ b/store/blocks/home/home.jsonc @@ -11,7 +11,7 @@ "info-card#home", "rich-text#question", "rich-text#link", - "newsletter" + "newsletter-form" ] }, @@ -99,5 +99,13 @@ "text": "\n**Reach us at**\nwww.vtex.com.br", "blockClass": "link" } + }, + + "newsletter-form": { + "children": [ + "newsletter-input-name", + "newsletter-input-email", + "newsletter-submit" + ] } } diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc index d7e64214..ac9df98b 100644 --- a/store/blocks/pdp/product.jsonc +++ b/store/blocks/pdp/product.jsonc @@ -2,7 +2,7 @@ "store.product": { "children": [ "flex-layout.row#product-breadcrumb", - "flex-layout.row#product-main", + "condition-layout.product#availability", "flex-layout.row#description", "flex-layout.row#specifications-title", "product-specification-group#table", @@ -33,6 +33,17 @@ }, "children": ["product-description"] }, + "condition-layout.product#availability": { + "props": { + "conditions": [ + { + "subject": "isProductAvailability" + } + ], + "Then": "flex-layout.row#product-main", + "Else": "flex-layout.row#product-availability" + } + }, "flex-layout.row#product-main": { "props": { "colGap": 7, @@ -130,6 +141,37 @@ "children": ["add-to-cart-button"] }, + "flex-layout.row#product-availability": { + "props": { + "colGap": 7, + "marginTop": 4, + "marginBottom": 7, + "paddingTop": 7 + }, + "children": ["flex-layout.col#stack", "flex-layout.col#right-col-availability"] + }, + "flex-layout.col#right-col-availability": { + "props": { + "preventVerticalStretch": true, + "rowGap": 0, + "blockClass": "info-availability" + }, + "children": [ + "flex-layout.row#product-name", + "product-identifier.product", + "sku-selector", + "flex-layout.row#availability" + ] + }, + "flex-layout.row#availability": { + "props": { + "blockClass": "message-availability" + }, + "children": [ + "availability-subscriber" + ] + }, + "share#default": { "props": { "social": { diff --git a/store/blocks/product-summary/product-summary.jsonc b/store/blocks/product-summary/product-summary.jsonc index afabee36..5a6504d2 100644 --- a/store/blocks/product-summary/product-summary.jsonc +++ b/store/blocks/product-summary/product-summary.jsonc @@ -26,6 +26,12 @@ ] }, + "product-summary-name": { + "props": { + "tag": "div" + } + }, + "product-summary-image#shelf": { "props": { "showBadge": false, diff --git a/styles/css/vtex.store-newsletter.css b/styles/css/vtex.store-newsletter.css new file mode 100644 index 00000000..a0e9ec58 --- /dev/null +++ b/styles/css/vtex.store-newsletter.css @@ -0,0 +1,22 @@ +.newsletterForm { + max-width: 1528px; + margin: 0 auto; + padding: 100px; + display: flex; + justify-content: center; + background-color: #03054e; +} + +.newsletterForm :global(.vtex-input-prefix__group) { + margin: 0 10px; +} + +.formSubmitContainer :global(.vtex-button), +.newsletterForm :global(.vtex-styleguide-9-x-input) { + background-color: transparent; + color: #FFF; +} + +.formSubmitContainer :global(.vtex-button) { + border: 0; +}