Align elements of the card on Sense theme

Store Design
, ,
1

Hello everyone,

Link to shop - https://laromesss.myshopify.com/

Testing out some placements and playing around with cards. On a wide laptop screen, it is ok and the elements are aligned nicely:

SpaKovsKi_0-1669839648257.png
SpaKovsKi_0-1669839648257.png1328×602 124 KB

But with smaller screens and on mobile (also in Shop All on desktop) it looks very weird and elements are located at different heights etc. Both on Home Screen and Shop All link:

SpaKovsKi_1-1669839787295.png
SpaKovsKi_1-1669839787295.png422×518 41.7 KB

SpaKovsKi_2-1669839945586.png
SpaKovsKi_2-1669839945586.png1157×417 80.9 KB

How should I align these elements on all cards and all pages and also make the card width bigger on mobile?

Thanks in advance

2

@SpaKovsKi

Please add the following CSS code to your assets/base.css bottom of the file.

@media screen and (max-width: 749px){
.slider.grid--peek .grid__item {min-width: 90% !important;}
}

Thanks!

3

Hi @SpaKovsKi ,

Go to Assets > base.css and paste this at the bottom of the file:

@media screen and (max-width: 749px) {
  .collection .product-grid .slider__slide {
        width: calc(90% - var(--grid-mobile-horizontal-spacing) - 3rem) !important;
  }
}

Hope it helps!