Gabriel_Ferraz_Nogueira/challenge-vtex-io-gabriel-ferraz
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: adição placeholder no input]

Browse Source
This commit is contained in:
Gabriel Ferraz Nogueira 2023-02-01 19:12:53 -03:00
parent d3bd6e5795
commit 5a15c8b3cb
14 changed files with 88 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
react/Placeholder.tsx Normal file
View File

@ -0,0 +1,3 @@
import Placeholder from './components/Placeholder/Placeholder'
export default Placeholder

2
react/components/Html/style.css
View File

@ -8,7 +8,7 @@
[class*='html'] > [class*='button'] {
width: 100%;
height: 49px;
margin-right: 40px;
/* margin-right: 40px; */
background: #000;
border: #000;
}

9
react/components/Placeholder/Placeholder.tsx Normal file
View File

@ -0,0 +1,9 @@
const Placeholder = () => {
if (typeof document !== 'undefined') {
const InputCep = document.querySelector('.vtex-address-form-4-x-input')
InputCep?.setAttribute('placeholder', 'Digite seu CEP')
}
return null
}
export default Placeholder

8
store/blocks/pdp/product.jsonc
View File

@ -4,8 +4,8 @@
"html#breadcrumb",
"condition-layout.product#availability",
"tab-layout#desc",
"flex-layout.row#specifications-title",
"product-specification-group#table",
// "flex-layout.row#specifications-title",
// "product-specification-group#table",
"shelf.relatedProducts",
"product-questions-and-answers"
]
@ -78,7 +78,8 @@
"flex-layout.col#stack": {
"children": ["stack-layout"],
"props": {
"width": "46%",
"width": "51%",
// "maxHeight": 664,
"rowGap": 0
}
},
@ -111,6 +112,7 @@
"pix",
"sku-selector",
"html#quantityAndButton",
"Placeholder",
"product-assembly-options",
"product-gifts",
"availability-subscriber",

3
store/interfaces.json
View File

@ -12,5 +12,8 @@
"Parcelamento": {
"component": "Parcelamento"
},
"Placeholder": {
"component": "Placeholder"
}
}

14
styles/css/vtex.flex-layout.css
View File

@ -7,7 +7,15 @@
*/
/* Media Query M3 */
/* Grid breakpoints */
.stretchChildrenWidth {
margin: 0;
padding: 0;
:global(.vtex-store-components-3-x-container) {
padding: 0 40px;
}
:global(.vtex-store-components-3-x-container) :global(.vtex-store-components-3-x-productImageTag) {
max-height: 664px !important;
}
:global(.vtex-store-components-3-x-container) :global(.vtex-store-components-3-x-carouselGaleryThumbs) .swiper-container {
display: none;
}
:global(.vtex-store-components-3-x-container) :global(.vtex-store-components-3-x-carouselGaleryThumbs) .swiper-container .swiper-wrapper {
display: none;
}

1
styles/css/vtex.product-identifier.css
View File

@ -10,7 +10,6 @@
.product-identifier {
display: flex;
justify-content: flex-end;
margin-right: 40px;
font-family: "Open Sans", sans-serif;
font-style: normal;
font-weight: 400;

24
styles/css/vtex.shelf.css Normal file
View File

@ -0,0 +1,24 @@
@charset "UTF-8";
/*
0 - 600PX: Phone
600 - 900px: Table portrait
900 - 1200px: Tablet landscape
[1200 - 1800] is where our nortal styles apply
1800px + : Big desktop
*/
/* Media Query M3 */
/* Grid breakpoints */
.title {
font-size: 0;
}
.title::before {
content: "Você também pode gostar:";
font-family: "Open Sans", sans-serif;
font-style: normal;
font-weight: 400;
font-size: 24px;
line-height: 38px;
text-align: center;
color: #575757;
}

12
styles/css/vtex.store-components.css
View File

@ -11,15 +11,9 @@
background: red;
}
.carouselGaleryThumbs {
width: 59.24%;
padding-left: 40px;
}
.productBrand {
display: flex;
justify-content: flex-end;
margin-right: 37px;
font-family: "Open Sans", sans-serif;
font-style: normal;
font-weight: 300;
@ -94,12 +88,6 @@
.shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input) :global(.vtex-input-prefix__group) :global(.vtex-address-form-4-x-input) {
padding: 0;
}
.shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-input) :global(.vtex-input-prefix__group) :global(.vtex-address-form-4-x-input)::before {
content: "Digite seu cep";
height: 16px;
width: 16px;
background: red;
}
.shippingContainer :global(.vtex-address-form__postalCode) :global(.vtex-address-form__postalCode-forgottenURL) {
display: flex;
position: absolute;

1
styles/sass/pages/product/vtex.breadcrumb.scss
View File

@ -13,7 +13,6 @@
font-size: 16px;
color: #929292;
}
.homeLink:hover::before {
color: #0f3e99;
}

17
styles/sass/pages/product/vtex.flex-layout.scss
View File

@ -1,4 +1,15 @@
.stretchChildrenWidth {
margin: 0;
padding: 0;
:global(.vtex-store-components-3-x-container) {
padding: 0 40px;
:global(.vtex-store-components-3-x-productImageTag) {
max-height: 664px !important;
}
:global(.vtex-store-components-3-x-carouselGaleryThumbs) {
.swiper-container {
display: none;
.swiper-wrapper {
display: none;
}
}
}
}

2
styles/sass/pages/product/vtex.product-identifier.scss
View File

@ -1,7 +1,7 @@
.product-identifier {
display: flex;
justify-content: flex-end;
margin-right: 40px;
// margin-right: 40px;
font-family: "Open Sans", sans-serif;
font-style: normal;

16
styles/sass/pages/product/vtex.shelf.scss Normal file
View File

@ -0,0 +1,16 @@
.title {
font-size: 0;
}
.title::before {
content: 'Você também pode gostar:';
font-family: 'Open Sans', sans-serif;
font-style: normal;
font-weight: 400;
font-size: 24px;
line-height: 38px;
text-align: center;
color: #575757;
}

14
styles/sass/pages/product/vtex.store-components.scss
View File

@ -2,15 +2,10 @@
background: red;
}
.carouselGaleryThumbs {
width: 59.24%;
padding-left: 40px;
}
.productBrand {
display: flex;
justify-content: flex-end;
margin-right: 37px;
// margin-right: 37px;
font-family: 'Open Sans', sans-serif;
font-style: normal;
@ -98,13 +93,6 @@
:global(.vtex-address-form-4-x-input) {
padding: 0;
}
:global(.vtex-address-form-4-x-input)::before {
content: 'Digite seu cep';
height: 16px;
width: 16px;
background: red;
}
}
}