diff --git a/styles/css/vtex.store-components.css b/styles/css/vtex.store-components.css index 5d2e382..9e88af1 100644 --- a/styles/css/vtex.store-components.css +++ b/styles/css/vtex.store-components.css @@ -354,6 +354,8 @@ .subscriberContainer .title { font-size: 0; + line-height: 0; + margin: 0; } .subscriberContainer .title::after { content: "Produto Indisponível"; @@ -372,21 +374,29 @@ line-height: 19px; color: #868686; } +.subscriberContainer .form { + margin-bottom: 16px; +} .subscriberContainer .form .content { display: grid; grid-template-areas: " nome email" " submit submit"; justify-content: inherit; gap: 8px; + margin-top: 15px; } .subscriberContainer .form .content .inputName { grid-area: nome; + margin-bottom: 0; } .subscriberContainer .form .content .inputEmail { grid-area: email; + margin-bottom: 0; } .subscriberContainer .form .content .submit { grid-area: submit; width: 100%; + margin-top: 7px; + margin-bottom: 0; } .subscriberContainer .form .content .submit :global(.vtex-button) { width: 100%; diff --git a/styles/css/vtex.tab-layout.css b/styles/css/vtex.tab-layout.css index afbe7a8..0d3647e 100644 --- a/styles/css/vtex.tab-layout.css +++ b/styles/css/vtex.tab-layout.css @@ -1,3 +1,4 @@ +@charset "UTF-8"; /* 0 - 600PX: Phone 600 - 900px: Table portrait @@ -13,6 +14,16 @@ .container--structure { padding: 0 40px; } +.container--structure::after { + content: "Você também pode gostar:"; + display: block; + text-align: center; + font-weight: 400; + font-size: 24px; + line-height: 38px; + padding: 16px 0 32px 0; + color: #575757; +} .contentContainer { padding: 0 32px; @@ -38,6 +49,7 @@ } .listContainer .listItemActive :global(.vtex-button) { background-color: #fff; + width: 114px; border: none; } .listContainer .listItemActive :global(.vtex-button__label) { diff --git a/styles/sass/pages/product/vtex.store-components.scss b/styles/sass/pages/product/vtex.store-components.scss index 6ef9d21..1cf9466 100644 --- a/styles/sass/pages/product/vtex.store-components.scss +++ b/styles/sass/pages/product/vtex.store-components.scss @@ -430,6 +430,8 @@ margin-top: 16px; .title { font-size: 0; + line-height: 0; + margin: 0; &::after { content: "Produto Indisponível"; @@ -455,24 +457,31 @@ margin-top: 16px; } .form { + margin-bottom: 16px; + .content { display: grid; grid-template-areas: " nome email" " submit submit"; justify-content: inherit; gap: 8px; + margin-top: 15px; .inputName { grid-area: nome; + margin-bottom: 0; } .inputEmail { grid-area: email; + margin-bottom: 0; } .submit { grid-area: submit; width: 100%; + margin-top: 7px; + margin-bottom: 0; :global(.vtex-button) { width: 100%; diff --git a/styles/sass/pages/product/vtex.tab-layout.scss b/styles/sass/pages/product/vtex.tab-layout.scss index f7bbd67..5e2f99c 100644 --- a/styles/sass/pages/product/vtex.tab-layout.scss +++ b/styles/sass/pages/product/vtex.tab-layout.scss @@ -1,5 +1,17 @@ .container--structure { padding: 0 40px; + + &::after { + content: "Você também pode gostar:"; + display: block; + text-align: center; + font-weight: 400; + font-size: 24px; + line-height: 38px; + padding: 16px 0 32px 0; + + color: $gray-100; + } } .contentContainer { @@ -34,6 +46,7 @@ .listItemActive { :global(.vtex-button) { background-color: $white; + width: 114px; border: none; }