28 lines
755 B
TypeScript
28 lines
755 B
TypeScript
import loading from '../../../static/icons/loading.svg';
|
|
import play from '../../../static/icons/play-button.svg';
|
|
import { html } from '../../types/html';
|
|
import { ResponsiveImage } from '../../types/responsive-image';
|
|
import { Image } from '../image-viewer/image/image.html';
|
|
import './preview.scss';
|
|
|
|
export const generate = ({
|
|
alt,
|
|
poster,
|
|
}: {
|
|
alt: string;
|
|
poster: ResponsiveImage;
|
|
}): html => `
|
|
<div class="preview">
|
|
${Image({
|
|
image: poster,
|
|
alt,
|
|
container: true,
|
|
isIgnoredByImageViewer: true,
|
|
})}
|
|
<div class="overlay">
|
|
<div class="loading">${loading}</div>
|
|
<iframe title="${alt}" allowfullscreen loading="lazy"></iframe>
|
|
<div class="start-button">${play}</div>
|
|
</div>
|
|
</div>
|
|
`;
|