diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc index 6a916dc..ebb3d11 100644 --- a/store/blocks/pdp/product.jsonc +++ b/store/blocks/pdp/product.jsonc @@ -16,7 +16,7 @@ "testId": "breadcrumbs", "blockClass": "pdp-breadcrumb" }, - "children": ["breadcrumb"] + "children": ["breadcrumb#pdp-breadcrumb"] }, "flex-layout.row#specifications-title": { "children": ["rich-text#specifications"] @@ -181,5 +181,12 @@ "Pinterest": true } } + }, + + "breadcrumb#pdp-breadcrumb": { + "props": { + "homeIconSize": 0, + "showOnMobile": true + } } } diff --git a/styles/css/agenciamagma.store-theme.css b/styles/css/agenciamagma.store-theme.css index 5e37ba5..6c3aa81 100644 --- a/styles/css/agenciamagma.store-theme.css +++ b/styles/css/agenciamagma.store-theme.css @@ -7,10 +7,7 @@ */ /* Media Query M3 */ /* Grid breakpoints */ -.html { - background-color: red; -} - .html--pdp-breadcrumb { - background-color: green; + width: 271.25px; + padding: 0 40px; } \ No newline at end of file diff --git a/styles/css/vtex.breadcrumb.css b/styles/css/vtex.breadcrumb.css new file mode 100644 index 0000000..587d8dc --- /dev/null +++ b/styles/css/vtex.breadcrumb.css @@ -0,0 +1,33 @@ +/* +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 */ +.container { + width: 100%; + display: flex; + flex-wrap: wrap; +} + +.homeLink::before { + content: "Home"; +} + +.arrow { + display: block; +} + +.termArrow { + padding: 0; +} +.termArrow .caretIcon { + display: none; +} + +.term { + font-size: 0; +} \ No newline at end of file diff --git a/styles/sass/pages/product/agenciamagma.store-theme.scss b/styles/sass/pages/product/agenciamagma.store-theme.scss index ea7d5b9..5c11d40 100644 --- a/styles/sass/pages/product/agenciamagma.store-theme.scss +++ b/styles/sass/pages/product/agenciamagma.store-theme.scss @@ -1,8 +1,6 @@ -.html { - background-color: red; -} +$containers: (); .html--pdp-breadcrumb { - background-color: green; + width: 271.25px; + padding: 0 40px; } - diff --git a/styles/sass/pages/product/vtex.breadcrumb.scss b/styles/sass/pages/product/vtex.breadcrumb.scss new file mode 100644 index 0000000..30760ad --- /dev/null +++ b/styles/sass/pages/product/vtex.breadcrumb.scss @@ -0,0 +1,30 @@ +.container { + width: 100%; + display: flex; + flex-wrap: wrap; +} + +.homeLink { + &::before { + content: "Home"; + } +} + +.arrow-1 { +} + +.arrow { + display: block; +} + +.termArrow { + padding: 0; + + .caretIcon { + display: none; + } +} + +.term { + font-size: 0; +}