How can I adjust the slider image size in the Impulse theme?

Hi,

im looking to change my featured collections slider on home page to look more like farfetch

bigger image

and slider lines under to scroll

my site is https://luxurymrkt.com

picture below :backhand_index_pointing_down:

1 Like

Hi @Luxurymrkt ,

You can use the code below to make the item bigger and change the slider

  1. From your Admin Page, click Online Store > Themes >Actions > Edit code
  2. In the Asset folder, open the theme.css
  3. Paste the code below at the very bottom of the file.
@media only screen and (max-width: 768px) {
.grid-overflow-wrapper .grid__item.grid-product {
    width: 50vw;
    flex: 0 0 50vw;
}

.grid__item.grid-product.small--one-half.medium-up--one-fifth.grid-product__has-quick-shop.aos-init.aos-animate {
    margin-bottom: 1rem;
}
}

.grid-overflow-wrapper::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 50%);
}

.grid-overflow-wrapper::-webkit-scrollbar {
    height: 3px;
}

.grid-overflow-wrapper::-webkit-scrollbar-track {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
}
1 Like

You’re amazing! Is there anyway to add these scroller lines so people know to swipe