Title not appearing on mobile video grid gallery

Site URL: https://tuatara-mandarin-t25h.squarespace.com

I am pretty happy with how my desktop site is looking, but the mobile isn't working well for the gallery grid. On the desktop, I am able to hover and see the title text, but on mobile, it just shows a play button with no title or description anywhere. Id like to have the title on the video (so people know what they are clicking on) or below the video.  I think I'm using the gallery block grid on the previous version of squarespace. And I did add custom video thumbnails to each video

Any help would be greatly appreciated!

tuatara-mandarin-t25h.squarespace.com

Password:12345

This worked! Wow thank you so so much!!!!

Hi tuanphan. Hi I am having the same problem as Chazzzzer, but contrary to him, this does not seem to work, though I pasted the code there : Add to Design > Custom CSS. Any idea what may go wrong here ? What I would like is that on the mobile version the title of the video appears when one puts the finger on the image. Like in this site here : https://edmoorebsc.com/featured Thanks a lot in advance.

On 4/9/2022 at 4:13 AM, jmselva said:

Hi tuanphan. Hi I am having the same problem as Chazzzzer, but contrary to him, this does not seem to work, though I pasted the code there : Add to Design > Custom CSS. Any idea what may go wrong here ? What I would like is that on the mobile version the title of the video appears when one puts the finger on the image. Like in this site here : https://edmoorebsc.com/featured Thanks a lot in advance.

Use this new code

@media screen and (max-width:900px) {
.project-cover .details-wrap {
    opacity: 1 !important;
}
}

On 4/10/2022 at 5:35 AM, tuanphan said:

Use this new code

@media screen and (max-width:900px) {
.project-cover .details-wrap {
    opacity: 1 !important;
}
}

 

Hi tuanphan. Thank you so much for trying to help. But sadly, it still does not work... I pasted the code in the CSS window, saved and reloaded the site, but it still does not work. On the laptop, when I check the site in mobile phone mode, the titles of the videos do appear, but on the actual cell phone, they do not appear as I put my finger on the windows. Any other idea ? Thanks a lot !!! JM 🙂

13 hours ago, jmselva said:

Hi tuanphan. Thank you so much for trying to help. But sadly, it still does not work... I pasted the code in the CSS window, saved and reloaded the site, but it still does not work. On the laptop, when I check the site in mobile phone mode, the titles of the videos do appear, but on the actual cell phone, they do not appear as I put my finger on the windows. Any other idea ? Thanks a lot !!! JM 🙂

Can you add & Keep the code? We will check it again easier

Hi Tuanphan. I added and kept the code in. It still does not work. Any idea ? Thanks in advance. JM

On 5/17/2022 at 3:28 AM, jmselva said:

Hi Tuanphan. I added and kept the code in. It still does not work. Any idea ? Thanks in advance. JM

Try this new code

@media only screen and (max-width:640px) {
.project-cover .details-wrap {
    opacity: 1 !important;
}
}

On 5/20/2022 at 4:31 AM, tuanphan said:

Try this new code

@media only screen and (max-width:640px) {
.project-cover .details-wrap {
    opacity: 1 !important;
}
}

 

Just did tuanphan. Still no luck... Was I supposed to replace the code you gave me before or add this one to it ? I replaced it and it does work for now. Thanks again.

On 5/26/2022 at 12:01 AM, jmselva said:

Just did tuanphan. Still no luck... Was I supposed to replace the code you gave me before or add this one to it ? I replaced it and it does work for now. Thanks again.

Can you keep the code? I will try testing again on real device