From 05a5994067ed3fa5a03baa2c53fea07ce6fb9379 Mon Sep 17 00:00:00 2001
From: yousifpa98 <yousif.paulus@dci-student.org>
Date: Fri, 20 Dec 2024 03:21:40 +0100
Subject: [PATCH] added dl cv link (no cv yet) in nav

---
 src/assets/icons/navIcons/download.svg | 1 +
 src/components/Navigation.jsx          | 8 +++++++-
 2 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 src/assets/icons/navIcons/download.svg

diff --git a/src/assets/icons/navIcons/download.svg b/src/assets/icons/navIcons/download.svg
new file mode 100644
index 0000000..70593d8
--- /dev/null
+++ b/src/assets/icons/navIcons/download.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc. --><path d="M288 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 242.7-73.4-73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l128 128c12.5 12.5 32.8 12.5 45.3 0l128-128c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L288 274.7 288 32zM64 352c-35.3 0-64 28.7-64 64l0 32c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-32c0-35.3-28.7-64-64-64l-101.5 0-45.3 45.3c-25 25-65.5 25-90.5 0L165.5 352 64 352zm368 56a24 24 0 1 1 0 48 24 24 0 1 1 0-48z"/></svg>
\ No newline at end of file
diff --git a/src/components/Navigation.jsx b/src/components/Navigation.jsx
index 09820d7..fd8800d 100644
--- a/src/components/Navigation.jsx
+++ b/src/components/Navigation.jsx
@@ -6,6 +6,7 @@ import CodeIcon from "../assets/icons/navIcons/code.svg?react";
 import EnvelopeIcon from "../assets/icons/navIcons/envelope.svg?react";
 import HouseIcon from "../assets/icons/navIcons/house.svg?react";
 import SuitcaseIcon from "../assets/icons/navIcons/suitcase.svg?react";
+import DownloadIcon from "../assets/icons/navIcons/download.svg?react";
 import { NavLink } from "react-router-dom";
 import clsx from "clsx";
 
@@ -18,6 +19,7 @@ const Navigation = ({ initialAnimation, onMouseEnter, onAnimationEnd }) => {
     { name: "Experience", to: "/workExp", icon: SuitcaseIcon, id: 3 },
     { name: "Projects", to: "/projects", icon: CodeIcon, id: 4 },
     { name: "Contact", to: "/contact", icon: EnvelopeIcon, id: 5 },
+    { name: "CV", to: "", icon: DownloadIcon, id: 6 },
   ];
   return (
     <div
@@ -33,7 +35,11 @@ const Navigation = ({ initialAnimation, onMouseEnter, onAnimationEnd }) => {
               <NavLink
                 to={item.to}
                 className={({ isActive }) =>
-                  clsx("navLink", { active: isActive })
+                  clsx(
+                    "navLink",
+                    { active: isActive },
+                    item.name === "CV" && "cv" // Add "cv" class if item.name is "CV"
+                  )
                 }
               >
                 <span>{item.name}</span> <IconComponent className="navIcon" />