Fixed Link error

Author: ajay-dhangar

src/components/Roadmap/index.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from "react";
 import "./Roadmap.css";
-
+import Link from "@docusaurus/Link";
 
 interface TechCategory {
   id: number;
@@ -280,13 +280,7 @@ const Roadmap: React.FC = () => {
     );
   };
 
-  const handleButtonClick = (link: string) => {
-    if(link === "https://roadmap.sh/react") {
-      window.open(link, "_blank");
-    }
-  }
-
-  const filteredCategories = techCategories
+ const filteredCategories = techCategories
     .map((category) => ({
       ...category,
       technologies: category.technologies.filter((tech) =>
@@ -319,12 +313,9 @@ const Roadmap: React.FC = () => {
             <ul className="roadmap-cards">
               {category.technologies.map((tech) => (
                 <li key={tech.id} className="roadmap-card">
-                  <a href={tech.link} onClick= {(e) => {
-                    e.preventDefault();
-                    handleButtonClick(tech.link); }}
-                    className="roadmap-link">
+                  <Link to={tech.link}>
                     {tech.name}
-                  </a>
+                  </Link>
                 </li>
               ))}
             </ul>

src/data/roadmaps/html.tsx

@@ -2,7 +2,7 @@ export const htmlRoadmapData = [
   {
     title: "HTML Basics",
     items: [
-      { text: "Introduction to HTML", link: "/docs/html/intro-HTML", status: "todo" },
+      { text: "Introduction to HTML", link: "/docs/html/intro-html/", status: "todo" },
       { text: "HTML Documents Structure", link: "#", status: "todo" },
       { text: "Basic HTML Tags", link: "#", status: "todo" },
       { text: "Attributes in HTML", link: "#", status: "todo" },