feat: refresh about page, homepage copy, Signal link, and London weather

app/about/page.tsx

@@ -1,5 +1,3 @@
-import React from "react";
-
 export default function About() {
   return (
     <div className="max-w-[1180px] mx-auto px-4 md:px-12 py-16 space-y-8">
@@ -14,132 +12,144 @@ export default function About() {
         </h1>
       </div>
 
-      {/* Bio */}
-      <div className="fade-up" style={{ animationDelay: "40ms" }}>
-        <p
-          style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 18, lineHeight: 1.9 }}
-          className="text-zinc-700 dark:text-zinc-300"
-        >
-          Mathematics major (Fields Medal Honors Program) at Southern University of Science and
-          Technology (SUSTech), currently visiting UC Berkeley (2026). Previously attended a summer
-          program in Deep Unsupervised Learning at the University of Oxford (2025).
-        </p>
-      </div>
-
       {/* Two-column: Education (left) | Experience + Volunteering (right) */}
-      <div className="grid grid-cols-1 md:grid-cols-2 gap-6 fade-up" style={{ animationDelay: "60ms" }}>
+      <div className="grid grid-cols-1 md:grid-cols-2 md:items-stretch gap-6 fade-up" style={{ animationDelay: "60ms" }}>
 
-        {/* Left — Education */}
-        <div className="mag-card">
-          <div className="mag-label">Education</div>
-          <div>
-            {[
-              {
-                years: "Jan 2026 – Dec 2026",
-                institution: "University of California, Berkeley",
-                role: "Visiting Student",
-                sub: null,
-                activities: "Data Scholar · Effective Altruism at UC Berkeley · Project Reboot",
-              },
-              {
-                years: "Sep 2023 – Jun 2027",
-                institution: "Southern University of Science and Technology",
-                role: "Bachelor of Science, Mathematics",
-                sub: "Zhicheng Residential College · Fields Medal Honors Program in Mathematics",
-                activities:
-                  "SUSTech Psychology Society (Member 23–24, President 24–25) · SUSTech Emergency Rescue Association (Office Dept 23–24) · Zhicheng College (Student Organization Coordinator 23–24)",
-              },
-              {
-                years: "Jun 2025 – Jul 2025",
-                institution: "University of Oxford",
-                role: "Summer Program, Advanced AI and Machine Learning",
-                sub: "Deep Unsupervised Learning · Grade: First Class (A+)",
-                activities: null,
-              },
-              {
-                years: "Jul 2020 – Jun 2023",
-                institution: "Tongzhou Senior High School of Jiangsu Province",
-                role: "High School Diploma",
-                sub: "Top 0.42% (1848th in 445k+ in Jiangsu Province) in Gaokao · Innovation Honors Program in STEM",
-                activities: null,
-              },
-            ].map(({ years, institution, role, sub, activities }, i) => (
-              <div
-                key={i}
-                className="py-6 border-b border-zinc-100 dark:border-zinc-800/60 last:border-0"
-              >
-                <span
-                  style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 11, letterSpacing: "0.04em" }}
-                  className="text-zinc-400 dark:text-zinc-600 block mb-2"
-                >
-                  {years}
-                </span>
-                <p
-                  style={{ fontFamily: "'Nunito'", fontWeight: 600, fontSize: 17, lineHeight: 1.7 }}
-                  className="text-zinc-800 dark:text-zinc-200"
-                >
-                  {institution}
-                </p>
-                <p
-                  style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 16, lineHeight: 1.9 }}
-                  className="text-[#C4894F] dark:text-[#D9A870] mt-1"
+        {/* Left — Education + Focus */}
+        <div className="flex flex-col gap-6 md:h-full">
+          <div className="mag-card flex flex-col md:flex-1">
+            <div className="mag-label">Education</div>
+            <div className="flex flex-col md:flex-1 md:justify-between">
+              {[
+                {
+                  years: "Sep 2023 – Jun 2027",
+                  institution: "Southern University of Science and Technology",
+                  role: "Bachelor of Science, Mathematics",
+                  content: "Fields Medal Honors Program",
+                },
+                {
+                  years: "Jan 2026 – Dec 2026",
+                  institution: "University of California, Berkeley",
+                  role: "Study Abroad",
+                  content: "Computer Science and Data Science",
+                },
+                {
+                  years: "Jun 2025 – Jul 2025",
+                  institution: "University of Oxford",
+                  role: "Summer Program",
+                  content: "Advanced Artificial Intelligence (AI) and Machine Learning (ML)",
+                },
+                {
+                  years: "Jul 2020 – Jun 2023",
+                  institution: "Tongzhou Senior High School of Jiangsu Province",
+                  role: "High School Diploma",
+                  content: "Innovation Honors Program in STEM",
+                },
+              ].map(({ years, institution, role, content }, i) => (
+                <div
+                  key={i}
+                  className="py-4 md:py-3 border-b border-zinc-100 dark:border-zinc-800/60 last:border-0"
                 >
-                  {role}
-                </p>
-                {sub && (
+                  <span
+                    style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 11, letterSpacing: "0.04em" }}
+                    className="text-zinc-400 dark:text-zinc-600 block mb-2"
+                  >
+                    {years}
+                  </span>
                   <p
-                    style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 14, lineHeight: 1.9 }}
-                    className="text-zinc-500 dark:text-zinc-500 mt-1"
+                    style={{ fontFamily: "'Nunito'", fontWeight: 600, fontSize: 17, lineHeight: 1.7 }}
+                    className="text-zinc-800 dark:text-zinc-200"
+                  >
+                    {institution}
+                  </p>
+                  <p
+                    style={{ fontFamily: "'Nunito'", fontWeight: 600, fontSize: 17, lineHeight: 1.4 }}
+                    className="text-[#C4894F] dark:text-[#D9A870] mt-1"
                   >
-                    {sub}
+                    {role}
                   </p>
-                )}
-                {activities && (
                   <p
-                    style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 13, lineHeight: 1.9 }}
-                    className="text-zinc-400 dark:text-zinc-600 mt-2"
+                    style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 16, lineHeight: 1.5 }}
+                    className="text-[#C4894F] dark:text-[#D9A870] mt-0.5"
                   >
-                    {activities}
+                    {content}
                   </p>
-                )}
-              </div>
-            ))}
+                </div>
+              ))}
+            </div>
+          </div>
+
+          <div className="mag-card shrink-0">
+            <div className="mag-label">Focus</div>
+            <div>
+              {[
+                { term: "Summer 26", code: "COMPSCI 61B: Data Structures" },
+                { term: "Summer 26", code: "COMPSCI 188: Introduction to Artificial Intelligence" },
+              ].map(({ term, code }) => (
+                <div
+                  key={code}
+                  className="py-4 border-b border-zinc-100 dark:border-zinc-800/60 last:border-0"
+                >
+                  <span
+                    style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 11, letterSpacing: "0.04em" }}
+                    className="text-zinc-400 dark:text-zinc-600 block mb-1"
+                  >
+                    {term}
+                  </span>
+                  <p
+                    style={{ fontFamily: "'Nunito'", fontWeight: 600, fontSize: 17, lineHeight: 1.4 }}
+                    className="text-zinc-800 dark:text-zinc-200"
+                  >
+                    {code}
+                  </p>
+                </div>
+              ))}
+            </div>
           </div>
         </div>
 
         {/* Right — Experience + Volunteering stacked */}
-        <div className="flex flex-col gap-6">
+        <div className="flex flex-col gap-6 md:h-full">
 
           {/* Experience */}
-          <div className="mag-card">
+          <div className="mag-card flex flex-col md:flex-1">
             <div className="mag-label">Experience</div>
-            <div>
+            <div className="flex flex-col md:flex-1 md:justify-between">
               {[
+                {
+                  years: "Apr 2026 – Present",
+                  meta: "Berkeley, CA · On-site",
+                  role: "Research Collaborator",
+                  org: "Constellation Institute",
+                },
                 {
                   years: "Jun 2024 – Jun 2025",
                   meta: "Shenzhen, China · On-site",
                   role: "Peer Mentor",
                   org: "Southern University of Science and Technology",
-                  desc: "The experience I'm most proud of from my time at SUSTech. Provided sustained one-on-one mentorship to freshmen (300+ hours), supporting academic planning, well-being, and transition to university life. Recognized as Outstanding Peer Mentor.",
                 },
                 {
-                  years: "Mar 2024 – Jan 2025",
+                  years: "Feb 2024 – Jan 2025",
                   meta: "Shenzhen, China · On-site",
                   role: "Research Assistant",
                   org: "Southern University of Science and Technology",
-                  desc: "Conducted research in control theory at NCC Lab, developing inequality-based estimates for nonlinear systems using Lyapunov and energy-based methods.",
+                },
+                {
+                  years: "Nov 2023 – Jan 2024",
+                  meta: "Shenzhen, China · On-site",
+                  role: "Teaching Assistant",
+                  org: "Southern University of Science and Technology",
                 },
                 {
                   years: "Oct 2024 – Jan 2025",
                   meta: "Hong Kong SAR · Hybrid",
                   role: "Teaching Assistant",
                   org: "Lingnan University",
-                  desc: "Assisted in delivering the Wellness Ambassador Program (WAP), facilitating counseling-focused training and supporting 60+ students in developing peer support skills.",
                 },
-              ].map(({ years, meta, role, org, desc }, i) => (
+              ].map(({ years, meta, role, org }, i) => (
                 <div
                   key={i}
-                  className="py-4 border-b border-zinc-100 dark:border-zinc-800/60 last:border-0"
+                  className="py-4 md:py-3 border-b border-zinc-100 dark:border-zinc-800/60 last:border-0"
                 >
                   <div className="flex gap-2 items-baseline mb-1 flex-wrap">
                     <span
@@ -169,35 +179,32 @@ export default function About() {
                   >
                     {org}
                   </p>
-                  <p
-                    style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 14, lineHeight: 1.7 }}
-                    className="text-zinc-500 dark:text-zinc-500 mt-1.5"
-                  >
-                    {desc}
-                  </p>
                 </div>
               ))}
             </div>
           </div>
 
           {/* Volunteering */}
-          <div className="mag-card">
+          <div className="mag-card shrink-0">
             <div className="mag-label">Volunteering</div>
             <div>
               {[
+                {
+                  years: "May 2026 – Present",
+                  role: "EA Global 2026 Volunteer",
+                  org: "The Centre for Effective Altruism",
+                },
                 {
                   years: "Feb 2026 – Present",
                   role: "Member #10986",
                   org: "Giving What We Can",
-                  desc: "Proudly pledged to donate 10% of my lifetime income to effective charities.",
                 },
                 {
                   years: "Oct 2023 – Dec 2025",
                   role: "Certified First Aider",
                   org: "SUSTech Emergency Rescue Association",
-                  desc: null,
                 },
-              ].map(({ years, role, org, desc }, i) => (
+              ].map(({ years, role, org }, i) => (
                 <div
                   key={i}
                   className="py-4 border-b border-zinc-100 dark:border-zinc-800/60 last:border-0"
@@ -220,14 +227,6 @@ export default function About() {
                   >
                     {org}
                   </p>
-                  {desc && (
-                    <p
-                      style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 14, lineHeight: 1.7 }}
-                      className="text-zinc-500 dark:text-zinc-500 mt-1.5"
-                    >
-                      {desc}
-                    </p>
-                  )}
                 </div>
               ))}
             </div>
@@ -236,36 +235,6 @@ export default function About() {
         </div>
       </div>
 
-      {/* Focus */}
-      <div className="fade-up" style={{ animationDelay: "120ms" }}>
-      <div className="mag-card">
-        <div className="mag-label">Focus</div>
-        {(() => {
-          const courses = [
-            { term: "Spring 26", code: "CS61A", name: "Structure and Interpretation of Computer Programs" },
-            { term: "Spring 26", code: "Data100", name: "Principles and Techniques of Data Science" },
-            { term: "Spring 26", code: "CogSci175", name: "Mind, Machine and Meaning" },
-          ];
-          const items: React.ReactNode[] = [];
-          courses.forEach(({ term, code, name }, i) => {
-            if (i > 0) {
-              items.push(
-                <div key={`vdiv-${i}`} className="h-px w-full md:h-auto md:w-px md:self-stretch bg-zinc-100 dark:bg-zinc-800/60 my-1 md:my-0 md:mx-6" />
-              );
-            }
-            items.push(
-              <div key={code} className="flex-1 py-4">
-                <span style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 11, letterSpacing: "0.04em" }} className="text-zinc-400 dark:text-zinc-600 block mb-1">{term}</span>
-                <p style={{ fontFamily: "'Nunito'", fontWeight: 600, fontSize: 16, letterSpacing: "0.05em" }} className="text-[#C4894F] dark:text-[#D9A870]">{code}</p>
-                <p style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 16, lineHeight: 1.6 }} className="text-zinc-500 dark:text-zinc-500 mt-0.5">{name}</p>
-              </div>
-            );
-          });
-          return <div className="flex flex-col md:flex-row">{items}</div>;
-        })()}
-      </div>
-      </div>
-
     </div>
   );
 }

app/api/weather/route.ts

@@ -7,11 +7,11 @@ import {
 export async function GET() {
   const url =
     "https://api.open-meteo.com/v1/forecast" +
-    "?latitude=37.8715&longitude=-122.2730" +
+    "?latitude=51.5074&longitude=-0.1278" +
     "&current=temperature_2m,weathercode,apparent_temperature,relative_humidity_2m" +
     "&hourly=precipitation_probability" +
     "&temperature_unit=celsius" +
-    "&timezone=America%2FLos_Angeles" +
+    "&timezone=Europe%2FLondon" +
     "&forecast_days=1";
 
   const res = await fetch(url, { next: { revalidate: 600 } });

app/components/Weather.tsx

@@ -16,7 +16,7 @@ export default function Weather() {
   useEffect(() => {
     const tick = () => {
       const t = new Date().toLocaleTimeString("en-US", {
-        timeZone: "America/Los_Angeles",
+        timeZone: "Europe/London",
         hour: "numeric",
         minute: "2-digit",
         second: "2-digit",
@@ -38,7 +38,7 @@ export default function Weather() {
 
   return (
     <span className="flex flex-col gap-0.5">
-      <span>Berkeley, CA</span>
+      <span>London, UK</span>
       {time && <span>{time}</span>}
       {data && (
         <span>

app/components/berkeley-time.tsx

@@ -8,7 +8,7 @@ export default function BerkeleyTime() {
   useEffect(() => {
     const update = () => {
       const full = new Date().toLocaleTimeString("en-US", {
-        timeZone: "America/Los_Angeles",
+        timeZone: "Europe/London",
         hour: "2-digit",
         minute: "2-digit",
         second: "2-digit",

app/components/weather-card.tsx

@@ -38,7 +38,7 @@ export default function WeatherCard() {
           style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 14, letterSpacing: "0.02em" }}
           className="text-zinc-600 dark:text-zinc-400 leading-[1.1]"
         >
-          Berkeley <span className="text-zinc-400 dark:text-zinc-600">· CA · US</span>
+          London <span className="text-zinc-400 dark:text-zinc-600">· UK</span>
         </p>
         <p
           style={{ fontFamily: "'Nunito'", fontWeight: 400, fontSize: 14 }}