feat(portfolio): redesign hero and projects sections with modern UI

- Implement new glassmorphism design for hero section with terminal mockup
- Redesign projects section with improved card layout and tech stack indicators
- Update project data with new entries and translations
- Add scroll-aware header with dynamic styling
- Remove unused ExperienceSection component
This commit is contained in:
joyzhao
2025-06-16 11:29:53 +08:00
parent 20ae3de62c
commit ed02039a9e
7 changed files with 335 additions and 155 deletions

View File

@@ -2,7 +2,6 @@
import Layout from "@/layouts/Layout.astro";
import GlassHeader from "@/components/GlassHeader";
import HeroSection from "@/components/HeroSection";
import ExperienceSection from "@/components/ExperienceSection";
import SkillsSection from "@/components/SkillsSection";
import ProjectsSection from "@/components/ProjectsSection";
import Footer from "@/components/Footer";
@@ -18,7 +17,6 @@ const pageTitle = t('page.home.title');
<GlassHeader lang={lang} client:only="react" />
<main class="min-h-screen">
<HeroSection lang={lang} client:only="react" />
<!-- <ExperienceSection lang={lang} client:only="react" /> -->
<SkillsSection lang={lang} client:only="react" />
<ProjectsSection lang={lang} client:only="react" />
</main>

View File

@@ -2,14 +2,11 @@
import Layout from "@/layouts/Layout.astro";
import GlassHeader from "@/components/GlassHeader.tsx";
import HeroSection from "@/components/HeroSection.tsx";
import ExperienceSection from "@/components/ExperienceSection.tsx";
import SkillsSection from "@/components/SkillsSection.tsx";
import ProjectsSection from "@/components/ProjectsSection.tsx";
import Footer from "@/components/Footer.tsx";
import { useTranslations } from "@/i18n/utils";
// For /zh/ pages, Astro.currentLocale should be 'zh'.
// We explicitly set lang to 'zh' to ensure type correctness and intent.
const lang: "en" | "zh" = 'zh';
const t = useTranslations(lang);
const pageTitle = t('page.home.title');
@@ -19,7 +16,6 @@ const pageTitle = t('page.home.title');
<GlassHeader lang={lang} client:only="react" />
<main class="min-h-screen">
<HeroSection lang={lang} client:only="react" />
<!-- <ExperienceSection lang={lang} client:only="react" /> -->
<SkillsSection lang={lang} client:only="react" />
<ProjectsSection lang={lang} client:only="react" />
</main>