Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • May 27, 2013 at 1:45 pm #23889
    joe88

    Hello. 1) How do you change the icon background color of the of the image overlay for portfolio items? I see the tag “.image-overlay .image-overlay-inside:before”, but that doesn’t seem to work. Right now, its simply using the default accent color, which I would like to change.

    2) Also, is it possible to completely replace the image overlay icon with a standard icon image (png) from a URL? If so, can this be placed in the css file? Thanks!

    May 28, 2013 at 4:45 am #121502
    Ismael

    Hi,

    You can change the background using this 

    .main_color .image-overlay .image-overlay-inside::before {
    
background-color: red !important;
    
}

    Open css > base.css, find this code

    .image-overlay.overlay-type-extern .image-overlay-inside::before{content:"27A6";}
    
.image-overlay.overlay-type-video .image-overlay-inside::before{content:"25B6";}

    You can replace the icon used, refer to this link http://www.entypo.com/characters/. Lets try the phone icon (U+1F4DE). You can do something like this

    .image-overlay.overlay-type-extern .image-overlay-inside::before{content:"1F4DE";}
    
.image-overlay.overlay-type-video .image-overlay-inside::before{content:"1F4DE";}

    Remove browser cache then hard refresh the page.

    Cheers,

    Ismael

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • The topic ‘image overlay icon color’ is closed to new replies.