94 lines
4.6 KiB
JavaScript
94 lines
4.6 KiB
JavaScript
import React from 'react'
|
|
|
|
const Video = () => {
|
|
return (
|
|
<div>
|
|
{/* Page Wrapper */}
|
|
<div className="page-wrapper">
|
|
<div className="content">
|
|
<div className="page-header">
|
|
<div className="page-title">
|
|
<h4>Video</h4>
|
|
</div>
|
|
</div>
|
|
<div className="row">
|
|
{/* Responsive embed video 21:9 */}
|
|
<div className="col-lg-6">
|
|
<div className="card">
|
|
<div className="card-header justify-content-between">
|
|
<h5 className="card-title">Responsive embed video 21:9</h5>
|
|
<p className="sub-header">
|
|
Use class <code>.ratio-21x9</code>
|
|
</p>
|
|
</div>
|
|
<div className="card-body">
|
|
<div className="ratio ratio-21x9">
|
|
<iframe src="https://www.youtube.com/embed/6bzTrChjEdc?autohide=0&showinfo=0&controls=0" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/* /Responsive embed video 21:9 */}
|
|
{/* Responsive embed video 16:9 */}
|
|
<div className="col-lg-6">
|
|
<div className="card">
|
|
<div className="card-header justify-content-between">
|
|
<h5 className="card-title">Responsive embed video 16:9</h5>
|
|
<p className="sub-header">
|
|
Use class <code>.ratio-16x9</code>
|
|
</p>
|
|
</div>
|
|
<div className="card-body">
|
|
<div className="ratio ratio-16x9">
|
|
<iframe src="https://www.youtube.com/embed/6bzTrChjEdc?ecver=1" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/* /Responsive embed video 16:9 */}
|
|
</div>
|
|
<div className="row">
|
|
{/* Responsive embed video 4:3 */}
|
|
<div className="col-lg-6">
|
|
<div className="card">
|
|
<div className="card-header justify-content-between">
|
|
<h5 className="card-title">Responsive embed video 4:3</h5>
|
|
<p className="sub-header">
|
|
Use class <code>.ratio-4x3</code>
|
|
</p>
|
|
</div>
|
|
<div className="card-body">
|
|
<div className="ratio ratio-4x3">
|
|
<iframe src="https://www.youtube.com/embed/6bzTrChjEdc?ecver=1" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/* /Responsive embed video 4:3 */}
|
|
{/* Responsive embed video 1:1 */}
|
|
<div className="col-lg-6">
|
|
<div className="card">
|
|
<div className="card-header justify-content-between">
|
|
<h5 className="card-title">Responsive embed video 1:1</h5>
|
|
<p className="sub-header">
|
|
Use class <code>.ratio-1x1</code>
|
|
</p>
|
|
</div>
|
|
<div className="card-body">
|
|
<div className="ratio ratio-1x1">
|
|
<iframe src="https://www.youtube.com/embed/6bzTrChjEdc?ecver=1" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/* /Responsive embed video 1:1 */}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/* /Page Wrapper */}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Video
|