Amandaalmeida/challenge-vtex-io-amanda-almeida
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(responsividade): adiciona responsividade ultrawite do footer

Browse Source
This commit is contained in:
amanda almeida 2023-02-10 03:46:53 -03:00
parent b4053515a5
commit 35dbd9cb0e
4 changed files with 49 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -11,7 +11,12 @@
border: 1px solid #FFFFFF; border: 1px solid #FFFFFF;
border-width: 1px 0; border-width: 1px 0;
} }
.flexRow--menu-row :global(.vtex-store-components-3-x-container) {
margin: 0;
min-width: 100%;
}
.flexRow--menu-row .flexRowContent--menu-row { .flexRow--menu-row .flexRowContent--menu-row {
padding: 32px 32px 128px;
justify-content: space-between; justify-content: space-between;
} }
.flexRow--menu-row .flexRowContent--menu-row .stretchChildrenWidth { .flexRow--menu-row .flexRowContent--menu-row .stretchChildrenWidth {
@ -121,6 +126,22 @@
min-width: 233px; min-width: 233px;
} }
@media screen and (min-width: 1920px) {
.flexRow--menu-row .flexRowContent--menu-row {
padding-left: 320px;
padding-right: 320px;
}
.flexRow--container-credits {
padding-left: 320px;
padding-right: 320px;
}
.flexRow--container-credits :global(.vtex-store-components-3-x-container) {
margin: 0;
}
.flexRow--container-credits .flexCol--credits {
align-items: flex-start;
}
}
.flexRow--main-header { .flexRow--main-header {
padding: 32px 40px; padding: 32px 40px;
background-color: #FFFFFF; background-color: #FFFFFF;

3
styles/css/vtex.menu.css
View File

@ -7,9 +7,6 @@
*/ */
/* Media Query M3 */ /* Media Query M3 */
/* Grid breakpoints */ /* Grid breakpoints */
:global(.vtex-flex-layout-0-x-flexRowContent--menu-row) {
padding: 32px 32px 128px;
}
:global(.vtex-flex-layout-0-x-flexRowContent--menu-row) .menuContainer { :global(.vtex-flex-layout-0-x-flexRowContent--menu-row) .menuContainer {
gap: 8px; gap: 8px;
} }

28
styles/sass/pages/footer/vtex.flex-layout.scss
View File

@ -2,8 +2,13 @@
border: 1px solid #FFFFFF; border: 1px solid #FFFFFF;
border-width: 1px 0; border-width: 1px 0;
:global(.vtex-store-components-3-x-container) {
margin: 0;
min-width: 100%;
}
.flexRowContent--menu-row { .flexRowContent--menu-row {
padding: 32px 32px 128px;
justify-content: space-between; justify-content: space-between;
.stretchChildrenWidth { .stretchChildrenWidth {
@ -135,4 +140,27 @@
display: flex; display: flex;
min-width: 233px; min-width: 233px;
} }
}
@media screen and (min-width:1920px) {
.flexRow--menu-row {
.flexRowContent--menu-row {
padding-left: 320px;
padding-right: 320px;
}
}
.flexRow--container-credits {
padding-left: 320px;
padding-right: 320px;
:global(.vtex-store-components-3-x-container) {
margin: 0;
}
.flexCol--credits {
align-items: flex-start;
}
}
} }

2
styles/sass/pages/footer/vtex.menu.scss
View File

@ -1,6 +1,4 @@
:global(.vtex-flex-layout-0-x-flexRowContent--menu-row) { :global(.vtex-flex-layout-0-x-flexRowContent--menu-row) {
padding: 32px 32px 128px;
.menuContainer { .menuContainer {
gap: 8px; gap: 8px;