Add CustomTooltip component to the sistent components page

src/components/SistentNavigation/content.js

@@ -103,4 +103,19 @@ export const content = [
     link: "/projects/sistent/components/button-group/code",
     text: "Button Group",
   },
+  {
+    id: 27,
+    link: "/projects/sistent/components/tooltip",
+    text: "Tooltip",
+  },
+  {
+    id: 25,
+    link: "/projects/sistent/components/tooltip/guidance",
+    text: "Tooltip",
+  },
+  {
+    id: 26,
+    link: "/projects/sistent/components/tooltip/code",
+    text: "Tooltip",
+  },
 ];

src/pages/projects/sistent/components/tooltip/code.js

@@ -0,0 +1,8 @@
+import React from "react";
+import TooltipCode from "../../../../../sections/Projects/Sistent/components/tooltip/code";
+
+const TooltipCodePage = () => {
+  return <TooltipCode />;
+};
+
+export default TooltipCodePage;

src/pages/projects/sistent/components/tooltip/guidance.js

@@ -0,0 +1,8 @@
+import React from "react";
+import TooltipGuidance  from "../../../../../sections/Projects/Sistent/components/tooltip/guidance";
+
+const TooltipGuidancePage = () => {
+  return <TooltipGuidance />;
+};
+
+export default TooltipGuidancePage;

src/pages/projects/sistent/components/tooltip/index.js

@@ -0,0 +1,8 @@
+import React from "react";
+import SistentTooltip from "../../../../../sections/Projects/Sistent/components/tooltip";
+
+const SistentTooltipPage = () => {
+  return <SistentTooltip />;
+};
+
+export default SistentTooltipPage;

src/sections/Projects/Sistent/components/index.js

@@ -79,6 +79,13 @@ const componentsData = [
       "Box is used as a flexible container for layout and styling, allowing quick customization and responsive design adjustments.",
     url: "/projects/sistent/components/box",
   },
+  {
+    id: 11,
+    name: "Tooltip",
+    description:
+      "The Tooltip component is a small pop-up box that appears when a user hovers over an element.",
+    url: "/projects/sistent/components/tooltip",
+  },
 ];
 
 const SistentComponents = () => {