cv button

Author: NevoMir

src/data/work.ts

@@ -6,7 +6,7 @@ export const WorkData = [
   {
     title: "Mechanical Engineer",
     company: "EPFL Rocket Team",
-    years: "2022 - 2023",
+    years: "2021 - 2024",
     // Use dark mode logo by default; light mode logo can be handled in the component
     logo: rocketTeamLightLogo,
     // alternative
@@ -21,7 +21,7 @@ export const WorkData = [
   {
     title: "Teaching Assistant",
     company: "École polytechnique fédérale de Lausanne",
-    years: "2022 - 2025",
+    years: "2022 - 2024",
     logo: epflLogo,
   },
 ];

src/pages/about/sections/introduction.tsx

@@ -1,6 +1,7 @@
 import { FaRegEnvelope } from "react-icons/fa6";
 import { toast } from "sonner";
 
+import { Button } from "@/components/ui/button";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { UserInfo } from "@/data/profile";
 
@@ -14,6 +15,15 @@ export default function Introduction() {
 }
 
 function Profile() {
+    const isResumeLink = (label: string) => {
+        const normalized = label.toLowerCase();
+        return (
+            normalized.includes("résumé") ||
+            normalized.includes("resume") ||
+            normalized.includes("cv")
+        );
+    };
+
     return (
         <div className="flex flex-col items-center gap-y-4 shrink-0">
             <img
@@ -27,27 +37,52 @@ function Profile() {
                 <EmailCopy email={UserInfo.email} />
                 <TooltipProvider delayDuration={100}>
                     <div className="flex flex-row flex-wrap justify-center gap-y-2 gap-x-4 py-2 text-foreground max-w-64">
-                        {UserInfo.links.map((item, index) => (
-                            <a
-                                key={index}
-                                href={item.url}
-                                target="_blank"
-                                rel="noopener noreferrer"
-                                className="shrink-0"
-                            >
-                                <Tooltip>
-                                    <TooltipTrigger>
-                                        <item.icon
-                                            className="w-8 h-8 cursor-pointer opacity-80 hover:opacity-100 transition-opacity duration-50"
-                                            aria-label={item.name}
-                                        />
+                        {UserInfo.links.map((item) =>
+                            isResumeLink(item.name) ? (
+                                <Tooltip key={item.name}>
+                                    <TooltipTrigger asChild>
+                                        <Button
+                                            asChild
+                                            size="sm"
+                                            className="rounded-full border-2 border-foreground/20 bg-foreground/65 px-2 text-background hover:bg-foreground/55 hover:text-background dark:border-foreground/40 dark:bg-foreground/85 dark:text-background dark:hover:bg-foreground"
+                                        >
+                                            <a
+                                                href={item.url}
+                                                target="_blank"
+                                                rel="noopener noreferrer"
+                                            >
+                                                <b className="font-['Roboto_Condensed',_Arial_Narrow,_Arial,_sans-serif] text-lg font-bold leading-none tracking-tight">
+                                                    CV
+                                                </b>
+                                            </a>
+                                        </Button>
                                     </TooltipTrigger>
                                     <TooltipContent side="bottom">
-                                        <p>{item.name}</p>
+                                        <p>Resumé</p>
                                     </TooltipContent>
                                 </Tooltip>
-                            </a>
-                        ))}
+                            ) : (
+                                <a
+                                    key={item.name}
+                                    href={item.url}
+                                    target="_blank"
+                                    rel="noopener noreferrer"
+                                    className="shrink-0"
+                                >
+                                    <Tooltip>
+                                        <TooltipTrigger>
+                                            <item.icon
+                                                className="w-8 h-8 cursor-pointer opacity-80 hover:opacity-100 transition-opacity duration-50"
+                                                aria-label={item.name}
+                                            />
+                                        </TooltipTrigger>
+                                        <TooltipContent side="bottom">
+                                            <p>{item.name}</p>
+                                        </TooltipContent>
+                                    </Tooltip>
+                                </a>
+                            )
+                        )}
                     </div>
                 </TooltipProvider>
             </div>
@@ -61,7 +96,7 @@ function Biography() {
             <div className="text-2xl font-semibold mb-2">About Me</div>
             {UserInfo.biography ? (
                 <div
-                    className="prose dark:prose-invert text-justify text-base/6"
+                    className="prose dark:prose-invert text-justify text-lg/7"
                     dangerouslySetInnerHTML={{ __html: UserInfo.biography }}
                     aria-label="User biography"
                 />

src/styles/index.css

@@ -1,3 +1,4 @@
+@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@700&display=swap");
 @import "tailwindcss";
 @import "tw-animate-css";
 
@@ -123,4 +124,4 @@
   body {
     @apply bg-background text-foreground;
   }
-}
+}