[Resolved] Shared Counts plugin new icons hover color css

Home Forums Support [Resolved] Shared Counts plugin new icons hover color css

Home Forums Support Shared Counts plugin new icons hover color css

  • This topic has 7 replies, 2 voices, and was last updated 2 years ago by David.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #2272414
    Philippe

    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

    #2272500
    David
    Staff
    Customer Support

    Hi there,

    can you share a link to the site where you’re trying to make those changes ?

    #2272520
    Philippe

    Sure. onehomeplanet.com

    I placed the Shared Counts plugin shortcode in a widget in the right hand column.

    #2272567
    David
    Staff
    Customer Support

    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;
    }
    #2272582
    Philippe

    It works. How would I have ever known how to write this code?

    #2272591
    David
    Staff
    Customer Support

    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:

    https://www.screencast.com/t/rniIJH0Ws

    #2272621
    Philippe

    Wow! That will be more than helpful. Thank you very much!

    #2272839
    David
    Staff
    Customer Support

    You’re very welcome 🙂

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.