estilização do mobile slid de produtos indicados
This commit is contained in:
parent
1b452ddcd8
commit
02f056b3b7
@ -69,4 +69,13 @@
|
|||||||
.flexRowContent--indisponivel .stretchChildrenWidth {
|
.flexRowContent--indisponivel .stretchChildrenWidth {
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
}
|
}
|
||||||
|
.flexRowContent--indisponivel :global(.vtex-store-components-3-x-content) {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
justify-content: initial;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
.flexRowContent--indisponivel .inputName {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
}
|
}
|
@ -30,8 +30,18 @@
|
|||||||
padding: 0 40px 0 40px;
|
padding: 0 40px 0 40px;
|
||||||
}
|
}
|
||||||
.sliderLayoutContainer--carousel .sliderLeftArrow--carousel {
|
.sliderLayoutContainer--carousel .sliderLeftArrow--carousel {
|
||||||
margin-left: 12px;
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
.sliderLayoutContainer--carousel .sliderLeftArrow--carousel::before {
|
||||||
|
visibility: visible;
|
||||||
|
content: url("https://agenciamagma.vtexassets.com/arquivos/arroe-left-ueber.png");
|
||||||
|
margin-left: 40px;
|
||||||
}
|
}
|
||||||
.sliderLayoutContainer--carousel .sliderRightArrow--carousel {
|
.sliderLayoutContainer--carousel .sliderRightArrow--carousel {
|
||||||
margin-right: 12px;
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
.sliderLayoutContainer--carousel .sliderRightArrow--carousel::after {
|
||||||
|
visibility: visible;
|
||||||
|
content: url("https://agenciamagma.vtexassets.com/arquivos/arroe-right-ueber.png");
|
||||||
|
margin-right: 40px;
|
||||||
}
|
}
|
@ -50,6 +50,11 @@
|
|||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media only screen and (max-width: 375px) {
|
||||||
|
.container .carouselGaleryThumbs {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.skuSelectorContainer {
|
.skuSelectorContainer {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -282,9 +287,19 @@
|
|||||||
.subscriberContainer .form .content .inputName {
|
.subscriberContainer .form .content .inputName {
|
||||||
grid-area: nome;
|
grid-area: nome;
|
||||||
}
|
}
|
||||||
|
@media only screen and (max-width: 1024px) {
|
||||||
|
.subscriberContainer .form .content .inputName {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
.subscriberContainer .form .content .inputEmail {
|
.subscriberContainer .form .content .inputEmail {
|
||||||
grid-area: email;
|
grid-area: email;
|
||||||
}
|
}
|
||||||
|
@media only screen and (max-width: 1024px) {
|
||||||
|
.subscriberContainer .form .content .inputEmail {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
.subscriberContainer .form .content .submit {
|
.subscriberContainer .form .content .submit {
|
||||||
grid-area: submit;
|
grid-area: submit;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
@ -66,6 +66,16 @@ margin-left: 10px;
|
|||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
:global(.vtex-store-components-3-x-content){
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
justify-content: initial;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inputName{
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -22,11 +22,21 @@
|
|||||||
margin-bottom: 64px;
|
margin-bottom: 64px;
|
||||||
padding: 0 40px 0 40px;
|
padding: 0 40px 0 40px;
|
||||||
.sliderLeftArrow--carousel{
|
.sliderLeftArrow--carousel{
|
||||||
margin-left: 12px;
|
visibility: hidden;
|
||||||
|
&::before{
|
||||||
|
visibility: visible;
|
||||||
|
content: url("https://agenciamagma.vtexassets.com/arquivos/arroe-left-ueber.png");
|
||||||
|
margin-left: 40px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.sliderRightArrow--carousel{
|
.sliderRightArrow--carousel{
|
||||||
margin-right: 12px;}
|
visibility: hidden;
|
||||||
|
&::after{
|
||||||
|
visibility: visible;
|
||||||
|
content: url("https://agenciamagma.vtexassets.com/arquivos/arroe-right-ueber.png");
|
||||||
|
margin-right: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@ -46,10 +46,17 @@ gap: 16px;
|
|||||||
@include mq (md, max) {
|
@include mq (md, max) {
|
||||||
.productNameContainer {
|
.productNameContainer {
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
@include mq (sm, max) {
|
||||||
|
.carouselGaleryThumbs{
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -412,10 +419,17 @@ padding-bottom: 15px;
|
|||||||
|
|
||||||
.inputName {
|
.inputName {
|
||||||
grid-area: nome;
|
grid-area: nome;
|
||||||
|
@include mq (md, max) {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.inputEmail {
|
.inputEmail {
|
||||||
grid-area: email;
|
grid-area: email;
|
||||||
|
@include mq (md, max) {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.submit {
|
.submit {
|
||||||
|
@ -22,7 +22,7 @@ $color-green: #4caf50;
|
|||||||
$grid-breakpoints: (
|
$grid-breakpoints: (
|
||||||
xs: 0,
|
xs: 0,
|
||||||
cstm: 400,
|
cstm: 400,
|
||||||
sm: 768px,
|
sm: 376px,
|
||||||
md: 1025px,
|
md: 1025px,
|
||||||
lg: 1920px,
|
lg: 1920px,
|
||||||
xl: 1921px
|
xl: 1921px
|
||||||
|
Loading…
Reference in New Issue
Block a user