diff --git a/src/App.jsx b/src/App.jsx
index 9f96aaa..5c030a1 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -3,13 +3,14 @@ import React, { useEffect, useState, useSyncExternalStore } from "react";
 import Header from "./components/header/Header";
 import Footer from "./components/footer/Footer";
 import Hero from "./components/hero/Hero";
-import InfoSection from "./components/info/InfoSection";
 import Separator from "./components/separater/Separater";
 import Projects from "./components/projects/Projects";
 import AboutMe from "./components/aboutMe/AboutMe";
 import Publications from "./components/publications/Publications";
 import Contact from "./components/contact/Contact";
 
+import InfoSection from "./shared/components/info/InfoSection";
+
 import styles from "./App.module.css";
 
 function App() {
diff --git a/src/components/aboutMe/AboutMe.jsx b/src/components/aboutMe/AboutMe.jsx
index 605717e..b5d1536 100644
--- a/src/components/aboutMe/AboutMe.jsx
+++ b/src/components/aboutMe/AboutMe.jsx
@@ -2,6 +2,8 @@ import React from "react";
 import styles from "./AboutMe.module.css";
 import { FaGithub, FaLinkedin, FaTwitter } from "react-icons/fa";
 
+import ResumeDownloader from "../../shared/components/resumeDownloader/ResumeDownloader";
+
 function AboutMe({ data }) {
 	const scrollToContact = () => {
 		const contactSection = document.getElementById("contact");
@@ -64,9 +66,7 @@ function AboutMe({ data }) {
 					</div>
 				</div>
 				<div className={styles.bottomSection}>
-					<a href={personalInfo.resumelink} target="_blank" rel="noopener noreferrer" className={styles.resumeLink}>
-						Download Resume (PDF)
-					</a>
+					<ResumeDownloader resumeLink={personalInfo.resumelink} />
 					<button onClick={scrollToContact} className={styles.contactLink}>
 						Contact Me
 					</button>
diff --git a/src/components/footer/Footer.jsx b/src/components/footer/Footer.jsx
index ba5e7fb..3be2d1a 100644
--- a/src/components/footer/Footer.jsx
+++ b/src/components/footer/Footer.jsx
@@ -2,6 +2,8 @@ import React, { useEffect, useRef, useState } from "react";
 import styles from "./Footer.module.css";
 import logo from "/assets/logos/logo.png";
 
+import ResumeDownloader from "../../shared/components/resumeDownloader/ResumeDownloader";
+
 function Footer({ data }) {
 	const [isVisible, setIsVisible] = useState(false);
 	const footerRef = useRef(null);
@@ -57,9 +59,10 @@ function Footer({ data }) {
 					</div>
 				</div>
 				<div className={styles.bottomSection}>
-					<a href={personalInfo.resumelink} target="_blank" rel="noopener noreferrer" className={styles.resumeLink}>
+					{/* <a href={personalInfo.resumelink} target="_blank" rel="noopener noreferrer" className={styles.resumeLink}>
 						Download Resume (PDF)
-					</a>
+					</a> */}
+					<ResumeDownloader resumeLink={personalInfo.resumelink} />
 				</div>
 			</div>
 		</footer>
diff --git a/version.txt b/version.txt
index 12edb29..aac2dac 100644
--- a/version.txt
+++ b/version.txt
@@ -1 +1 @@
-0.11.7
\ No newline at end of file
+0.12.1
\ No newline at end of file