working on side menu

components/Collaps/Collaps.tsx

@@ -0,0 +1,19 @@
+import React from "react";
+import { CollapsElement } from "./CollapsElement";
+import { dataList,ICollapsProps } from "../../types";
+
+export const Collaps = ({elements,title}:ICollapsProps) => {
+  return (
+    <div tabIndex={0} className="collapse collapse-arrow border-b border-base-100">
+      <div className="collapse-title text-[17px] font-medium">
+        {title}
+      </div>
+      <div className="collapse-content flex flex-col gap-3">
+        {
+        elements.map((element:dataList, i:number) => (
+          <CollapsElement name={element.name} description={element.description} url={element.url} />
+        ))}
+      </div>
+    </div>
+  );
+};

components/Collaps/CollapsElement.tsx

@@ -0,0 +1,14 @@
+import React from "react"
+import {dataList} from "../../types"
+export const CollapsElement = ({name,description,url}:dataList) => {
+  return (
+    <a href={url}>
+      <div className="border-b-2 border-base-200 py-2 cursor-pointer">
+        <h4 className="text-violet-500 font-semibold text-[17px]">{name}</h4>
+        <p>
+        {description}
+        </p>
+      </div>
+    </a>
+  )
+}

components/Collaps/index.ts

@@ -0,0 +1,2 @@
+export * from './Collaps';
+export * from './CollapsElement';