forked from M3-Academy/challenge-vtex-io
feat: created styles for large devices
This commit is contained in:
parent
371c663c97
commit
68cefb0c52
3
.gitignore
vendored
3
.gitignore
vendored
@ -37,4 +37,5 @@ lib
|
|||||||
react/package-lock.json
|
react/package-lock.json
|
||||||
|
|
||||||
# alternatives
|
# alternatives
|
||||||
/.workspace
|
/.workspace
|
||||||
|
/workspace
|
@ -13,4 +13,6 @@ service/node_modules/
|
|||||||
react/__tests__/**
|
react/__tests__/**
|
||||||
react/.babelrc
|
react/.babelrc
|
||||||
react/.eslintrc
|
react/.eslintrc
|
||||||
react/setupTests.js
|
react/setupTests.js
|
||||||
|
workspace
|
||||||
|
.workspace
|
@ -37,6 +37,7 @@
|
|||||||
"vtex.locale-switcher": "0.x",
|
"vtex.locale-switcher": "0.x",
|
||||||
"vtex.product-quantity": "1.x",
|
"vtex.product-quantity": "1.x",
|
||||||
"vtex.product-identifier": "0.x",
|
"vtex.product-identifier": "0.x",
|
||||||
|
"vtex.store-newsletter": "1.x",
|
||||||
"vtex.breadcrumb": "1.x",
|
"vtex.breadcrumb": "1.x",
|
||||||
"vtex.sticky-layout": "0.x",
|
"vtex.sticky-layout": "0.x",
|
||||||
"vtex.product-customizer": "2.x",
|
"vtex.product-customizer": "2.x",
|
||||||
|
0
react/components/PixCustomInstallments/index.ts
Normal file
0
react/components/PixCustomInstallments/index.ts
Normal file
@ -9,7 +9,7 @@
|
|||||||
"info-card#home",
|
"info-card#home",
|
||||||
"rich-text#question",
|
"rich-text#question",
|
||||||
"rich-text#link",
|
"rich-text#link",
|
||||||
"newsletter"
|
"flex-layout.row#newsletter"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
||||||
|
65
store/blocks/newsletter.json
Normal file
65
store/blocks/newsletter.json
Normal file
@ -0,0 +1,65 @@
|
|||||||
|
{
|
||||||
|
"flex-layout.row#newsletter": {
|
||||||
|
"props": {
|
||||||
|
"blockClass": "newsletter",
|
||||||
|
"preserveLayoutOnMobile": true
|
||||||
|
},
|
||||||
|
|
||||||
|
"children": ["newsletter-form"]
|
||||||
|
},
|
||||||
|
|
||||||
|
"newsletter-form": {
|
||||||
|
"props": {
|
||||||
|
"blockClass": "newsletter"
|
||||||
|
},
|
||||||
|
|
||||||
|
"children": [
|
||||||
|
"rich-text#newsletter-title",
|
||||||
|
"rich-text#newsletter-subtitle",
|
||||||
|
"flex-layout.row#newsletter-inputs"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
|
||||||
|
"flex-layout.row#newsletter-inputs": {
|
||||||
|
"props": {
|
||||||
|
"preserveLayoutOnMobile": true,
|
||||||
|
"blockClass": "newsletterInputs",
|
||||||
|
"colSizing": "auto"
|
||||||
|
},
|
||||||
|
"children": ["newsletter-input-email", "newsletter-submit"]
|
||||||
|
},
|
||||||
|
|
||||||
|
"newsletter-input-email": {
|
||||||
|
"props": {
|
||||||
|
"placeholderText": "Digite seu E-mail",
|
||||||
|
"errorMessage": "E-mail ínvalido"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
"newsletter-submit": {
|
||||||
|
"props": {
|
||||||
|
"submitButtonLabel": "ENVIAR"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
"rich-text#newsletter-title": {
|
||||||
|
"props": {
|
||||||
|
"blockClass": "newsletterTitle",
|
||||||
|
"text": "## Assine nossa newsletter",
|
||||||
|
"textAlignment": "CENTER",
|
||||||
|
"textPosition": "CENTER",
|
||||||
|
"font": "t-body",
|
||||||
|
"textColor": "c-on-base--inverted"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
"rich-text#newsletter-subtitle": {
|
||||||
|
"props": {
|
||||||
|
"blockClass": "newsletterSubtitle",
|
||||||
|
"text": "Receba ofertas e novidades por e-mail",
|
||||||
|
"textAlignment": "CENTER",
|
||||||
|
"textPosition": "CENTER",
|
||||||
|
"textColor": "c-on-base-300"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
@ -27,6 +27,7 @@
|
|||||||
"text": "## Você também pode gostar:",
|
"text": "## Você também pode gostar:",
|
||||||
"textPosition": "CENTER",
|
"textPosition": "CENTER",
|
||||||
"textAlignment": "CENTER",
|
"textAlignment": "CENTER",
|
||||||
|
"textColor": "c-on-base-200",
|
||||||
"blockClass": "productShelfTitle"
|
"blockClass": "productShelfTitle"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -39,7 +40,6 @@
|
|||||||
"(min-width:1025px)": 4,
|
"(min-width:1025px)": 4,
|
||||||
"(min-width:768px)": 3,
|
"(min-width:768px)": 3,
|
||||||
"tablet": 2,
|
"tablet": 2,
|
||||||
|
|
||||||
"phone": 2
|
"phone": 2
|
||||||
},
|
},
|
||||||
"fullWidth": true
|
"fullWidth": true
|
||||||
@ -59,6 +59,14 @@
|
|||||||
"showBadge": false,
|
"showBadge": false,
|
||||||
"alabelSellingPricespectRatio": "1:1",
|
"alabelSellingPricespectRatio": "1:1",
|
||||||
"aspectRatio": "1:1",
|
"aspectRatio": "1:1",
|
||||||
|
"maxHeight": {
|
||||||
|
"(min-width: 1921px)": "434.4px",
|
||||||
|
"desktop": "314.4px",
|
||||||
|
"(min-width:1025px)": "314.4px",
|
||||||
|
"(min-width:768px)": "291.2px",
|
||||||
|
"tablet": "291.2px",
|
||||||
|
"phone": "124.8px"
|
||||||
|
},
|
||||||
"width": {
|
"width": {
|
||||||
"(min-width: 1921px)": "434.4px",
|
"(min-width: 1921px)": "434.4px",
|
||||||
"desktop": "314.4px",
|
"desktop": "314.4px",
|
||||||
|
@ -109,9 +109,18 @@
|
|||||||
"flex-layout.row#product-specification-1": {
|
"flex-layout.row#product-specification-1": {
|
||||||
"props": {
|
"props": {
|
||||||
"blockClass": "productSpecificationItemContainer",
|
"blockClass": "productSpecificationItemContainer",
|
||||||
"colGap": 7,
|
"colGap": {
|
||||||
|
"desktop": 7,
|
||||||
|
"(min-width:1025px)": 7,
|
||||||
|
"(min-iwdth:769px)": 0,
|
||||||
|
"tablet": 0,
|
||||||
|
"phone": 0
|
||||||
|
},
|
||||||
"marginTop": 7,
|
"marginTop": 7,
|
||||||
"rowGap": 5
|
"marginBottom": 5,
|
||||||
|
"border": "bottom",
|
||||||
|
"borderWidth": 1,
|
||||||
|
"borderColor": "action-third"
|
||||||
},
|
},
|
||||||
|
|
||||||
"children": [
|
"children": [
|
||||||
@ -123,9 +132,18 @@
|
|||||||
"flex-layout.row#product-specification-2": {
|
"flex-layout.row#product-specification-2": {
|
||||||
"props": {
|
"props": {
|
||||||
"blockClass": "productSpecificationItemContainer",
|
"blockClass": "productSpecificationItemContainer",
|
||||||
"colGap": 7,
|
"colGap": {
|
||||||
|
"desktop": 7,
|
||||||
|
"(min-width:1025px)": 7,
|
||||||
|
"(min-iwdth:769px)": 0,
|
||||||
|
"tablet": 0,
|
||||||
|
"phone": 0
|
||||||
|
},
|
||||||
"marginTop": 7,
|
"marginTop": 7,
|
||||||
"rowGap": 5
|
"marginBottom": 5,
|
||||||
|
"border": "bottom",
|
||||||
|
"borderWidth": 1,
|
||||||
|
"borderColor": "action-third"
|
||||||
},
|
},
|
||||||
|
|
||||||
"children": [
|
"children": [
|
||||||
@ -143,14 +161,28 @@
|
|||||||
|
|
||||||
"flex-layout.row#description-1": {
|
"flex-layout.row#description-1": {
|
||||||
"props": {
|
"props": {
|
||||||
"marginBottom": 7
|
"marginBottom": 7,
|
||||||
|
"marginTop": {
|
||||||
|
"desktop": 0,
|
||||||
|
"(min-width:1025px)": 0,
|
||||||
|
"(min-width:769px)": 5,
|
||||||
|
"tablet": 5,
|
||||||
|
"phone": 5
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"children": ["product-description#product-specification-1"]
|
"children": ["product-description#product-specification-1"]
|
||||||
},
|
},
|
||||||
|
|
||||||
"flex-layout.row#description-2": {
|
"flex-layout.row#description-2": {
|
||||||
"props": {
|
"props": {
|
||||||
"marginBottom": 7
|
"marginBottom": 7,
|
||||||
|
"marginTop": {
|
||||||
|
"desktop": 0,
|
||||||
|
"(min-width:1025px)": 0,
|
||||||
|
"(min-width:769px)": 5,
|
||||||
|
"tablet": 5,
|
||||||
|
"phone": 5
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"children": ["product-description#product-specification-2"]
|
"children": ["product-description#product-specification-2"]
|
||||||
},
|
},
|
||||||
|
@ -6,7 +6,7 @@
|
|||||||
"flex-layout.row#product-specifications",
|
"flex-layout.row#product-specifications",
|
||||||
"html#pdp-slider-shelf-title",
|
"html#pdp-slider-shelf-title",
|
||||||
"html#list-context-pdp-shelf",
|
"html#list-context-pdp-shelf",
|
||||||
"newsletter",
|
"flex-layout.row#newsletter",
|
||||||
"product-questions-and-answers"
|
"product-questions-and-answers"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
@ -56,14 +56,18 @@
|
|||||||
|
|
||||||
"flex-layout.row#product-main": {
|
"flex-layout.row#product-main": {
|
||||||
"props": {
|
"props": {
|
||||||
"colGap": 7,
|
"colGap": {
|
||||||
"rowGap": 7,
|
"desktop": 7,
|
||||||
|
"(min-width:1025px)": 7,
|
||||||
|
"tablet": 0,
|
||||||
|
"phone": 0
|
||||||
|
},
|
||||||
"marginTop": 5,
|
"marginTop": 5,
|
||||||
"marginBottom": 7,
|
"marginBottom": 7,
|
||||||
"preserveLayoutOnMobile": false,
|
"preserveLayoutOnMobile": false,
|
||||||
"blockClass": "productMain"
|
"blockClass": "productMain"
|
||||||
},
|
},
|
||||||
"children": ["flex-layout.col#stack", "flex-layout.col#right-col"]
|
"children": ["flex-layout.col#stack", "flex-layout.row#right-col"]
|
||||||
},
|
},
|
||||||
|
|
||||||
"stack-layout": {
|
"stack-layout": {
|
||||||
@ -105,6 +109,18 @@
|
|||||||
"rowGap": 0
|
"rowGap": 0
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"flex-layout.row#right-col": {
|
||||||
|
"props": {
|
||||||
|
"marginTop": {
|
||||||
|
"desktop": 0,
|
||||||
|
"(min-width:1025px)": 0,
|
||||||
|
"(min-width:769px)": 7,
|
||||||
|
"tablet": 7,
|
||||||
|
"phone": 7
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"children": ["flex-layout.col#right-col"]
|
||||||
|
},
|
||||||
|
|
||||||
"flex-layout.col#right-col": {
|
"flex-layout.col#right-col": {
|
||||||
"props": {
|
"props": {
|
||||||
@ -169,6 +185,7 @@
|
|||||||
|
|
||||||
"sku-selector": {
|
"sku-selector": {
|
||||||
"props": {
|
"props": {
|
||||||
|
"showValueForVariation": "none",
|
||||||
"variationsSpacing": 3,
|
"variationsSpacing": 3,
|
||||||
"showValueNameForImageVariation": true
|
"showValueNameForImageVariation": true
|
||||||
}
|
}
|
||||||
|
@ -153,6 +153,7 @@
|
|||||||
"border": {
|
"border": {
|
||||||
"action-primary": "#000000",
|
"action-primary": "#000000",
|
||||||
"action-secondary": "#eef3f7",
|
"action-secondary": "#eef3f7",
|
||||||
|
"action-third": "#b9b9b9",
|
||||||
"emphasis": "#f71963",
|
"emphasis": "#f71963",
|
||||||
"disabled": "#e3e4e6",
|
"disabled": "#e3e4e6",
|
||||||
"success": "#8bc34a",
|
"success": "#8bc34a",
|
||||||
@ -201,6 +202,10 @@
|
|||||||
},
|
},
|
||||||
"on": {
|
"on": {
|
||||||
"base": "#B9B9B999",
|
"base": "#B9B9B999",
|
||||||
|
|
||||||
|
"base-100": "#000000",
|
||||||
|
"base-200": "#575757",
|
||||||
|
"base-300": "#929292",
|
||||||
"base--inverted": "#ffffff",
|
"base--inverted": "#ffffff",
|
||||||
"action-primary": "#ffffff",
|
"action-primary": "#ffffff",
|
||||||
"action-secondary": "#000000",
|
"action-secondary": "#000000",
|
||||||
@ -263,8 +268,8 @@
|
|||||||
},
|
},
|
||||||
"heading-2": {
|
"heading-2": {
|
||||||
"fontFamily": "Open Sans, arial, sans-serif",
|
"fontFamily": "Open Sans, arial, sans-serif",
|
||||||
"fontWeight": "700",
|
"fontWeight": "400",
|
||||||
"fontSize": "2.25rem",
|
"fontSize": "1.5rem",
|
||||||
"textTransform": "initial",
|
"textTransform": "initial",
|
||||||
"letterSpacing": "0"
|
"letterSpacing": "0"
|
||||||
},
|
},
|
||||||
|
@ -110,10 +110,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
|
.flexRowContent--productSpecificationItemContainer,
|
||||||
.flexRowContent--productAvailability,
|
.flexRowContent--productAvailability,
|
||||||
.flexRowContent--productMain {
|
.flexRowContent--productMain {
|
||||||
flex-direction: column !important;
|
flex-direction: column !important;
|
||||||
}
|
}
|
||||||
|
.flexRowContent--productSpecificationItemContainer .stretchChildrenWidth,
|
||||||
.flexRowContent--productAvailability .stretchChildrenWidth,
|
.flexRowContent--productAvailability .stretchChildrenWidth,
|
||||||
.flexRowContent--productMain .stretchChildrenWidth {
|
.flexRowContent--productMain .stretchChildrenWidth {
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
@ -172,4 +174,61 @@
|
|||||||
.flexRow--productSpecificationItemContainer {
|
.flexRow--productSpecificationItemContainer {
|
||||||
padding: 0 32px;
|
padding: 0 32px;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexRowContent--productSpecificationItemContainer {
|
||||||
|
border-width: 1px !important;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 1025px) {
|
||||||
|
.flexRowContent--productSpecificationItemContainer {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexRow--newsletter {
|
||||||
|
background-color: #000;
|
||||||
|
margin-top: 32px;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 769px) {
|
||||||
|
.flexRow--newsletter {
|
||||||
|
margin-top: 64px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.flexRow--newsletter .flexRowContent--newsletter {
|
||||||
|
max-width: 774px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 64px 16px 32px;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 1025px) {
|
||||||
|
.flexRow--newsletter .flexRowContent--newsletter {
|
||||||
|
padding: 32px 0px 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexRowContent--newsletterInputs .stretchChildrenWidth:first-child {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
.flexRowContent--newsletterInputs .stretchChildrenWidth:first-child :global(.vtex-input-prefix__group) {
|
||||||
|
border-radius: 0;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
.flexRowContent--newsletterInputs .stretchChildrenWidth:first-child :global(.vtex-input-prefix__group) :global(.vtex-styleguide-9-x-input) {
|
||||||
|
border-radius: 0;
|
||||||
|
background-color: #000;
|
||||||
|
padding-left: 0;
|
||||||
|
border-bottom: 1px solid #fff;
|
||||||
|
}
|
||||||
|
.flexRowContent--newsletterInputs :global(.vtex-store-newsletter-1-x-formSubmitContainer) :global(.vtex-button) {
|
||||||
|
position: relative;
|
||||||
|
border-radius: 0;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
.flexRowContent--newsletterInputs :global(.vtex-store-newsletter-1-x-formSubmitContainer) :global(.vtex-button)::before {
|
||||||
|
content: "";
|
||||||
|
width: 100%;
|
||||||
|
height: 2px;
|
||||||
|
background-color: #fff;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0px;
|
||||||
}
|
}
|
@ -26,6 +26,10 @@
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.element {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.nameContainer {
|
.nameContainer {
|
||||||
padding-top: 1rem;
|
padding-top: 1rem;
|
||||||
padding-bottom: 1rem;
|
padding-bottom: 1rem;
|
||||||
|
@ -14,10 +14,18 @@
|
|||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
line-height: 38px;
|
line-height: 38px;
|
||||||
color: #575757;
|
margin: 0 0 24px;
|
||||||
}
|
}
|
||||||
@media screen and (min-width: 768px) {
|
@media screen and (min-width: 769px) {
|
||||||
.container--productShelfTitle .heading {
|
.container--productShelfTitle .heading {
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.container--newsletterTitle .heading {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container--newsletterSubtitle .paragraph {
|
||||||
|
margin: 16px;
|
||||||
}
|
}
|
@ -43,9 +43,30 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 0 40px;
|
padding: 0 40px;
|
||||||
}
|
}
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
.sliderLayoutContainer--productShelf {
|
||||||
|
width: 68.75%;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.sliderTrackContainer--productShelf {
|
||||||
|
padding-bottom: 33px;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 769px) {
|
||||||
|
.sliderTrackContainer--productShelf {
|
||||||
|
padding-bottom: 41px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 1025px) {
|
||||||
|
.sliderTrackContainer--productShelf {
|
||||||
|
padding-bottom: 49px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.paginationDotsContainer--productShelf {
|
.paginationDotsContainer--productShelf {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.paginationDot--productShelf {
|
.paginationDot--productShelf {
|
||||||
|
@ -292,4 +292,14 @@
|
|||||||
content: "Avise-se";
|
content: "Avise-se";
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productDescriptionTitle {
|
||||||
|
font-size: 20px;
|
||||||
|
line-height: 32px;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 1025px) {
|
||||||
|
.productDescriptionTitle {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
}
|
}
|
@ -102,6 +102,7 @@
|
|||||||
padding: 0 40px;
|
padding: 0 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.flexRowContent--productSpecificationItemContainer,
|
||||||
.flexRowContent--productAvailability,
|
.flexRowContent--productAvailability,
|
||||||
.flexRowContent--productMain {
|
.flexRowContent--productMain {
|
||||||
@media screen and (max-width: 1024px) {
|
@media screen and (max-width: 1024px) {
|
||||||
@ -171,3 +172,65 @@
|
|||||||
padding: 0 32px;
|
padding: 0 32px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.flexRowContent--productSpecificationItemContainer {
|
||||||
|
border-width: 1px !important;
|
||||||
|
|
||||||
|
@media screen and (min-width: 1025px) {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexRow--newsletter {
|
||||||
|
background-color: #000;
|
||||||
|
margin-top: 32px;
|
||||||
|
@media screen and (min-width: 769px) {
|
||||||
|
margin-top: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexRowContent--newsletter {
|
||||||
|
max-width: 774px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 64px 16px 32px;
|
||||||
|
|
||||||
|
@media screen and (min-width: 1025px) {
|
||||||
|
padding: 32px 0px 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexRowContent--newsletterInputs {
|
||||||
|
.stretchChildrenWidth:first-child {
|
||||||
|
flex-grow: 1;
|
||||||
|
|
||||||
|
:global(.vtex-input-prefix__group) {
|
||||||
|
border-radius: 0;
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
:global(.vtex-styleguide-9-x-input) {
|
||||||
|
border-radius: 0;
|
||||||
|
background-color: #000;
|
||||||
|
padding-left: 0;
|
||||||
|
border-bottom: 1px solid #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
:global(.vtex-store-newsletter-1-x-formSubmitContainer) {
|
||||||
|
:global(.vtex-button) {
|
||||||
|
position: relative;
|
||||||
|
border-radius: 0;
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: "";
|
||||||
|
width: 100%;
|
||||||
|
height: 2px;
|
||||||
|
background-color: #fff;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@ -18,6 +18,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.element {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.nameContainer {
|
.nameContainer {
|
||||||
padding-top: 1rem;
|
padding-top: 1rem;
|
||||||
padding-bottom: 1rem;
|
padding-bottom: 1rem;
|
||||||
|
@ -5,10 +5,22 @@
|
|||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
line-height: 38px;
|
line-height: 38px;
|
||||||
color: #575757;
|
margin: 0 0 24px;
|
||||||
|
|
||||||
@media screen and (min-width: 768px) {
|
@media screen and (min-width: 769px) {
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.container--newsletterTitle {
|
||||||
|
.heading {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.container--newsletterSubtitle {
|
||||||
|
.paragraph {
|
||||||
|
margin: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@ -33,10 +33,28 @@
|
|||||||
.sliderLayoutContainer--productShelf {
|
.sliderLayoutContainer--productShelf {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 0 40px;
|
padding: 0 40px;
|
||||||
|
|
||||||
|
@media screen and (min-width: 1921px) {
|
||||||
|
width: 68.75%;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.sliderTrackContainer--productShelf {
|
||||||
|
padding-bottom: 33px;
|
||||||
|
|
||||||
|
@media screen and (min-width: 769px) {
|
||||||
|
padding-bottom: 41px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: 1025px) {
|
||||||
|
padding-bottom: 49px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.paginationDotsContainer--productShelf {
|
.paginationDotsContainer--productShelf {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.paginationDot--productShelf {
|
.paginationDot--productShelf {
|
||||||
|
@ -329,3 +329,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.productDescriptionTitle {
|
||||||
|
font-size: 20px;
|
||||||
|
line-height: 32px;
|
||||||
|
|
||||||
|
@media screen and (min-width: 1025px) {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user