DaviKlein/challenge-vtex-io-davi-klein
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

feat(product-slider): Adiciona o componente e estilizacao do slider

Browse Source
This commit is contained in:
DaviHKlein 2023-02-10 14:44:04 -03:00
parent 2054848597
commit f525bd7d94
1 changed files with 122 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
styles/sass/pages/product/vtex.flex-layout.scss Normal file
View File

@ -0,0 +1,122 @@
// .flexRow {
// width: auto;
// padding: 0 40px;
// }
:global(.vtex-breadcrumb-1-x-container) {
padding: 0 40px;
:nth-child(n) {
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: #929292;
}
:global(.vtex-breadcrumb-1-x-term) {
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 19px;
color: #929292;
}
}
:global(.vtex-telemarketing-2-x-wrapper) {
:global(.vtex-store-components-3-x-container) {
margin: auto;
}
}
:global(.vtex-store-components-3-x-container) {
padding-left: 0px;
padding-right: 0px;
@media (min-width: 2560px) {
max-width: 100%;
margin: 0 320px;
}
:global(.vtex-flex-layout-0-x-flexRowContent) {
:global(.vtex-flex-layout-0-x-stretchChildrenWidth) {
padding-right: 0 !important;
overflow: hidden;
}
}
:global(.vtex-flex-layout-0-x-flexRowContent) {
display: flex;
flex-direction: row;
align-items: flex-start;
padding: 0px 40px;
gap: 32px;
margin-top: 16px;
margin-bottom: 16px;
@media (max-width: 1024px) {
flex-direction: column;
}
:global(.vtex-flex-layout-0-x-flexRow) {
:global(.vtex-flex-layout-0-x-flexRowContent) {
display: block;
padding: 0;
margin-top: 0;
margin-bottom: 0;
}
}
}
}
.addButton {
width: 100%;
}
.flexRow--buyButton {
width: 100%;
.flexRowContent--buyButton {
margin: 0;
:global(.vtex-button) {
background-color: black;
height: 49px;
border: none;
border-radius: unset;
}
:global(.vtex-add-to-cart-button-0-x-buttonText) {
font-size: 0;
&::after {
content: "ADICIONAR À SACOLA";
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 25px;
color: #ffffff;
}
}
}
}
@media screen and (max-width: 1024px) {
:global(.vtex-flex-layout-0-x-flexRowContent) {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.flexColChild {
width: 100%;
}
}
@media screen and (max-width: 376px) {
:global(.vtex-add-to-cart-button-0-x-buttonText) {
max-width: 168px;
}
.flexRow--buyButton {
.flexRowContent--buyButton {
:global(.vtex-button) {
height: 74px !important;
}
}
}
}