anacarolinaduartecavalcante/challenge-vtex-io-ana-carolina-duarte-cavalcante
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Entrega do Desafio #1

Merged
anacarolinaduartecavalcante merged 93 commits from feature/challenge-vtex-io into develop 2023-02-03 17:14:03 +00:00
Conversation 0 Commits 93 Files Changed 68 +162 -1
7 changed files with 162 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit d8efee88b0 - Show all commits

7
react/components/Html/styles.css
View File

@ -1,3 +1,10 @@
/* Header Telemarketing */
:global(.vtex-telemarketing-2-x-wrapper){
background-color: #000000;
height: 34px;
}
/* Product Main */
@media (max-width: 2561px) and (min-width: 1920px) {

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

@ -8,6 +8,41 @@
*/
/* Media Query M3 */
/* Grid breakpoints */
.flexRow--main-header {
display: flex;
justify-content: center;
}
.flexRow--main-header .flexRowContent--main-header {
height: 97px;
display: flex;
justify-content: space-between;
align-items: center;
}
@media (max-width: 2561px) and (min-width: 1920px) {
.flexRow--main-header .flexRowContent--main-header {
margin: 0 auto;
padding-left: 360px;
padding-right: 360px;
}
}
.flexRow--main-header .flexRowContent--main-header :global(.vtex-minicart-2-x-minicartWrapperContainer) :global(.vtex-minicart-2-x-minicartContainer) :global(.vtex-minicart-2-x-openIconContainer) {
padding-right: 40px;
}
@media (max-width: 2561px) and (min-width: 1920px) {
.flexRow--main-header .flexRowContent--main-header :global(.vtex-minicart-2-x-minicartWrapperContainer) :global(.vtex-minicart-2-x-minicartContainer) :global(.vtex-minicart-2-x-openIconContainer) {
padding-right: 0;
}
}
.flexColChild :global(.vtex-menu-2-x-menuContainerNav) :global(.vtex-menu-2-x-menuContainer) :global(.vtex-menu-2-x-menuItem) :global(.vtex-menu-2-x-styledLink) :global(.vtex-menu-2-x-styledLinkContent) {
font-weight: 400;
font-size: 12px;
line-height: 16px;
letter-spacing: -0.1em;
text-transform: uppercase;
color: #929292;
}
.flexRowContent {
padding: 0;
margin: 0;

12
styles/css/vtex.sticky-layout.css
View File

@ -0,0 +1,12 @@
/*
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 */
.wrapper--sticky-header {
background-color: #ffffff !important;
}

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

@ -8,6 +8,23 @@
*/
/* Media Query M3 */
/* Grid breakpoints */
.logoContainer {
padding-left: 40px;
}
@media (max-width: 2561px) and (min-width: 1920px) {
.logoContainer {
padding-left: 0;
}
}
.autoCompleteOuterContainer:first-child :global(.vtex-input) :global(.vtex-input-prefix__group) {
border-top: none;
border-left: none;
border-right: none;
border-bottom: 1px solid #AEAEAE;
border-radius: 0;
}
.container {
width: 100%;
padding: 0;
@ -45,6 +62,9 @@
margin-right: 0;
}
}
.productImagesContainer .carouselContainer .carouselGaleryCursor .productImagesGallerySwiperContainer .productImagesGallerySlide {
margin: 0;
}
@media (max-width: 2560px) and (min-width: 1920px) {
.productImagesContainer .carouselContainer .carouselGaleryCursor .productImagesGallerySwiperContainer .productImagesGallerySlide {
height: 904px !important;
@ -69,6 +89,7 @@
.productImagesContainer .carouselContainer .carouselGaleryCursor .productImagesGallerySwiperContainer .productImagesGallerySlide .productImage .productImageTag--main {
object-fit: unset !important;
max-height: unset !important;
height: 664px !important;
}
@media (max-width: 2561px) and (min-width: 1920px) {
.productImagesContainer .carouselContainer .carouselGaleryCursor .productImagesGallerySwiperContainer .productImagesGallerySlide .productImage .productImageTag--main {

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

@ -1,3 +1,52 @@
//Header
.flexRow--main-header {
display: flex;
justify-content: center;
.flexRowContent--main-header {
height: 97px;
display: flex;
justify-content: space-between;
align-items: center;
@media (max-width: 2561px) and (min-width: 1920px) {
margin: 0 auto;
padding-left: 360px;
padding-right: 360px;
}
:global(.vtex-minicart-2-x-minicartWrapperContainer) {
:global(.vtex-minicart-2-x-minicartContainer) {
:global(.vtex-minicart-2-x-openIconContainer) {
padding-right: 40px;
@media (max-width: 2561px) and (min-width: 1920px) {
padding-right: 0;
}
}
}
}
}
}
//Menu
.flexColChild {
:global(.vtex-menu-2-x-menuContainerNav) {
:global(.vtex-menu-2-x-menuContainer) {
:global(.vtex-menu-2-x-menuItem) {
:global(.vtex-menu-2-x-styledLink) {
:global(.vtex-menu-2-x-styledLinkContent) {
font-weight: 400;
font-size: 12px;
line-height: 16px;
letter-spacing: -0.1em;
text-transform: uppercase;
color: #929292;
}
}
}
}
}
}
//product-images
.flexRowContent {

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

@ -1,3 +1,33 @@
//Logo Header
.logoContainer {
padding-left: 40px;
@media (max-width: 2561px) and (min-width: 1920px) {
padding-left: 0;
}
}
//Input Header
.autoCompleteOuterContainer {
&:first-child {
:global(.vtex-input) {
:global(.vtex-input-prefix__group){
// border: none !important;
border-top: none;
border-left: none;
border-right: none;
border-bottom: 1px solid #AEAEAE;
border-radius: 0;
// :global(.vtex-styleguide-9-x-input){
// border: none !important;
// }
// :global(.vtex-input__suffix){
// border: none !important;
// }
}
}
}
}
//product-images
.container {
@ -34,6 +64,7 @@
margin-right: 0;
}
.productImagesGallerySlide {
margin: 0;
@media (max-width: 2560px) and (min-width: 1920px) {
height: 904px !important;
}
@ -51,6 +82,7 @@
.productImageTag--main {
object-fit: unset !important;
max-height: unset !important;
height: 664px !important;
@media (max-width: 2561px) and (min-width: 1920px) {
height: 904px !important;
}
@ -235,7 +267,7 @@
}
:global(.vtex-store-components-3-x-submit) {
grid-area: C;
margin: 0;
margin: 0;
:global(.vtex-button) {
width: 100%;
@media (max-width: 768px) and (min-width: 375px) {

5
styles/sass/pages/product/vtex.sticky-layout.scss Normal file
View File

@ -0,0 +1,5 @@
// Header
.wrapper--sticky-header {
background-color: #ffffff !important;
}