From 0da65f689ac65a9f1d9fb72238ecee1b25b94e58 Mon Sep 17 00:00:00 2001
From: Kai Chen <kaichen0728@gmail.com>
Date: Mon, 13 Jul 2026 11:17:06 -0700
Subject: [PATCH 1/2] feat: add X (Twitter) social link to home page

Added https://x.com/kaichen37 social link positioned between GitHub and LinkedIn with proper styling for light and dark modes.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
Co-authored-by: Claude <noreply@anthropic.com>
---
 app/components/home-social-links.tsx | 14 +++++++++++++-
 app/globals.css                      |  2 ++
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/app/components/home-social-links.tsx b/app/components/home-social-links.tsx
index 8498561..544e7dc 100644
--- a/app/components/home-social-links.tsx
+++ b/app/components/home-social-links.tsx
@@ -3,7 +3,7 @@
 import type { ReactNode } from "react";
 import HoverTip from "./hover-tip";
 
-type SocialBrand = "email" | "github" | "linkedin" | "spotify";
+type SocialBrand = "email" | "github" | "x" | "linkedin" | "spotify";
 
 const SOCIAL_LINKS: Array<{
   href: string;
@@ -39,6 +39,18 @@ const SOCIAL_LINKS: Array<{
       </svg>
     ),
   },
+  {
+    href: "https://x.com/kaichen37",
+    label: "X",
+    ariaLabel: "X (Twitter)",
+    brand: "x",
+    external: true,
+    icon: (
+      <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden>
+        <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24h-6.6l-5.165-6.75-5.868 6.75h-3.308l7.732-8.835L2.4 2.25h6.6l4.678 6.188L18.244 2.25zM17.55 19.5h1.833L6.457 3.75H4.55l13 15.75z" />
+      </svg>
+    ),
+  },
   {
     href: "https://linkedin.com/in/kaiiiichen",
     label: "LinkedIn",
diff --git a/app/globals.css b/app/globals.css
index f754395..56d651d 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -458,10 +458,12 @@ button.mag-chip:disabled {
 }
 .home-social-link--email:hover,
 .home-social-link--github:hover,
+.home-social-link--x:hover,
 .home-social-link--linkedin:hover,
 .home-social-link--spotify:hover { color: #000000; } /* zinc-950 — 深灰 */
 .dark .home-social-link--email:hover,
 .dark .home-social-link--github:hover,
+.dark .home-social-link--x:hover,
 .dark .home-social-link--linkedin:hover,
 .dark .home-social-link--spotify:hover { color: #ffffff; } /* zinc-50 — 近白 */
 .home-social-link svg {

From f0fbe74c10623c59c48cb22f809ad6c810334a2c Mon Sep 17 00:00:00 2001
From: Kai Chen <kaichen0728@gmail.com>
Date: Mon, 13 Jul 2026 11:23:31 -0700
Subject: [PATCH 2/2] fix: use official X logo mark and reorder social links

Replace the approximated X (Twitter) SVG path with the official brand
mark, and reorder home social links to Email, GitHub, LinkedIn, X,
Spotify so professional profiles come first.

Co-authored-by: Claude <noreply@anthropic.com>
---
 app/components/home-social-links.tsx | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/app/components/home-social-links.tsx b/app/components/home-social-links.tsx
index 544e7dc..ffc590a 100644
--- a/app/components/home-social-links.tsx
+++ b/app/components/home-social-links.tsx
@@ -40,26 +40,26 @@ const SOCIAL_LINKS: Array<{
     ),
   },
   {
-    href: "https://x.com/kaichen37",
-    label: "X",
-    ariaLabel: "X (Twitter)",
-    brand: "x",
+    href: "https://linkedin.com/in/kaiiiichen",
+    label: "LinkedIn",
+    ariaLabel: "LinkedIn",
+    brand: "linkedin",
     external: true,
     icon: (
       <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden>
-        <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24h-6.6l-5.165-6.75-5.868 6.75h-3.308l7.732-8.835L2.4 2.25h6.6l4.678 6.188L18.244 2.25zM17.55 19.5h1.833L6.457 3.75H4.55l13 15.75z" />
+        <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.064 2.064 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" />
       </svg>
     ),
   },
   {
-    href: "https://linkedin.com/in/kaiiiichen",
-    label: "LinkedIn",
-    ariaLabel: "LinkedIn",
-    brand: "linkedin",
+    href: "https://x.com/kaichen37",
+    label: "X",
+    ariaLabel: "X (Twitter)",
+    brand: "x",
     external: true,
     icon: (
       <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden>
-        <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.064 2.064 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" />
+        <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24h-6.657l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
       </svg>
     ),
   },