diff --git a/store/blocks/pdp/product-specifications.jsonc b/store/blocks/pdp/product-specifications-table.jsonc similarity index 72% rename from store/blocks/pdp/product-specifications.jsonc rename to store/blocks/pdp/product-specifications-table.jsonc index e969b261..add3a643 100644 --- a/store/blocks/pdp/product-specifications.jsonc +++ b/store/blocks/pdp/product-specifications-table.jsonc @@ -79,32 +79,5 @@ "props": { "message": "{specificationValue}" } - }, - "product-specification-group#summary": { - "children": [ - "product-specification#summary" - ] - }, - "product-specification#summary": { - "children": [ - "flex-layout.row#summarySpecificationValues" - ] - }, - "flex-layout.row#summarySpecificationValues": { - "props": { - "preventHorizontalStretch": true, - "colGap": 3 - }, - "children": [ - "rich-text#summarySpecificationBullet", - "product-specification-values" - ] - }, - "rich-text#summarySpecificationBullet": { - "props": { - "text": "•", - "textColor": "c-action-primary", - "blockClass": "summarySpecificationBullet" - } } } diff --git a/store/blocks/product-summary/product-specification-list.jsonc b/store/blocks/product-summary/product-specification-list.jsonc new file mode 100644 index 00000000..57d44af6 --- /dev/null +++ b/store/blocks/product-summary/product-specification-list.jsonc @@ -0,0 +1,29 @@ +{ + "product-specification-group#summary": { + "children": [ + "product-specification#summary" + ] + }, + "product-specification#summary": { + "children": [ + "flex-layout.row#summarySpecificationValues" + ] + }, + "flex-layout.row#summarySpecificationValues": { + "props": { + "preventHorizontalStretch": true, + "colGap": 3 + }, + "children": [ + "rich-text#summarySpecificationBullet", + "product-specification-values" + ] + }, + "rich-text#summarySpecificationBullet": { + "props": { + "text": "•", + "textColor": "c-action-primary", + "blockClass": "summarySpecificationBullet" + } + } +} diff --git a/styles/css/search/vtex.flex-layout.css b/styles/css/search/vtex.flex-layout.css new file mode 100644 index 00000000..b66758e2 --- /dev/null +++ b/styles/css/search/vtex.flex-layout.css @@ -0,0 +1,34 @@ +.flexRow--orderByAndSwitcher { + padding-right: 1.5em; +} + +.flexRowContent--savingsSummaryListDesktop { + justify-content: flex-start; +} + +.flexCol--summaryRightListDesktop { + justify-content: space-around; +} + +.flexRow--buyNowButton :global(.vtex-button) { + background: #eef3f7; + border-color:#eef3f7; + color: #0f3e99; +} + +.flexRow--buyNowButton:hover :global(.vtex-button) { + background: #dbe9fd; + border-color:#dbe9fd; +} + +.flexCol--productRating { + margin-bottom: 3rem; +} + +.flexCol--summaryDetailsListMobile { + justify-content: space-between; +} + +.flexCol--summaryUpDetailsListMobile { + margin-bottom: 0.25rem +} diff --git a/styles/css/search/vtex.product-summary.css b/styles/css/search/vtex.product-summary.css new file mode 100644 index 00000000..f160ecaa --- /dev/null +++ b/styles/css/search/vtex.product-summary.css @@ -0,0 +1,31 @@ +.nameContainer--summaryListDesktop { + padding-top: 0.25rem; + padding-bottom: 0.75rem; + justify-content: start; +} + +.nameContainer--summaryListMobile { + padding-top: 0.25rem; + padding-bottom: 0.5rem; + justify-content: start; +} + +.brandName--summaryListMobile { + font-weight: 400; + font-size: 0.875rem; + color: black; +} + +.container--listLayout { + max-width: none !important; +} + +.image--summaryListDesktop { + width: 180px !important; +} + +.image--summaryListMobile { + width: 140px !important; + min-width: 140px; + height: inherit !important; +} diff --git a/styles/css/search/vtex.rich-text.css b/styles/css/search/vtex.rich-text.css new file mode 100644 index 00000000..b187dad1 --- /dev/null +++ b/styles/css/search/vtex.rich-text.css @@ -0,0 +1,14 @@ +.container--layout-option { + margin-left: 0.3em; +} + +.paragraph--layout-option { + margin: 0; +} + +.paragraph--summarySpecificationBullet { + margin: 0; + line-height: initial; + font-size: 1.25rem; + line-height: 1.15rem; +} diff --git a/styles/css/search/vtex.store-components.css b/styles/css/search/vtex.store-components.css new file mode 100644 index 00000000..f86b6148 --- /dev/null +++ b/styles/css/search/vtex.store-components.css @@ -0,0 +1,12 @@ +.productBrandName--summaryListDesktop { + text-decoration: none; + font-weight: 500; + color: #0067C7; + font-size: .875rem; +} + +.productBrandName--summaryListMobile { + text-decoration: none; + color: #0067C7; + font-size: .875rem; +} diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css index 359843b4..707b86cf 100644 --- a/styles/css/vtex.flex-layout.css +++ b/styles/css/vtex.flex-layout.css @@ -92,38 +92,3 @@ .flexRow--addToCartRow { padding-bottom: 1rem; } - -.flexRow--orderByAndSwitcher { - padding-right: 1.5em; -} - -.flexRowContent--savingsSummaryListDesktop { - justify-content: flex-start; -} - -.flexCol--summaryRightListDesktop { - justify-content: space-around; -} - -.flexRow--buyNowButton :global(.vtex-button) { - background: #eef3f7; - border-color:#eef3f7; - color: #0f3e99; -} - -.flexRow--buyNowButton:hover :global(.vtex-button) { - background: #dbe9fd; - border-color:#dbe9fd; -} - -.flexCol--productRating { - margin-bottom: 3rem; -} - -.flexCol--summaryDetailsListMobile { - justify-content: space-between; -} - -.flexCol--summaryUpDetailsListMobile { - margin-bottom: 0.25rem -} diff --git a/styles/css/vtex.product-summary.css b/styles/css/vtex.product-summary.css index 122afaab..0a6e4202 100644 --- a/styles/css/vtex.product-summary.css +++ b/styles/css/vtex.product-summary.css @@ -23,30 +23,12 @@ padding-bottom: 1rem; } -.nameContainer--summaryListDesktop { - padding-top: 0.25rem; - padding-bottom: 0.75rem; - justify-content: start; -} - -.nameContainer--summaryListMobile { - padding-top: 0.25rem; - padding-bottom: 0.5rem; - justify-content: start; -} - .brandName { font-weight: 600; font-size: 18px; color: #2E2E2E; } -.brandName--summaryListMobile { - font-weight: 400; - font-size: 0.875rem; - color: black; -} - .container { text-align: start; } @@ -58,17 +40,3 @@ .image { border-radius: 0.25rem; } - -.container--listLayout { - max-width: none !important; -} - -.image--summaryListDesktop { - width: 180px !important; -} - -.image--summaryListMobile { - width: 140px !important; - min-width: 140px; - height: inherit !important; -} diff --git a/styles/css/vtex.rich-text.css b/styles/css/vtex.rich-text.css index 0c5a2307..08e19ee7 100644 --- a/styles/css/vtex.rich-text.css +++ b/styles/css/vtex.rich-text.css @@ -88,18 +88,3 @@ line-height: 1.3em; } } - -.container--layout-option { - margin-left: 0.3em; -} - -.paragraph--layout-option { - margin: 0; -} - -.paragraph--summarySpecificationBullet { - margin: 0; - line-height: initial; - font-size: 1.25rem; - line-height: 1.15rem; -} diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css index a1d62943..418b42f9 100644 --- a/styles/css/vtex.store-components.css +++ b/styles/css/vtex.store-components.css @@ -115,16 +115,3 @@ font-weight: bold; font-size: 30px; } - -.productBrandName--summaryListDesktop { - text-decoration: none; - font-weight: 500; - color: #0067C7; - font-size: .875rem; -} - -.productBrandName--summaryListMobile { - text-decoration: none; - color: #0067C7; - font-size: .875rem; -}