Archived topic
Shared Counts plugin new icons hover color css
7 replies · Started by Philippe on July 4, 2022
Hi,
I am desperately trying to add the proper css for Reddit and Whatsapp icon colors when hovering over them. The instructions I found on https://generatepress-guides.com/2020/12/16/how-to-add-reddit-to-shared-counts/ are way too vague and all the tweaking I have been doing is to no avail.
Can you tell me what the good css is?
Thank you,
Philippe
Hi there,
can you share a link to the site where you're trying to make those changes ?
Sure. onehomeplanet.com
I placed the Shared Counts plugin shortcode in a widget in the right hand column.
Try this CSS:
.shared-counts-wrap.style-icon .shared-counts-button:hover.reddit svg {
fill: #FF5700;
}
.shared-counts-wrap.style-icon .shared-counts-button:hover.whatsapp svg {
fill: #25D366;
}It works. How would I have ever known how to write this code?
Thats a trickier one, as i had to look for the SVG icon, to see it was using a Fill Color.
Then i had to look where the :hover event was most likely to take place. Which i assumed would be on the <a> link.
So by right click > inspecting the SVG icon, i could trace back to the link, apply a hover and then look around for the correct CSS. See here:
Wow! That will be more than helpful. Thank you very much!
You're very welcome :)
