Development

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

.gitignore

@@ -1,3 +1,4 @@
 .dist
 .next
 node_modules
+.env.local

.node-version

@@ -0,0 +1 @@
+18

.nvmrc

@@ -0,0 +1 @@
+18

CNAME

@@ -1 +1 @@
-jeffreyepstein.me
+www.yashgupta.org

README.md

@@ -1,3 +1,11 @@
 # [**Portfolio**](https://www.yashgupta.org)
 
 click on 👆🏻portfolio to check live
+
+## Microsoft Clarity setup
+
+Add your Clarity project ID to an environment variable:
+
+`NEXT_PUBLIC_CLARITY_PROJECT_ID=your_project_id`
+
+Then restart your Next.js app.

components/Header.jsx

@@ -1,9 +1,14 @@
 import Link from "next/link";
 import { AiFillGithub, AiFillLinkedin } from "react-icons/ai";
-import { FaTwitter } from "react-icons/fa";
 import { CgMail } from "react-icons/cg";
 import { BsMedium } from "react-icons/bs";
 
+const XIcon = () => (
+  <svg viewBox="0 0 24 24" fill="currentColor" className="w-10 h-10 md:w-12 md:h-12" xmlns="http://www.w3.org/2000/svg">
+    <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24h-6.657l-5.207-6.807-5.974 6.807H2.882l7.432-8.496-8.168-10.653h6.89l4.713 6.231 5.579-6.231zm-1.161 17.52h1.833L7.084 4.126H5.117l12.966 15.644z"/>
+  </svg>
+);
+
 const SocialMedia = ({ socials }) => (
   <div className="flex justify-center items-center gap-4">
     <a
@@ -27,11 +32,11 @@ const SocialMedia = ({ socials }) => (
     <a
       className="transition-all text-icons dark:text-icons-dark rounded-[50px] p-[8px] md:hover:scale-[1.2] md:hover:text-[white] md:hover:bg-button md:dark:hover:bg-button-dark"
       href={socials.twitter}
-      title="Contact me on Twitter"
+      title="Contact me on X"
       target="_blank"
       rel="noopener noreferrer"
     >
-      <FaTwitter className="w-10 h-10 md:w-12 md:h-12" size="3rem" />
+      <XIcon />
     </a>
     <a
       className="transition-all text-icons dark:text-icons-dark rounded-[50px] p-[8px] md:hover:scale-[1.2] md:hover:text-[white] md:hover:bg-button md:dark:hover:bg-button-dark"
@@ -58,20 +63,20 @@ const Header = ({ header }) => {
   return (
     <header className="flex flex-row flex-auto justify-between py-8 px-4 sticky top-0 bg-bodyBgColor dark:bg-bodyBgColor-dark z-[21] ">
       <div className="flex flex-row content-center text-[1.5rem] md:text-[2.5rem] font-bold font-title">
-        <Link href="/#main">
+        <Link href="/#main" legacyBehavior>
           <a className="flex items-center">{header.userTag}</a>
         </Link>
       </div>
       <ul className="hidden lg:flex justify-center items-center gap-[2rem] mx-2">
         <li>
-          <Link href="/#about">
+          <Link href="/#about" legacyBehavior>
             <a className="text-[1.5rem] md:text-[2rem] leading-[32px] p-2 md:p-0 text-primary dark:text-primary-dark hover:text-button dark:hover:text-button-dark cursor-pointer transition-colors">
               About
             </a>
           </Link>
         </li>
         <li>
-          <Link href="/work">
+          <Link href="/work" legacyBehavior>
             <a className="text-[1.5rem] md:text-[2rem] leading-[32px] p-2 md:p-0 text-primary dark:text-primary-dark hover:text-button dark:hover:text-button-dark cursor-pointer transition-colors">
               Projects
             </a>

components/Hero.jsx

@@ -47,7 +47,7 @@ const Intro = ({intro}) => {
           >
             Resume
           </a>
-          <Link href={"work"} title="my projects and work experience">
+          <Link href={"work"} title="my projects and work experience" legacyBehavior>
             <a className="group mt-8 flex justify-center items-center h-[30px] md:h-[50px] w-[70px] md:w-[120px] bg-background1-dark dark:bg-background1 text-primary-dark dark:text-primary font-bold transition-all rounded-2xl">
               Works
               <span className="ml-2 animate-pulse hidden group-hover:inline" ><TbPlayerTrackNext/></span>

components/Layout.jsx

@@ -25,7 +25,7 @@ const Layout = ({ children, darkMode, onClick, header }) => {
       <footer
         className="text-accent-dark/40 text-xl w-full text-center absolute bottom-[20px]"
       >
-        © 2025 {header.name}. All Rights Reserved.
+        © 2026 {header.name}. All Rights Reserved.
       </footer>
       <ScrollToTop />
       <DarkModeButton darkMode={darkMode} onClick={onClick} />