Portfolio thumbnail display

Hi, I am using the Renew 1 theme and I am trying to manipulate the “recent works” thumbnails, specifically

-how to change the color of the green overlay during hover
-how to remove the “plus sign” symbol during hover
-how to remove the date under the title

Thanks!

Hi there,

Please add this code in the Global CSS:

.x-recent-posts a:hover .has-post-thumbnail .x-recent-posts-img:before,
.x-recent-posts .x-recent-posts-date {
    display: none;
}

.x-recent-posts a:hover .has-post-thumbnail .x-recent-posts-img:after {
    background-color: rgba(255, 0, 0, 0.4);;
}

If you want to use a different hover color, feel free to change the background color value in the code above.

Here are some reference links related to the suggestions above:

Hope this helps.

this worked great! thanks; is there code to make the overlay less opaque?

and also, if I wanted to get rid of the names of the posts as well

Hi There,

Thanks for writing in again!

Please change the opacity value that 0.4 in the given CSS to make it less opaque?

.x-recent-posts a:hover .has-post-thumbnail .x-recent-posts-img:after {
    background-color: rgba(255, 0, 0, 0.4);;
}

To hide the title please use this CSS.

.x-recent-posts .h-recent-posts {
display: none;
}

Thanks

this worked however when I take the cursor off hover it flashes back to the original opacity for a second

Hi There,

Please add this custom CSS as well.

.x-recent-posts .x-recent-posts-img:after {
	background-color: rgba(255, 0, 0, 0.4) !important;
}

You can find the proper CSS code selector using the Chrome browser Developer Toolbar
For the CSS code itself, I suggest that you get started with this tutorial

Please be reminded that this is now in the extent of customization, further customization from here would fall outside of the scope of support that we can offer.

Thank you for understanding,

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.