update

src/components/TimeLineComponent/TimeLineItem.js

@@ -10,10 +10,15 @@ const TimeLineItem = ({ data }) => (
       style={{ maxWidth: "100%", width: "400px" }}
     >
       {/* top --> time & date */}
-      <div className="flex flex-row-reverse p-3 self-end">
-        <time className="text-xs text-[#0A7C9F]">{data.date}</time>
-        <span className="text-xs text-[#0A7C9F]">-</span>
-        <time className="text-xs text-[#0A7C9F] ml-1">{data.time}</time>
+      <div className="flex flex-row items-center justify-between w-full  p-3">
+        {data.active && (
+          <div className="bg-blue-500 border-4 border-[#D4E6FF99] w-4 h-4 rounded-full"></div>
+        )}
+        <div className="flex flex-row-reverse">
+          <time className="text-xs text-[#0A7C9F]">{data.date}</time>
+          <span className="text-xs text-[#0A7C9F]">-</span>
+          <time className="text-xs text-[#0A7C9F] ml-1">{data.time}</time>
+        </div>
       </div>
       {/* middle --> title & content */}
       <div className="bg-[#F3F3F3] w-full px-4 py-2 flex flex-row items-center">
@@ -30,6 +35,7 @@ const TimeLineItem = ({ data }) => (
       {/* bottom --> users */}
       <div className="flex flex-row justify-between px-4 py-2 w-full">
         <div className="flex flex-row items-center">
+          <div className="bg-[#EDF2FB] w-1 h-5 rounded"></div>
           {data.users.slice(0, 3).map((user, index) => (
             <div key={index} className="flex flex-row items-center">
               <p className="mr-1 text-xs text-[#00253A]">

src/components/TimeLineComponent/data.js

@@ -6,6 +6,7 @@ const data = [
     date: "1400/12/28",
     time: " 14:30",
     text: "انجام عملیات بازگردانی و ذخیره سازی",
+    active: true,
     content: `
     جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت
 پایان جنگ ایران و عراق هم ‌زمان با بروز تشنّج عراق و کویت بود. ارتش عراق در زمان حکومت صدام حسین و حزب بعث عراق در تاریخ ۱۱ مرداد ۱۳۶۹ (۱۹۹۰ م) به کویت حمله و این کشور را اشغال کرد. عراق با این حمله باعث بروز بحرانی بین‌المللی گردید 
@@ -47,6 +48,7 @@ const data = [
     date: "1395/12/28",
     time: " 12:30",
     text: "انجام عملیات بازگردانی و ذخیره سازی2",
+    active: false,
     content: `
     جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت
 پایان جنگ ایران و عراق هم ‌زمان با بروز تشنّج عراق و کویت بود. ارتش عراق در زمان حکومت صدام حسین و حزب بعث عراق در تاریخ ۱۱ مرداد ۱۳۶۹ (۱۹۹۰ م) به کویت حمله و این کشور را اشغال کرد. عراق با این حمله باعث بروز بحرانی بین‌المللی گردید 
@@ -78,48 +80,7 @@ const data = [
     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: "انجام عملیات بازگردانی و ذخیره سازی",
+    active: true,
     content: `
     جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت
 پایان جنگ ایران و عراق هم ‌زمان با بروز تشنّج عراق و کویت بود. ارتش عراق در زمان حکومت صدام حسین و حزب بعث عراق در تاریخ ۱۱ مرداد ۱۳۶۹ (۱۹۹۰ م) به کویت حمله و این کشور را اشغال کرد. عراق با این حمله باعث بروز بحرانی بین‌المللی گردید 
@@ -155,22 +116,13 @@ const data = [
         lname: "قلی نژاد",
         profilePic: profilePic1,
       },
-      {
-        name: "علی",
-        lname: "علوی",
-        profilePic: profilePic2,
-      },
-      {
-        name: "غلام",
-        lname: "قلی نژاد",
-        profilePic: profilePic1,
-      },
     ],
   },
   {
     date: "1395/12/28",
     time: " 12:30",
     text: "انجام عملیات بازگردانی و ذخیره سازی2",
+    active: false,
     content: `
     جنگ اول خلیج فارس، جنگی به رهبری آمریکا و با همکاری ائتلافی از ۳۵ کشور مختلف بود که علیه عراق بعثی در واکنش به اشغال کویت توسط عراق انجام گرفت
 پایان جنگ ایران و عراق هم ‌زمان با بروز تشنّج عراق و کویت بود. ارتش عراق در زمان حکومت صدام حسین و حزب بعث عراق در تاریخ ۱۱ مرداد ۱۳۶۹ (۱۹۹۰ م) به کویت حمله و این کشور را اشغال کرد. عراق با این حمله باعث بروز بحرانی بین‌المللی گردید 
@@ -186,38 +138,6 @@ const data = [
         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: "قلی نژاد",