Okay
  Public Ticket #2631978
Portfolio Hover Adjustments
Closed

Comments

  •  4
    Casey started the conversation

    Hi there. Hope all is well. 

    I want my portfolio items' hover to do nothing - no words, no color overlay, and no image modification. 

    I have portfolio set to "Meta on hover + entire thumb link". I also have "Masonry Style" and "Lightbox Only" turned on in the Portfolio Settings. 

    I've added the below css to remove the words, but can not figure out what css to add to remove the hover color overlay

    .portfolio-items[data-ps="2"] .col .work-item:hover .work-info, .portfolio-items[data-ps="2"] .col .work-item:hover .work-info .vert-center > *, .portfolio-items[data-ps="1"] .col .work-item:hover .work-info, .portfolio-items[data-ps="1"] .col .work-item:hover .work-info .vert-center > *, .portfolio-items.carousel .col .work-item.style-2:hover .work-info, .portfolio-items.carousel .col .work-item.style-2:hover .work-info .vert-center > * {
        opacity: 0;
    }

    Thanks!!!

  •  8,849
    Tahir replied

    Hey Again,
    Please provide the page URL so I may write up the custom CSS for this request.
    Thanks


    ThemeNectar Support Team 

  •  4
  •  4
    Casey replied

    The more I'm playing with this the more I'm wondering if it's going to work. One other thing I realized is that with 3 column, I can't do zero padding between portfolio items, which is the default if you are set to fullwidth. But I think the 3 column works best for my purposes. So I guess one more CSS - if possible - is to do no padding in three column. I've got the below, which is kinda working, but maybe there's a cleaner CSS...

    body .portfolio-items[data-gutter="15px"][data-col-num="elastic"], body .portfolio-items[data-gutter="15px"] .col, body .portfolio-items[data-gutter="default"]:not([data-col-num="elastic"]) .col {

        padding: 0px;
    }


    Sorry for the disorganization of the way I'm asking these questions but Another question I have is that it seems that the portfolio item settings under Masonary Item Sizing aren't registering in the portfolio view - but perhaps I'm not understanding how that works - I'm assuming it's designed to effect how the featured image displays in the portfolio page element? Is that correct?

  •  8,849
    Tahir replied

    Hey Again,

    If the images aren't changing, try adjusting this option: 

    5541297066.pngClick To Open Larger Image.

    Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

    .portfolio-items[data-ps="2"] .col .work-item:hover .work-info-bg{
        background:transparent !important;
    }

    Thanks


    ThemeNectar Support Team