From b74b529b38ae70db5651f5657a7a88a6fb0a6382 Mon Sep 17 00:00:00 2001 From: mahdi andalib Date: Sun, 3 Apr 2022 13:37:12 +0430 Subject: [PATCH] update --- src/App.js | 10 +- .../TimeLineComponent/TimeLineItem.js | 42 +++-- src/components/TimeLineComponent/Timeline.js | 2 +- src/components/TimeLineComponent/data.js | 144 ++++++++++++++++++ 4 files changed, 183 insertions(+), 15 deletions(-) diff --git a/src/App.js b/src/App.js index 0e4626b..6fa91df 100644 --- a/src/App.js +++ b/src/App.js @@ -68,6 +68,7 @@ import TimeLineComponent from "./components/TimeLineComponent"; import TitleSubtitle from "./components/TitleSubtitle"; import TimeLine from "./components/TimeLineComponent/Timeline"; +import ProfilePicNextToEachOther from "./components/ProfilePicNextToEachOther"; // import Digikala from "./components/Digikala/ImageSlider"; @@ -96,7 +97,7 @@ function App() { {/* */} {/* */} {/* */} - {/* */} + {/* */} {/* */} @@ -123,7 +124,7 @@ function App() { */} - {/* */} + {/* */} {/* */} {/* */} @@ -136,12 +137,13 @@ function App() { {/* */} {/* */} {/* */} + {/* */} {/* */} {/* */} - {/* */} + - {/* */} + {/* */} diff --git a/src/components/TimeLineComponent/TimeLineItem.js b/src/components/TimeLineComponent/TimeLineItem.js index 2d37c22..c65ef95 100644 --- a/src/components/TimeLineComponent/TimeLineItem.js +++ b/src/components/TimeLineComponent/TimeLineItem.js @@ -7,7 +7,7 @@ const TimeLineItem = ({ data }) => ( >
{/* top --> time & date */}
@@ -28,15 +28,37 @@ const TimeLineItem = ({ data }) => ( {/* divider */}
{/* bottom --> users */} -
- {data.users.map((user, index) => ( -
-

- {user.name + " " + user.lname} -

- {"،"} -
- ))} +
+
+ {data.users.slice(0, 3).map((user, index) => ( +
+

+ {user.name + " " + user.lname} +

+ {Number(index) >= 2 ? ( +

و

+ ) : ( +

،

+ )} + {Number(index) === 2 && ( +

+ {data.users.length - 2}+ نفر دیگه +

+ )} +
+ ))} +
+ {/* profilePic */} +
+ {data.users.slice(0, 3).map((user, i) => ( + + ))} +
diff --git a/src/components/TimeLineComponent/Timeline.js b/src/components/TimeLineComponent/Timeline.js index 0ab9cb9..f12df0e 100644 --- a/src/components/TimeLineComponent/Timeline.js +++ b/src/components/TimeLineComponent/Timeline.js @@ -6,7 +6,7 @@ import TimeLineItem from "./TimeLineItem.js"; const TimeLine = () => timeLineData.length > 0 && (
- {timeLineData.slice(0, 3).map((data, idx) => ( + {timeLineData.slice(0, 6).map((data, idx) => ( ))}
diff --git a/src/components/TimeLineComponent/data.js b/src/components/TimeLineComponent/data.js index d9455c1..7c53f42 100644 --- a/src/components/TimeLineComponent/data.js +++ b/src/components/TimeLineComponent/data.js @@ -21,6 +21,150 @@ const data = [ lname: "قلی نژاد", profilePic: profilePic1, }, + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, + ], + }, + { + date: "1395/12/28", + time: " 12:30", + text: "انجام عملیات بازگردانی و ذخیره سازی2", + content: ` + جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت +پایان جنگ ایران و عراق هم ‌زمان با بروز تشنّج عراق و کویت بود. ارتش عراق در زمان حکومت صدام حسین و حزب بعث عراق در تاریخ ۱۱ مرداد ۱۳۶۹ (۱۹۹۰ م) به کویت حمله و این کشور را اشغال کرد. عراق با این حمله باعث بروز بحرانی بین‌المللی گردید + `, + users: [ + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + ], + }, + { + date: "1400/12/28", + time: " 14:30", + text: "انجام عملیات بازگردانی و ذخیره سازی", + content: ` + جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت +پایان جنگ ایران و عراق هم ‌زمان با بروز تشنّج عراق و کویت بود. ارتش عراق در زمان حکومت صدام حسین و حزب بعث عراق در تاریخ ۱۱ مرداد ۱۳۶۹ (۱۹۹۰ م) به کویت حمله و این کشور را اشغال کرد. عراق با این حمله باعث بروز بحرانی بین‌المللی گردید + `, + users: [ + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, + ], + }, + { + date: "1395/12/28", + time: " 12:30", + text: "انجام عملیات بازگردانی و ذخیره سازی2", + content: ` + جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت +پایان جنگ ایران و عراق هم ‌زمان با بروز تشنّج عراق و کویت بود. ارتش عراق در زمان حکومت صدام حسین و حزب بعث عراق در تاریخ ۱۱ مرداد ۱۳۶۹ (۱۹۹۰ م) به کویت حمله و این کشور را اشغال کرد. عراق با این حمله باعث بروز بحرانی بین‌المللی گردید + `, + users: [ + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + ], + }, + { + date: "1400/12/28", + time: " 14:30", + text: "انجام عملیات بازگردانی و ذخیره سازی", + content: ` + جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت +پایان جنگ ایران و عراق هم ‌زمان با بروز تشنّج عراق و کویت بود. ارتش عراق در زمان حکومت صدام حسین و حزب بعث عراق در تاریخ ۱۱ مرداد ۱۳۶۹ (۱۹۹۰ م) به کویت حمله و این کشور را اشغال کرد. عراق با این حمله باعث بروز بحرانی بین‌المللی گردید + `, + users: [ + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, + { + name: "علی", + lname: "علوی", + profilePic: profilePic2, + }, + { + name: "غلام", + lname: "قلی نژاد", + profilePic: profilePic1, + }, ], }, {