Hello, I’m using Dawn 15.4.1. I have a custom liquid where the video autoplays and there’s a CTA button. (www.beboldair.com) On desktop, it works great, on mobile, the video doesn’t autoplay and you can still see the shadow of the “play” button (gray circle) behind the CTA button.
@tim_1 you were a great help before–not sure if this is your wheelhouse?
This is the liquid code in the custom liquid I’m using:
:root{ --starlight:#27ffba; --navy:#003959; } .rr-cta{ pointer-events:auto; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:inline-block; background:var(--starlight); color:var(--navy); font-weight:700; border:3px solid var(--navy); border-radius:10px; text-decoration:none; z-index:3; white-space:nowrap; box-shadow:0 6px 16px rgba(0,0,0,.15); line-height:1.1; } /* Desktop-only: bigger text + more padding = long pill button */ @media (min-width: 750px){ .rr-cta{ font-size: clamp(2.4rem, 2.2vw + 1rem, 3.2rem) !important; word-spacing: 0.12em !important; letter-spacing: 0.02em !important; line-height: 1.15; padding: 1.4rem 4.5rem; /* more top/bottom + much longer sides */ min-width: 320px; /* force a nice long pill shape */ text-align: center; } } /* Mobile */ @media (max-width:749px){ .rr-cta{ font-size:1.5rem; letter-spacing:.02em; line-height:1.1; padding:.75rem 1.1rem; border-width:2px; } } /* Hide native play icon on Safari/Chrome mobile */ video::-webkit-media-controls-start-playback-button{display:none!important;-webkit-appearance:none;} video::-webkit-media-controls{display:none!important;}