andreamatsunaga/challenge-vtex-io-andrea-matsunaga
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'feature/breadcrumb' into development

Browse Source
This commit is contained in:
Andrea Matsunaga 2023-02-11 00:11:27 -03:00
commit 5164435010
8 changed files with 19 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
styles/css/vtex.breadcrumb.css
View File

@ -10,6 +10,11 @@
.container { .container {
padding: 0 40px 16px; padding: 0 40px 16px;
} }
@media only screen and (min-width: 1920px) {
.container {
padding: 0 360px 16px;
}
}
.container .link { .container .link {
font-size: 14px; font-size: 14px;
line-height: 19px; line-height: 19px;

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

@ -42,7 +42,7 @@
margin: 0; margin: 0;
} }
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.flexCol--right-col, .flexCol--right-col,
.flexCol--info-availability { .flexCol--info-availability {
margin-top: 32px; margin-top: 32px;

2
styles/css/vtex.product-quantity.css
View File

@ -11,7 +11,7 @@
.quantitySelectorContainer { .quantitySelectorContainer {
margin: 0; margin: 0;
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.quantitySelectorContainer { .quantitySelectorContainer {
margin-bottom: 10px; margin-bottom: 10px;
} }

2
styles/css/vtex.product-summary.css
View File

@ -20,7 +20,7 @@
padding: 0 6px; padding: 0 6px;
} }
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.container .element { .container .element {
padding: 0 4px; padding: 0 4px;
} }

2
styles/css/vtex.rich-text.css
View File

@ -21,7 +21,7 @@
margin-bottom: 24px; margin-bottom: 24px;
} }
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.container--see-also .headingLevel4 { .container--see-also .headingLevel4 {
margin-bottom: 16px; margin-bottom: 16px;
padding: 0 40px; padding: 0 40px;

4
styles/css/vtex.slider-layout.css
View File

@ -20,7 +20,7 @@
padding: 0 57.2px 105px; padding: 0 57.2px 105px;
} }
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.sliderLayoutContainer--carousel { .sliderLayoutContainer--carousel {
padding: 0 55.2px 65px; padding: 0 55.2px 65px;
} }
@ -65,7 +65,7 @@
gap: 12px; gap: 12px;
align-items: center; align-items: center;
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.sliderLayoutContainer--carousel .paginationDotsContainer { .sliderLayoutContainer--carousel .paginationDotsContainer {
bottom: 32px; bottom: 32px;
} }

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

@ -165,7 +165,7 @@
width: 43.33%; width: 43.33%;
} }
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.shippingContainer { .shippingContainer {
width: 100%; width: 100%;
} }
@ -175,7 +175,7 @@
display: flex; display: flex;
gap: 32px; gap: 32px;
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.shippingContainer :global(.vtex-address-form__postalCode) { .shippingContainer :global(.vtex-address-form__postalCode) {
flex-direction: column; flex-direction: column;
gap: 8px; gap: 8px;
@ -232,7 +232,7 @@
line-height: 16px; line-height: 16px;
text-decoration-line: underline; text-decoration-line: underline;
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.shippingContainer :global(.vtex-address-form__postalCode-forgottenURL) { .shippingContainer :global(.vtex-address-form__postalCode-forgottenURL) {
padding: 0; padding: 0;
justify-content: flex-end; justify-content: flex-end;
@ -258,7 +258,7 @@
width: 34.54%; width: 34.54%;
} }
} }
@media only screen and (max-width: 639px) { @media only screen and (max-width: 767px) {
.shippingTable { .shippingTable {
width: 100%; width: 100%;
} }

4
styles/sass/partials/breadcrumb/vtex.breadcrumb.scss
View File

@ -1,6 +1,10 @@
.container { .container {
padding: 0 40px 16px; padding: 0 40px 16px;
@include mq(xl, min) {
padding: 0 360px 16px;
}
.link { .link {
font-size: 14px; font-size: 14px;
line-height: 19px; line-height: 19px;