How to remove the hover cursor line animation on homepage in Category Section.

Solved
Shivam97
Trailblazer
164 0 63

Hi,

Tried everything, How to remove the hover cursor animation on the homepage on category icons.

URL - www.portronics.com

animation hoov.png

 

0 Likes
Pallavi
Shopify Expert
2382 397 515

This is an accepted solution.

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

.skrim-grid .skrim__item a.skrim__link .grid__image {
transform: none !important;
transition: none !important;
}

.skrim-grid .skrim__item a.skrim__link .grid__image:before, .skrim-grid .skrim__item a.skrim__link .grid__image:after {
display: none !important;
}

 

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
Shivam97
Trailblazer
164 0 63

It worked, Thanks. @Pallavi 

But I need hover bubble little zoom animation, the cursor animation animation is gone thats great. 

And can you help me look like this  with same animation as reference image for my category look.

homepage icons.PNG

url - www.mi.com

 

0 Likes
Pallavi
Shopify Expert
2382 397 515

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

div#shopify-section-1543003878234 .page-width .skrim-grid {background: transparent;padding: 0;}

div#shopify-section-1543003878234 .page-width .skrim-grid .skrim__item {
    margin: 0  6px 12px;
}

div#shopify-section-1543003878234 .page-width .skrim-grid .skrim__item:hover {
    box-shadow: 0px 0px 5px 0px rgb(191 191 191 / 64%);
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
Shivam97
Trailblazer
164 0 63

Thanks @Pallavi It worked. 

Thankyou So much,

How can make it in slightly rounded Corners so it will look nice.

Thanks though @Pallavi 

 

0 Likes