Okay
  Public Ticket #1153221
Gallery color overlay
Closed

Comments

  • Suzanne started the conversation
    April 29, 2017 at 5:43pm

    Can you provide css for removing the darker color overlay and the meta information on hover for a gallery?

  •  3,069
    Andrew replied
    May 2, 2017 at 8:02am

    Hi Suzanne,

    Thank you for reaching out to us.

    To remove the darker color that overlays the image, please use the following code:

    /*remove overlay in gallery*/
.work-info {
    background: rgba(0, 0, 0, 0);
}

    However, unfortunately, I'm not seeing any more meta info when the image is hovered, could this means that you have fixed it?

    Looking forward to your reply.

    Best regards.

  • Suzanne replied
    May 2, 2017 at 10:32pm

    Thanks so much, however I am trying to inverse the color overlay, and have it on the overlay pre-hover, and make it disappear upon hover. If I put in that code, it will override my code to add color overlay pre-hover.

    I attempted adding this, but it is not working.

    .work-info a:hover {    
        background: rgba(0, 0, 0, 0) !important;
    }

    Also, maybe I called the meta-info the wrong thing. It is the title I am looking to remove upon hover. Screenshot attached.



  •  3,069
    Andrew replied
    May 3, 2017 at 7:12am

    Hi again Suzanne,

    Thank you for writing back to us.

    Sorry for the misunderstanding. In that case, please replace the former code I gave you with this one:

    /*remove hover overlay*/
.portfolio-items[data-ps="8"] .col[data-default-color="true"] .work-item:not(.style-3) .work-info-bg{
    background: transparent !important;
}
.portfolio-items .col[data-default-color="true"] .work-item:not(.style-3) .work-info-bg{
    background-color: transparent !important;
}
.portfolio-items[data-ps="8"] .work-info:hover {
    opacity: 0 !important;
}

    Hope this solves the problem. Looking forward to hear how it goes.

    Best regards.

  • Suzanne replied
    May 3, 2017 at 11:50am

    PERFECT! Thank you so much.