forked from M3-Academy/challenge-vtex-io
feat(pdp/breadcrumb): added spacing in container
This commit is contained in:
parent
7cd953a61d
commit
17e9e3b171
@ -15,7 +15,6 @@
|
||||
"postreleasy": "vtex publish --verbose"
|
||||
},
|
||||
"dependencies": {
|
||||
"agenciamagma.store-theme": "5.x",
|
||||
"vtex.store": "2.x",
|
||||
"vtex.store-header": "2.x",
|
||||
"vtex.product-summary": "2.x",
|
||||
|
@ -1,3 +0,0 @@
|
||||
import Example from "./components/Example/Example";
|
||||
|
||||
export default Example;
|
@ -1,9 +0,0 @@
|
||||
import React from 'react'
|
||||
|
||||
const Example = () => {
|
||||
return (
|
||||
<div>Example</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Example
|
@ -2,8 +2,6 @@
|
||||
"store.home": {
|
||||
"blocks": [
|
||||
"list-context.image-list#demo",
|
||||
"example-component", /* You can make references to blocks defined in other files.
|
||||
* For example, `flex-layout.row#deals` is defined in the `deals.json` file. */
|
||||
"flex-layout.row#deals",
|
||||
"__fold__",
|
||||
"rich-text#shelf-title",
|
||||
|
@ -18,6 +18,14 @@
|
||||
},
|
||||
"children": ["breadcrumb#pdp-breadcrumb"]
|
||||
},
|
||||
|
||||
"breadcrumb#pdp-breadcrumb": {
|
||||
"props": {
|
||||
"homeIconSize": 0,
|
||||
"showOnMobile": true
|
||||
}
|
||||
},
|
||||
|
||||
"flex-layout.row#specifications-title": {
|
||||
"children": ["rich-text#specifications"]
|
||||
},
|
||||
@ -87,13 +95,11 @@
|
||||
},
|
||||
"product-images": {
|
||||
"props": {
|
||||
"aspectRatio": {
|
||||
"desktop": "auto",
|
||||
"phone": "16:9"
|
||||
},
|
||||
"aspectRatio": "1:1",
|
||||
"displayThumbnailsArrows": true
|
||||
}
|
||||
},
|
||||
|
||||
"flex-layout.col#right-col": {
|
||||
"props": {
|
||||
"preventVerticalStretch": true,
|
||||
@ -113,8 +119,7 @@
|
||||
"product-gifts",
|
||||
"flex-layout.row#buy-button",
|
||||
"availability-subscriber",
|
||||
"shipping-simulator",
|
||||
"share#default"
|
||||
"shipping-simulator"
|
||||
]
|
||||
},
|
||||
|
||||
@ -170,23 +175,5 @@
|
||||
"blockClass": "message-availability"
|
||||
},
|
||||
"children": ["availability-subscriber"]
|
||||
},
|
||||
|
||||
"share#default": {
|
||||
"props": {
|
||||
"social": {
|
||||
"Facebook": true,
|
||||
"WhatsApp": true,
|
||||
"Twitter": false,
|
||||
"Pinterest": true
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
"breadcrumb#pdp-breadcrumb": {
|
||||
"props": {
|
||||
"homeIconSize": 0,
|
||||
"showOnMobile": true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -6,20 +6,4 @@
|
||||
1800px + : Big desktop
|
||||
*/
|
||||
/* Media Query M3 */
|
||||
/* Grid breakpoints */
|
||||
.html--pdp-breadcrumb {
|
||||
width: 100%;
|
||||
padding: 0 40px;
|
||||
}
|
||||
@media screen and (min-width: 1025px) {
|
||||
.html--pdp-breadcrumb {
|
||||
width: 94.4444444444%;
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1921px) {
|
||||
.html--pdp-breadcrumb {
|
||||
width: 68.75%;
|
||||
}
|
||||
}
|
||||
/* Grid breakpoints */
|
@ -9,11 +9,23 @@
|
||||
/* Grid breakpoints */
|
||||
.container {
|
||||
width: 100%;
|
||||
display: inline-flex;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-basis: 100%;
|
||||
align-items: baseline;
|
||||
}
|
||||
@media screen and (min-width: 1025px) {
|
||||
.container {
|
||||
width: 94.4444444444%;
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1921px) {
|
||||
.container {
|
||||
width: 68.75%;
|
||||
}
|
||||
}
|
||||
|
||||
.termArrow {
|
||||
padding: 0;
|
||||
|
@ -1,14 +0,0 @@
|
||||
.html--pdp-breadcrumb {
|
||||
width: 100%;
|
||||
padding: 0 40px;
|
||||
|
||||
@media screen and (min-width: 1025px) {
|
||||
width: 94.44444444444444%;
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1921px) {
|
||||
width: 68.75%;
|
||||
}
|
||||
}
|
@ -1,9 +1,19 @@
|
||||
.container {
|
||||
width: 100%;
|
||||
display: inline-flex;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-basis: 100%;
|
||||
align-items: baseline;
|
||||
|
||||
@media screen and (min-width: 1025px) {
|
||||
width: 94.44444444444444%;
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1921px) {
|
||||
width: 68.75%;
|
||||
}
|
||||
}
|
||||
|
||||
.termArrow {
|
||||
|
Loading…
Reference in New Issue
Block a user