From bf9a47f52138602028a6f979d1b7e053009e0c9c Mon Sep 17 00:00:00 2001 From: Sabrina Miranda Date: Fri, 10 Feb 2023 20:07:42 -0300 Subject: [PATCH] =?UTF-8?q?refactor:=20aplica=20mudan=C3=A7as=20no=20c?= =?UTF-8?q?=C3=B3digo?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- react/components/Html/styles.css | 7 ++- store/blocks/pdp/product.jsonc | 49 +++++++++++-------- styles/css/vtex.breadcrumb.css | 4 +- styles/css/vtex.minicart.css | 8 +++ styles/css/vtex.store-components.css | 16 ++++-- styles/css/vtex.store-footer.css | 2 +- styles/css/vtex.telemarketing.css | 3 +- .../sass/pages/product/vtex.breadcrumb.scss | 5 +- styles/sass/pages/product/vtex.minicart.scss | 12 ++++- .../pages/product/vtex.store-components.scss | 14 ++++-- .../sass/pages/product/vtex.store-footer.scss | 2 +- .../pages/product/vtex.telemarketing.scss | 5 +- 12 files changed, 81 insertions(+), 46 deletions(-) diff --git a/react/components/Html/styles.css b/react/components/Html/styles.css index ba9e749..0720c01 100644 --- a/react/components/Html/styles.css +++ b/react/components/Html/styles.css @@ -111,6 +111,7 @@ border-radius: 0; display: block !important; + cursor: pointer; } [class*="html--product-quantity-cart-button"] button:hover { color: #929292; @@ -134,6 +135,7 @@ position: absolute; display: block !important; + cursor: pointer; } [class*="html--shipping-simulator"] button:hover { filter: opacity(88%); @@ -256,7 +258,7 @@ } [class*="html--newsletter"] { - padding: 64px 0 32px 0; + padding: 64px 0 0 0; margin-top: 17px; } @media screen and (max-width: 768px) { @@ -303,9 +305,6 @@ [class*="html--newsletter"] button { font-size: 14px; line-height: 19px; - position: absolute; - right: 0; - top: -31px; } } [class*="html--newsletter"] button:hover { diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc index 2d5e4c6..942dbe2 100644 --- a/store/blocks/pdp/product.jsonc +++ b/store/blocks/pdp/product.jsonc @@ -23,19 +23,23 @@ "children": ["breadcrumb"] }, - //"html#specifications-title": { - // "props": { - // "tag": "div", - // "blockClass": "specifications-title" - // }, - // "children": ["rich-text#specifications"] - //}, + /* + "html#specifications-title": { + "props": { + "tag": "div", + "blockClass": "specifications-title" + }, + "children": ["rich-text#specifications"] + }, + */ - //"rich-text#specifications": { - // "props": { - // "text": "##### Product Specifications" - // } - //}, + /* + "rich-text#specifications": { + "props": { + "text": "##### Product Specifications" + } + }, + */ "product-images#description": { "props": { @@ -112,14 +116,14 @@ ] }, - //"product-specification-badges": { - // "props": { - // "specificationGroupName": "Group", - // "specificationName": "On Sale", - // "visibleWhen": "True", - // "displayValue": "SPECIFICATION_NAME" - // } - //}, + "product-specification-badges": { + "props": { + "specificationGroupName": "Group", + "specificationName": "On Sale", + "visibleWhen": "True", + "displayValue": "SPECIFICATION_NAME" + } + }, "html#stack": { "props": { @@ -299,6 +303,7 @@ "children": ["availability-subscriber"] }, + /* "share#default": { "props": { "social": { @@ -309,6 +314,7 @@ } } }, + */ "html#product-description": { "props": { @@ -456,7 +462,8 @@ "infinite": true, "showNavigationArrows": "always", "blockClass": "carousel", - "showPaginationDots": "always" } + "showPaginationDots": "always" + } }, "html#slider-layout-shelf": { diff --git a/styles/css/vtex.breadcrumb.css b/styles/css/vtex.breadcrumb.css index ec0f85a..c80a0ac 100644 --- a/styles/css/vtex.breadcrumb.css +++ b/styles/css/vtex.breadcrumb.css @@ -42,10 +42,8 @@ font-weight: 400; font-size: 14px; line-height: 19px; -} -.container .link, -.container .term { color: #929292; + cursor: pointer; } .container .link:hover, .container .term:hover { diff --git a/styles/css/vtex.minicart.css b/styles/css/vtex.minicart.css index e53a916..a4956b6 100644 --- a/styles/css/vtex.minicart.css +++ b/styles/css/vtex.minicart.css @@ -11,4 +11,12 @@ background-color: #000000; border-radius: 0; border: none; +} +.minicartCheckoutButton :local(button):hover { + background-color: #000000; + filter: opacity(88%); +} +.minicartCheckoutButton :local(button):active { + background-color: #000000; + filter: opacity(100%); } \ No newline at end of file diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css index 95863ce..c3210b6 100644 --- a/styles/css/vtex.store-components.css +++ b/styles/css/vtex.store-components.css @@ -283,14 +283,10 @@ padding: 0; border: none; } -@media screen and (max-width: 1024px) { - .shippingTable { - margin-top: 32px; - } -} @media screen and (max-width: 768px) { .shippingTable { padding-top: 16px; + margin-top: 24px; } } @@ -519,6 +515,16 @@ .inputGroup--newsletter-product { border-bottom: 1px solid #929292 !important; } +@media screen and (max-width: 639px) { + .inputGroup--newsletter-product { + justify-content: space-between; + display: flex; + } +} +.inputGroup--newsletter-product :local(label) { + display: flex; + align-items: center; +} .newsletter--newsletter-product .container { padding: 16px 0; diff --git a/styles/css/vtex.store-footer.css b/styles/css/vtex.store-footer.css index 582b7af..055d5f2 100644 --- a/styles/css/vtex.store-footer.css +++ b/styles/css/vtex.store-footer.css @@ -8,5 +8,5 @@ /* Media Query M3 */ /* Grid breakpoints */ .footerLayout { - padding: 0 16px !important; + padding: 32px 16px 0 16px !important; } \ No newline at end of file diff --git a/styles/css/vtex.telemarketing.css b/styles/css/vtex.telemarketing.css index b8efdfc..b6ed319 100644 --- a/styles/css/vtex.telemarketing.css +++ b/styles/css/vtex.telemarketing.css @@ -11,6 +11,7 @@ padding: 0 16px !important; } -.container { +.container, +.wrapper { background-color: #000000; } \ 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 47d0a52..8589f16 100644 --- a/styles/sass/pages/product/vtex.breadcrumb.scss +++ b/styles/sass/pages/product/vtex.breadcrumb.scss @@ -32,11 +32,8 @@ font-weight: 400; font-size: 14px; line-height: 19px; - } - - .link, - .term { color: #929292; + cursor: pointer; &:hover { color: #808080; diff --git a/styles/sass/pages/product/vtex.minicart.scss b/styles/sass/pages/product/vtex.minicart.scss index 01d0995..5757148 100644 --- a/styles/sass/pages/product/vtex.minicart.scss +++ b/styles/sass/pages/product/vtex.minicart.scss @@ -3,5 +3,15 @@ background-color: #000000; border-radius: 0; border: none; + + &:hover { + background-color: #000000; + filter: opacity(88%); + } + + &:active { + background-color: #000000; + filter: opacity(100%); + } } -} \ No newline at end of file +} diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss index e491096..1ccabd1 100644 --- a/styles/sass/pages/product/vtex.store-components.scss +++ b/styles/sass/pages/product/vtex.store-components.scss @@ -298,11 +298,9 @@ padding: 0; border: none; - @media screen and (max-width: 1024px) { - margin-top: 32px; - } @media screen and (max-width: 768px) { padding-top: 16px; + margin-top: 24px; } } @@ -531,6 +529,16 @@ .inputGroup--newsletter-product{ border-bottom: 1px solid #929292 !important; + + @media screen and (max-width: 639px) { + justify-content: space-between; + display: flex; + } + + :local(label) { + display: flex; + align-items: center; + } } .newsletter--newsletter-product { diff --git a/styles/sass/pages/product/vtex.store-footer.scss b/styles/sass/pages/product/vtex.store-footer.scss index 9588ced..0987da1 100644 --- a/styles/sass/pages/product/vtex.store-footer.scss +++ b/styles/sass/pages/product/vtex.store-footer.scss @@ -1,3 +1,3 @@ .footerLayout { - padding: 0 16px !important; + padding: 32px 16px 0 16px!important; } diff --git a/styles/sass/pages/product/vtex.telemarketing.scss b/styles/sass/pages/product/vtex.telemarketing.scss index 77a4f23..a713af9 100644 --- a/styles/sass/pages/product/vtex.telemarketing.scss +++ b/styles/sass/pages/product/vtex.telemarketing.scss @@ -2,6 +2,7 @@ padding: 0 16px !important; } -.container { +.container, +.wrapper { background-color: #000000; -} \ No newline at end of file +}