update App.js

src/App.js

@@ -72,6 +72,7 @@ import ProfilePicNextToEachOther from "./components/ProfilePicNextToEachOther";
 import SelectYear from "./components/SelectYear";
 import IndianaDragScroll from "./components/IndianaDragScroll";
 import TestComponentNew from "./components/TestComponentNew";
+import CardTrelloDesign from "./components/CardTrelloDesign";
 
 // import Digikala from "./components/Digikala/ImageSlider";
 
@@ -147,11 +148,12 @@ function App() {
         {/* <GridListTable /> */}
         {/* <PopupCard /> */}
         {/* <TimeLine /> */}
-        <TimeLineComponent />
+        {/* <TimeLineComponent /> */}
         {/* <SelectYear /> */}
         {/* <IndianaDragScroll /> */}
         {/* <SidebarDesign2 className="w-1/5" /> */}
         {/* <TestComponentNew /> */}
+        <CardTrelloDesign />
       </div>
     </Provider>
   );

src/components/CardTrelloDesign/index.js

@@ -0,0 +1,19 @@
+import React from "react";
+
+const CardTrelloDesign = () => {
+  return (
+    <div className="w-96 mx-auto bg-white mt-10 rounded shadow">
+      {/* top */}
+      <div className="flex flex-row">
+        {/* right */}
+        <div className="bg-[#FF000044] w-7 h-7 rounded-full relative">
+          <div className="bg-[#FF0000] w-3 h-3 rounded-full absolute left-1/2 bottom-1/2 transform -translate-x-1/2 translate-y-1/2"></div>
+        </div>
+        {/* left */}
+        <div></div>
+      </div>
+    </div>
+  );
+};
+
+export default CardTrelloDesign;