You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

46 lines
1.4 KiB

import React from "react";
import ReactVideoJsPlayer from "./React-video-js-player/index";
import PlayCircleFilledRoundedIcon from "@material-ui/icons/PlayCircleFilledRounded";
import "./index.scss";
const maxMobileSize = 550;
const fontSize = {
mobile: {
h3: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 25,
},
desktop: {
h3: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 80,
},
};
export default function VideoBox(props) {
const { data } = props;
return (
<>
{window.innerWidth > 1000 ? (
<div className="d-flex flex-column">
<h3 style={{ fontSize: fontSize.desktop.h3 }}>
{/* <PlayCircleFilledRoundedIcon style={{ fontSize: 35 }} /> */}
{/* فیلمها */}
</h3>
<div className="video-box d-flex flex-column" id="video">
<ReactVideoJsPlayer fileId={data.fileIds} />
</div>
</div>
) : null}
{window.innerWidth < 1000 ? (
<div className="d-flex flex-column">
<h3 style={{ fontSize: fontSize.mobile.h3 }}>
<PlayCircleFilledRoundedIcon style={{ fontSize: 35 }} /> فیلمها
</h3>
<div className="mobile-video-box d-flex flex-column" id="video">
<ReactVideoJsPlayer fileId={data.fileIds} />
</div>
</div>
) : null}
</>
);
}