From 87deec20673c3199c9749e15c4d07a62c0df1840 Mon Sep 17 00:00:00 2001 From: mahdi Date: Mon, 24 Jan 2022 16:27:02 +0330 Subject: [PATCH] course cha[ter component added --- src/App.js | 2 +- src/components/CourseChapter/index.js | 50 ++++++++++++++++++++++----- 2 files changed, 42 insertions(+), 10 deletions(-) diff --git a/src/App.js b/src/App.js index 8659291..519e23a 100644 --- a/src/App.js +++ b/src/App.js @@ -64,7 +64,7 @@ function App() { {/* */} {/* */} {/* */} - {/* */} + {/* */} {/* */} {/* */} diff --git a/src/components/CourseChapter/index.js b/src/components/CourseChapter/index.js index 43c858e..97ea0a4 100644 --- a/src/components/CourseChapter/index.js +++ b/src/components/CourseChapter/index.js @@ -1,10 +1,10 @@ import React from "react"; -const CourseChapter = () => { +const CourseChapter = ({ chapters }) => { return (
{/* top */} @@ -20,10 +20,40 @@ const CourseChapter = () => { {/* divider */}
{/* course title */} -
-

فصل اول: مباحث جوشش مواد مذاب در مرکز

-

2:30:13

-
+ {chapters.map((chapter, index) => ( +
+
+

{chapter.title}

+ {chapter.duration} +
+ {chapter.lessons.map((lesson, index) => ( +
+ {/* right div dot dot */} +
+ mahdi +
+ {/* left div content */} +
+ {/* top */} +
+
+

{lesson.title}

+ + {lesson.duration} + +
+
+ {/* bottom */} +
+ + {lesson.play} + +
+
+
+ ))} +
+ ))}
); @@ -34,9 +64,11 @@ export default CourseChapter; CourseChapter.defaultProps = { chapters: [ { - title: "", - duration: "", - lessons: [{ title: "", duration: "", play: "" }], + title: "فصل اول: مباحث جوشش مواد مذاب در مرکز", + duration: "2:30:13", + lessons: [ + { title: "آیا گوگل از ما دزدی میکند؟", duration: "14:30", play: "پخش" }, + ], }, ], };