Hi. I'm new to squarespace and coding, so I've been following some tutorials online in order to make my ideas come true. Sadly, I was trying one code in specific to make summary carousel block's text appear in the middle and only when I pass over with my mouse, but the text keeps appearing anyways.
So I'd like to be able to change that, can someone help me change the code to fit into what I want?
This is the code I'm currently using:
#block-yui_3_17_2_1_1692693625663_8553 {
.summary-item {
position: relative;
img {
transition: all .5s ease!important;
}
.summary-content {
position: absolute;
color: #fff!important;
top: 50%;
left: 50%;
opacity: 0;
pointer-events: none;
transition: all .5s ease;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
}
.summary-thumbnail-container {
margin-bottom: 0!important;
}
.summary-title, .summary-metadata--primary, .summary-metadata--secondary, .summary-excerpt {
color: #fff!important;
}
}
.summary-item:hover {
img {
-webkit-filter: brightness(50%);
filter: brightness(50%);
}
.summary-content {
opacity: 0;
}
}
}
(password to view the website: sogetur)