Solved

Hovereffect on buttons - Dawn Theme

Dekanten
Pathfinder
143 1 49

Hello i have added a circle menu app, but i want to have a hoover who is working. The deal is i want the circles can be hover, a effect who is not being disturbing to look at. Calm effect somehow.

 

Can that being arranged, i will be very grateful indeed. : )

 

Also, any design ideas for the circles like colors and so on? I want it flat and matched with the theme. 🙂

 

Storeurl:

www.dekanten.no

 

See attached image:

 

Hovereffect.png

 

Accepted Solution (1)

aldy-expatify
Shopify Partner
39 3 8

This is an accepted solution.

Hi @Dekanten you can try using the code below.
- Go to the edit code > Assets > Add a new asset

aldy_expatify_0-1710817650214.png

- Create a blank file > Choose extension css > add the file name custom

aldy_expatify_1-1710817714311.png

- Go to the theme.liquid

aldy_expatify_2-1710817736185.png

- Find the code {{ 'base.css' | asset_url | stylesheet_tag }} and then put the code below after the base.css

{{ 'custom.css' | asset_url | stylesheet_tag }}

aldy_expatify_3-1710817835148.png

- Go to the custom.css again and put this code

aldy_expatify_4-1710818145433.png

 

.wishit-equal-item a:hover img {
    border: 5px solid #512260 !important;
}

 

If you like our solution, please like and mark it as a solution.
Don't hesitate to reach us for more Shopify solutions. Thanks 🙂
Website: Expatify Indonesia
Email: guru@expatify.co.id
Whatsapp: Whatsapp

View solution in original post

Replies 2 (2)

aldy-expatify
Shopify Partner
39 3 8

This is an accepted solution.

Hi @Dekanten you can try using the code below.
- Go to the edit code > Assets > Add a new asset

aldy_expatify_0-1710817650214.png

- Create a blank file > Choose extension css > add the file name custom

aldy_expatify_1-1710817714311.png

- Go to the theme.liquid

aldy_expatify_2-1710817736185.png

- Find the code {{ 'base.css' | asset_url | stylesheet_tag }} and then put the code below after the base.css

{{ 'custom.css' | asset_url | stylesheet_tag }}

aldy_expatify_3-1710817835148.png

- Go to the custom.css again and put this code

aldy_expatify_4-1710818145433.png

 

.wishit-equal-item a:hover img {
    border: 5px solid #512260 !important;
}

 

If you like our solution, please like and mark it as a solution.
Don't hesitate to reach us for more Shopify solutions. Thanks 🙂
Website: Expatify Indonesia
Email: guru@expatify.co.id
Whatsapp: Whatsapp
Dekanten
Pathfinder
143 1 49

Hello

 

This works like a charm just as what i wanted, this is a miracle come true. 🙂

 

THANK U SO MUCH, IM GRATEFUL WITH THIS SOLUTION. 🙂