zgy/zhaoguiyang.site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add multilingual about, services and projects pages with i18n support

Browse Source 
- Create new about and services pages in both English and Chinese
- Implement projects page with responsive design and project cards
- Add i18n translations for new UI elements
- Update header navigation to support new pages
- Create shared AboutLayout component with table of contents
This commit is contained in:
joyzhao
2025-06-18 18:15:32 +08:00
parent e5497e5e6d
commit 7bb617a5c5
9 changed files with 1000 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/GlassHeader.tsx
View File

@@ -42,14 +42,15 @@ export default function GlassHeader({ lang }: GlassHeaderProps) {
{/* Desktop Navigation */}
<nav className="hidden md:flex items-center space-x-6 text-sm font-medium">
{[
{ key: 'nav.about', icon: '👨‍💻 ', sectionId: 'about' },
{ key: 'nav.services', icon: '🛠️ ', sectionId: 'services' },
{ key: 'nav.projects', icon: '🚀 ', sectionId: 'projects' },
{ key: 'nav.home', icon: '🏠 ', href: getLocalizedPath('/', lang) },
{ key: 'nav.about', icon: '👨‍💻 ', href: getLocalizedPath('/about', lang) },
{ key: 'nav.services', icon: '🛠️ ', href: getLocalizedPath('/services', lang) },
{ key: 'nav.projects', icon: '🚀 ', href: getLocalizedPath('/projects', lang) },
{ key: 'nav.blog', icon: '📝 ', href: getLocalizedPath('/blog', lang) },
].map((item) => (
<a
key={item.key}
href={item.href || `#${item.sectionId}`}
href={item.href}
className="transition-colors duration-150 hover:text-foreground/80 text-foreground/60"
>
{item.icon}
@@ -85,14 +86,15 @@ export default function GlassHeader({ lang }: GlassHeaderProps) {
}`}>
<nav className="flex flex-col space-y-3 text-sm font-medium">
{[
{ key: 'nav.about', icon: '👨‍💻 ', sectionId: 'about' },
{ key: 'nav.services', icon: '🛠️ ', sectionId: 'services' },
{ key: 'nav.projects', icon: '🚀 ', sectionId: 'projects' },
{ key: 'nav.home', icon: '🏠 ', href: getLocalizedPath('/', lang) },
{ key: 'nav.about', icon: '👨‍💻 ', href: getLocalizedPath('/about', lang) },
{ key: 'nav.services', icon: '🛠️ ', href: getLocalizedPath('/services', lang) },
{ key: 'nav.projects', icon: '🚀 ', href: getLocalizedPath('/projects', lang) },
{ key: 'nav.blog', icon: '📝 ', href: getLocalizedPath('/blog', lang) },
].map((item) => (
<a
key={item.key}
href={item.href || `#${item.sectionId}`}
href={item.href}
className="transition-colors duration-150 hover:text-foreground/80 text-foreground/60 py-2 block"
onClick={toggleMenu}
>