ConceptPortal-public/rsconcept/frontend/src/components/Common/EmbedYoutube.tsx
2023-09-03 18:26:50 +03:00

31 lines
847 B
TypeScript

interface EmbedYoutubeProps {
videoID: string
pxHeight: number
pxWidth?: number
}
function EmbedYoutube({ videoID, pxHeight, pxWidth }: EmbedYoutubeProps) {
if (!pxWidth) {
pxWidth = pxHeight * 16 / 9;
}
return (
<div
className='relative'
style={{height: 0, paddingBottom: `${pxHeight}px`, paddingLeft: `${pxWidth}px`}}
>
<iframe
className='absolute top-0 left-0 border'
style={{minHeight: `${pxHeight}px`, minWidth: `${pxWidth}px`}}
width={`${pxWidth}px`}
height={`${pxHeight}px`}
src={`https://www.youtube.com/embed/${videoID}`}
allow='accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture'
allowFullScreen
title='Встроенное видео Youtube'
/>
</div>
);
}
export default EmbedYoutube;