fix(frontend): Fix ratio of youtube frame

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2023-02-04 14:27:57 +01:00
parent 94c659558e
commit 9fb83409cc
2 changed files with 2 additions and 4 deletions

View file

@ -5,11 +5,10 @@ exports[`YoutubeFrame renders a click shield 1`] = `
<span> <span>
This is a click shield for This is a click shield for
<span <span
class="embed-responsive embed-responsive-16by9" class="ratio ratio-16x9 d-inline-block"
> >
<iframe <iframe
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
class="embed-responsive-item"
src="https://www.youtube-nocookie.com/embed/validYoutubeId?autoplay=1" src="https://www.youtube-nocookie.com/embed/validYoutubeId?autoplay=1"
title="youtube video of validYoutubeId" title="youtube video of validYoutubeId"
/> />

View file

@ -20,9 +20,8 @@ export const YouTubeFrame: React.FC<IdProps> = ({ id }) => {
fallbackPreviewImageUrl={`https://i.ytimg.com/vi/${id}/maxresdefault.jpg`} fallbackPreviewImageUrl={`https://i.ytimg.com/vi/${id}/maxresdefault.jpg`}
fallbackBackgroundColor={'#ff0000'} fallbackBackgroundColor={'#ff0000'}
data-cypress-id={'click-shield-youtube'}> data-cypress-id={'click-shield-youtube'}>
<span className={'embed-responsive embed-responsive-16by9'}> <span className={'ratio ratio-16x9 d-inline-block'}>
<iframe <iframe
className='embed-responsive-item'
title={`youtube video of ${id}`} title={`youtube video of ${id}`}
src={`https://www.youtube-nocookie.com/embed/${id}?autoplay=1`} src={`https://www.youtube-nocookie.com/embed/${id}?autoplay=1`}
allow='accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture' allow='accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture'