diff --git a/src/app/pages/about.tsx b/src/app/pages/about.tsx index a8289a7..cd81621 100644 --- a/src/app/pages/about.tsx +++ b/src/app/pages/about.tsx @@ -1,6 +1,9 @@ "use client"; +import Tooltip from "@/components/Tooltip"; +import Link from "next/link"; import React from "react"; +import { HiMiniBellAlert } from "react-icons/hi2"; const About = () => { return ( @@ -25,13 +28,45 @@ const About = () => { My technical expertise includes –{" "} JavaScript,{" "} TypeScript, and{" "} - React ecosystems, along with{" "} - backend technologies,{" "} - cloud deployment,{" "} - state management,{" "} - real-time communication, and{" "} - UI development and{" "} - testing. + {/* React ecosystems */} + + , along with{" "} + {/* backend technologies */} + + ,{/* cloud deployment */}{" "} + + ,{/* state management */}{" "} + + ,{/* real-time communication */}{" "} + + , and {/* UI development */} + {" "} + and {/* testing */} + .

Currently, I'm contributing my skills to{" "} @@ -45,6 +80,20 @@ const About = () => { innovation and excellence defines every project I undertake.

+
+ + + +
); }; diff --git a/src/app/pages/contact.tsx b/src/app/pages/contact.tsx index 4bb6f7f..d316fa0 100644 --- a/src/app/pages/contact.tsx +++ b/src/app/pages/contact.tsx @@ -33,7 +33,7 @@ const ContactForm = () => { contact me directly at lassiecoder@gmail.com diff --git a/src/components/Tooltip.tsx b/src/components/Tooltip.tsx new file mode 100644 index 0000000..f21af8f --- /dev/null +++ b/src/components/Tooltip.tsx @@ -0,0 +1,22 @@ +"use client"; + +import React from "react"; + +interface TooltipProps { + text: string; // The text to display + tooltipText: string; // The content of the tooltip + className?: string; // Optional className for styling the text +} + +const Tooltip: React.FC = ({ text, tooltipText, className }) => { + return ( + + {text} + + {tooltipText} + + + ); +}; + +export default Tooltip; diff --git a/src/components/footer.tsx b/src/components/footer.tsx index d1c83f1..ce166a4 100644 --- a/src/components/footer.tsx +++ b/src/components/footer.tsx @@ -1,9 +1,9 @@ import { FaMedium, FaSquareXTwitter } from "react-icons/fa6"; +import { IoNewspaperOutline } from "react-icons/io5"; + import { FaGithub, FaLinkedinIn, - FaTwitter, - FaDev, FaInstagram, FaMailBulk } from "react-icons/fa"; @@ -12,52 +12,80 @@ import Link from "next/link"; export default function Footer() { return (
- - {/* */} - - - - - - - - - - - - - - - - - - - - +
+ + {/* */} + + + GitHub + + +
+ +
+ + + + LinkedIn + + +
+ +
+ + + + Newsletter + + +
+ +
+ + + + Twitter + + +
+ +
+ + + + Instagram + + +
+ +
+ + + + Mail + + +
); }