Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #582733

    Hi there,

    Is it possible to invert the behavior/look of the social share buttons in the Avia editor?
    So I would like to see the colored version and when I hover it, it should become transparent?

    Regards,
    Marcel

    #583195

    Hey Marcel,

    Could you provide us with a link to the site in question so that we can take a closer look please?

    Best regards,
    Rikard

    #583290

    Hi there, sure, here it is!

    As you can see, the default icons are not very visible now, it would be great if the hover effect would work inverted :)

    #583900

    Hi,

    Please try the following in Quick CSS under Enfold–>General Styling:

    .av-social-link-facebook {
    background-color:blue !important;
    }
    
    .av-social-link-twitter {
    background-color:lightblue !important;
    }
    
    .av-social-link-mail {
    background-color:green !important;
    }
    
    .av-social-link-facebook:hover, .av-social-link-twitter:hover, .av-social-link-mail:hover {
    background-color:transparent !important;
    }

    Thanks,
    Rikard

    #584317

    Hi Rikard,

    This works great, thank you!

    Marcel

    #584826

    Hi Rikard,

    I noticed that the change also did something to the small social icons in the top right menu, is it possible to exclude that?

    Marcel

    #585873

    Hey!

    Prepend the “.av-share-box-list” selector to the social share class above. Example:

    .av-share-box-list .av-social-link-facebook {
    background-color:blue !important;
    }

    Cheers!
    Ismael

    #585985

    Hi Ismael,

    Thank you very much, I sorted it out! :)

    Marcel

    • This reply was modified 8 years, 9 months ago by vossenm.
    #586843

    Hi Marcel,

    Great, glad you managed to work it out :-)

    Thanks,
    Rikard

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