mirror of
https://github.com/Unleash/unleash.git
synced 2025-02-23 00:22:19 +01:00
docs: add video content component (to be moved)
This commit is contained in:
parent
c373db40bb
commit
1a399fcabc
42
website/docs/how-to/VideoThing.jsx
Normal file
42
website/docs/how-to/VideoThing.jsx
Normal file
@ -0,0 +1,42 @@
|
||||
import React from 'react';
|
||||
import Admonition from '@theme/Admonition';
|
||||
|
||||
const Component = ({ videoUrls, children }) => {
|
||||
return (
|
||||
<article className="unleash-video-wrapper">
|
||||
<div className="unleash-video-container">
|
||||
<Admonition type="tip" title="Video content">
|
||||
{children}
|
||||
Hey! Did you know that the content in this guide is also
|
||||
available in video format? If that's more your speed, feel
|
||||
free to check out one of these related videos 🍿📽
|
||||
</Admonition>
|
||||
|
||||
<div className="videos">
|
||||
{videoUrls ? (
|
||||
videoUrls.map((url) => (
|
||||
<div className="video-wrapper">
|
||||
<iframe
|
||||
key={url}
|
||||
width="100%"
|
||||
height="auto"
|
||||
src={url}
|
||||
title="YouTube video player"
|
||||
frameBorder="0"
|
||||
allowFullScreen
|
||||
></iframe>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<Admonition type="danger">
|
||||
You need to provide YouTube video URLs for this
|
||||
component to work properly.
|
||||
</Admonition>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
);
|
||||
};
|
||||
|
||||
export default Component;
|
Loading…
Reference in New Issue
Block a user