diff --git a/src/App.tsx b/src/App.tsx index f2bdd91..b7dfab1 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -2,7 +2,6 @@ import { Routes, Route } from "react-router-dom"; // Styles -import "react-image-crop/src/ReactCrop.scss"; import "./styles/style.scss"; // Pages diff --git a/src/components/video/Video.tsx b/src/components/video/Video.tsx index 250a08a..edbc17a 100644 --- a/src/components/video/Video.tsx +++ b/src/components/video/Video.tsx @@ -1,16 +1,37 @@ +// Modules +import { v4 as uuidv4 } from "uuid"; + // Components import VideoItem from "./VideoItem"; + +// Images +import VideoItemImg from "../../assets/images/video-item.jpg"; + const Video = () => { + const date = "11.01.2023"; + const title = "В Туркменистане отметили Новый год"; + const data = [ + { date, title, img: VideoItemImg }, + { date, title, img: VideoItemImg }, + { date, title, img: VideoItemImg }, + { date, title, img: VideoItemImg }, + ]; return (

Видео

- - - - + {data.map((dataItem: Record) => { + return ( + + ); + })}
diff --git a/src/components/video/VideoItem.tsx b/src/components/video/VideoItem.tsx index 14e23ba..4cf55fb 100644 --- a/src/components/video/VideoItem.tsx +++ b/src/components/video/VideoItem.tsx @@ -1,17 +1,17 @@ -// Images -import VideoItemImg from "../../assets/images/video-item.jpg"; +// Types +import { videoItemType } from "../../types/video.types"; -const VideoItem = () => { +const VideoItem = ({ img, date, title }: videoItemType) => { return (
- +
- 11.01.2023 -
В Туркменистане отметили Новый год
+ {date} +
{title}
); diff --git a/src/types/video.types.ts b/src/types/video.types.ts new file mode 100644 index 0000000..8594f7b --- /dev/null +++ b/src/types/video.types.ts @@ -0,0 +1,5 @@ +export interface videoItemType { + img: string; + date: string; + title: string; +}