import React from 'react'
import Link from 'next/link'
import VideoModal from '../../components/ModalVideo'

// import blogs from '../../api/blogs'
import Image from 'next/image';
import blogSingleImg1 from "/public/images/blog/img-4.jpg";
const blogs = [
    {
        id: '3',
        blogSingleImg: blogSingleImg1,
        blClass: 'format-video',
    },
];
const VideoComponent
    = (props) => {
        return (
            <section style={{ backgroundColor: "#071520" }} className="wpo-blog-pg-section section-padding">
                <div className="container">
                    <div className="row">
                        <div className={`col-12`}>
                            <div className="wpo-blog-content">
                                {blogs.map((blog, bitem) => (
                                    <div className={`post  ${blog.blClass}`} key={bitem}>
                                        <div className="entry-media video-holder">
                                            <Image src={blog.blogSingleImg} alt="" />
                                            <VideoModal />
                                        </div>
                                    </div>
                                ))}
                            </div>
                        </div>
                    </div>
                </div>
            </section>

        )
    }

export default VideoComponent
