Merge pull request 'feat: adiciona css 2560px' (#28) from feature/adiciona-css-2560px into development

Reviewed-on: #28
This commit is contained in:
Rafael Sampaio de Oliveira 2023-02-03 11:23:14 +00:00
commit fc31647bd5
14 changed files with 108 additions and 7 deletions

View File

@ -27,6 +27,18 @@
[class*="html--productDescription"] {
padding: 0 40px;
width: 100%;
}
[class*="html--shelf"] {
display: flex;
justify-content: center;
}
@media (min-width: 1921px) {
[class*="html--descriptionImage"] {
width: 47.392%;
}
}
@media (max-width: 1024px) {

View File

@ -9,7 +9,7 @@
// "product-specification-group#table",
// "shelf.relatedProducts",
"rich-text#shelfTitle",
"list-context.product-list#shelfProducts",
"html#shelf",
"newsletter#pageProduct",
"product-questions-and-answers"
]
@ -258,6 +258,13 @@
// }
// },
"html#shelf": {
"props": {
"blockClass": "shelf"
},
"children": ["list-context.product-list#shelfProducts"]
},
"list-context.product-list#shelfProducts": {
"blocks": ["product-summary.shelf#shelfProducts"],
"children": ["slider-layout#demo-products"]

View File

@ -52,4 +52,10 @@
display: block;
content: "Sandálias";
font-size: 16px;
}
@media (min-width: 1921px) {
.container {
max-width: 1840px;
}
}

View File

@ -133,6 +133,11 @@
padding: 0;
}
@media (min-width: 1921px) {
.flexRowContent--product-container {
max-width: 1840px;
}
}
@media (max-width: 1024px) {
.flexRow--product-container :global(.vtex-store-components-3-x-container) {
padding: 0 40px;

View File

@ -38,6 +38,12 @@
max-width: 314px !important;
}
@media (min-width: 1921px) {
.image {
width: 434.4px;
height: 434.4px;
}
}
@media (max-width: 1024px) {
.brandName {
font-size: 14px;

View File

@ -61,6 +61,15 @@
content: url("https://agenciamagma.vtexassets.com/arquivos/rafaelSampaioRightArrow.png");
}
@media (min-width: 1921px) {
.sliderLayoutContainer--shelf {
max-width: 1840px;
}
.sliderTrackContainer--shelf {
width: 100%;
max-width: 1840px;
}
}
@media (max-width: 1024px) {
.sliderTrack--shelf {
gap: 12px !important;

View File

@ -478,6 +478,12 @@
margin: 0;
}
@media (min-width: 1921px) {
.container--pageProduct {
width: 100%;
max-width: 774px;
}
}
@media (max-width: 1024px) {
.productBrand--quickview {
justify-content: flex-start;

View File

@ -10,6 +10,10 @@
/* Grid breakpoints */
.container--description {
margin-top: 16px;
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
}
.contentItem {
@ -56,6 +60,12 @@
text-transform: capitalize;
}
@media (min-width: 1921px) {
.listContainer,
.contentContainer {
max-width: 1840px;
}
}
@media (max-width: 1024px) {
.listContainer {
flex-direction: column;

View File

@ -42,3 +42,9 @@
content: "Sandálias";
font-size: 16px;
}
@media (min-width: 1921px) {
.container {
max-width: 1840px;
}
}

View File

@ -126,6 +126,12 @@
}
}
@media (min-width: 1921px) {
.flexRowContent--product-container {
max-width: 1840px;
}
}
@media (max-width: 1024px) {
.flexRow--product-container :global(.vtex-store-components-3-x-container) {
padding: 0 40px;

View File

@ -28,6 +28,13 @@
max-width: 314px !important;
}
@media (min-width: 1921px) {
.image {
width: 434.4px;
height: 434.4px;
}
}
@media (max-width: 1024px) {
.brandName {
font-size: 14px;

View File

@ -53,13 +53,16 @@
}
}
// .slide--shelf--visible {
// width: 5.1308% !important;
// }
@media (min-width: 1921px) {
.sliderLayoutContainer--shelf {
max-width: 1840px;
}
// .slide--shelf--hidden {
// visibility: hidden;
// }
.sliderTrackContainer--shelf {
width: 100%;
max-width: 1840px;
}
}
@media (max-width: 1024px) {
.sliderTrack--shelf {

View File

@ -490,6 +490,13 @@
margin: 0;
}
@media (min-width: 1921px) {
.container--pageProduct {
width: 100%;
max-width: 774px;
}
}
@media (max-width: 1024px) {
.productBrand--quickview {
justify-content: flex-start;

View File

@ -1,5 +1,9 @@
.container--description {
margin-top: 16px;
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
}
.contentItem {
@ -46,6 +50,13 @@
text-transform: capitalize;
}
@media (min-width: 1921px) {
.listContainer,
.contentContainer {
max-width: 1840px;
}
}
@media (max-width: 1024px) {
.listContainer {
flex-direction: column;