New Landing How can we help? Cardinal Icon box hover color

Viewing 8 posts - 1 through 8 (of 8 total)
  • Posted in: Cardinal
  • #101642
    Brentnauer
    Member
    Post count: 65

    Hi there,

    How would I change the icon hover color for an icon box?

    #101844
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Hi

    Add this to your custom css:

    .sf-icon-box-standard .sf-icon-cont:hover {
      color: #999999;
    }

    – Kyle

    #102108
    Brentnauer
    Member
    Post count: 65

    Hi there,

    This doesn’t appear to be working for me.

    What I’m trying to do is override the “hover” color for icons in the icon box page builder elements. Using Firefox’s inspector, the color appears to be done inline and changes using JavaScript when your mouse is anywhere on the icon box, not just the icon:

    <div class=”sf-icon-box sf-icon-box-standard sf-animation sf-icon- sf-animate” data-animation=”none” data-delay=”0″ style=”background-color:#52433d;”>

    I need to change hover color individually per icon box.

    Thanks.

    #102214
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Please could I see your link?

    – Kyle

    #102320
    Brentnauer
    Member
    Post count: 65
    This reply has been marked as private.
    #102329
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    You would need to add an extra class to the icon boxes with a light background then add this:

    .your-class .sf-hover .sf-icon-cont, .sf-hover .sf-icon-box-hr {
      background-color: #52433d!important;
    }

    – Kyle

    #103601
    Brentnauer
    Member
    Post count: 65

    Thank you, this worked.

    #103636
    Swift Ideas – Ed
    Keymaster
    Post count: 15264

    Cheers Kyle, will close this.

    – Ed

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register