IMPULSE PROMOTION GRID BUTTON HOVER COLOR

Store Design
1

Hi,

store: vibovisionboards.myshopify.com

pw: whauch

I have a promotional grid in my store that I would like to make some custom changes to as per below:

1 - Button color changes to #ff6f0f on hover

2 - Reduce top and bottom padding on promotional grid (ie - reduce padding between grid and hero image and whatever lies below grid).

Additionally on my hero image I would like to change the button to be transparent with an orange border, with orange fill color on hover.

Appreciate your help in implementing these changes.

Thanks,

Jeremy

2

@VIBO

can you try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.css ->paste below code at the bottom of the file.
.promo-grid__content a.btn.btn--inverse:hover {background: #ff6f0f;}
.promo-grid__content {z-index: 9;}
.promo-grid--space-top {padding-top: 15px !important;padding-bottom: 15px !important;}
3

Thanks Ketan, that code works perfectly. Is there a way I can apply the same button style to my Hero image section?

Thanks,

Jeremy

4

Also I would like to have the promo grid picture scroll to the secondary picture of the linked product on hover, is this possible?