I tried that but still not getting a hover over. Below is my code and my website link is https://dodecahedron-coral-95nw.squarespace.com/
@tuanphan if you see something wrong with what I'm doing, let me know 🙂
// Masonry Hover Over Animation //
.gallery-masonry--layout-masonry .gallery-masonry-item {
position: relative;
overflow: hidden;
&:hover {
.gallery-caption {
opacity: 1;
}
.gallery-caption .gallery-caption-wrapper {
transform: translateY(0);
}
}
.gallery-caption {
position: absolute;
top: 20;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(255,255,255,0.9);
display: flex;
align-items: center;
opacity: 0;
transition: opacity ease-in-out 0.25s;
.gallery-caption-wrapper {
height: auto;
padding: 14px 20px;
text-align: center;
transform: translateY(10vh);
transition: transform ease-in-out 0.25s;
}
}
}