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

refactor(i18n): restructure translation system with nested objects and proxy

Browse Source 
feat(data): add projects and services data structure for dynamic rendering
refactor(pages): replace hardcoded content with dynamic data-driven components
This commit is contained in:
joyzhao
2025-06-19 10:52:05 +08:00
parent c1f240d007
commit 5b6b9f5d58
7 changed files with 446 additions and 541 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
src/pages/index.astro
View File

@@ -5,7 +5,7 @@ import SkillsMarquee from "@/components/SkillsMarquee";
import Footer from "@/components/Footer";
import { useTranslations, type Lang } from "@/i18n/utils";
import { defaultLang } from "@/i18n/ui";
import { personalInfo } from "@/lib/data";
import { personalInfo, services } from "@/lib/data";
// 使用Astro.currentLocale获取当前语言环境
const lang = Astro.currentLocale as Lang || defaultLang;
@@ -175,74 +175,26 @@ const pageTitle = t('site.title');
</h2>
<div class="grid md:grid-cols-2 gap-8">
<!-- Outsourcing Projects Card -->
<div class="bg-white/70 dark:bg-slate-800/70 backdrop-blur-sm rounded-2xl p-8 border border-white/20 shadow-xl hover:shadow-2xl transition-all duration-300 hover:scale-105">
<div class="flex items-center mb-6">
<div class="w-12 h-12 bg-gradient-to-r from-blue-500 to-cyan-500 rounded-lg flex items-center justify-center mr-4">
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13.255A23.931 23.931 0 0112 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 00-2-2h-4a2 2 0 00-2 2v2m4 6h.01M5 20h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
</svg>
{services.en.map((service) => (
<div class="bg-white/70 dark:bg-slate-800/70 backdrop-blur-sm rounded-2xl p-8 border border-white/20 shadow-xl hover:shadow-2xl transition-all duration-300 hover:scale-105">
<div class="flex items-center mb-6">
<div class={`w-12 h-12 bg-gradient-to-r ${service.icon.gradient} rounded-lg flex items-center justify-center mr-4`}>
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<Fragment set:html={service.icon.svg} />
</svg>
</div>
<h3 class="text-2xl font-bold text-slate-800 dark:text-white">{service.title}</h3>
</div>
<h3 class="text-2xl font-bold text-slate-800 dark:text-white">Outsourcing Projects</h3>
<ul class="space-y-3">
{service.items.map((item, index) => (
<li class="flex items-start">
<span class={`text-${service.color}-500 mr-3 mt-1`}>{index + 1}.</span>
<span class="text-slate-600 dark:text-slate-300">{item}</span>
</li>
))}
</ul>
</div>
<ul class="space-y-3">
<li class="flex items-start">
<span class="text-blue-500 mr-3 mt-1">1.</span>
<span class="text-slate-600 dark:text-slate-300">Provide outsourcing project services for overseas clients</span>
</li>
<li class="flex items-start">
<span class="text-blue-500 mr-3 mt-1">2.</span>
<span class="text-slate-600 dark:text-slate-300">Project packaging, can provide services in different packages</span>
</li>
<li class="flex items-start">
<span class="text-blue-500 mr-3 mt-1">3.</span>
<span class="text-slate-600 dark:text-slate-300">Use popular technologies: React, nest.js, next.js, etc.</span>
</li>
<li class="flex items-start">
<span class="text-blue-500 mr-3 mt-1">4.</span>
<span class="text-slate-600 dark:text-slate-300">Project delivery, provide three months of free maintenance</span>
</li>
<li class="flex items-start">
<span class="text-blue-500 mr-3 mt-1">5.</span>
<span class="text-slate-600 dark:text-slate-300">Regardless of project size, can provide services</span>
</li>
</ul>
</div>
<!-- Bug Fixes Card -->
<div class="bg-white/70 dark:bg-slate-800/70 backdrop-blur-sm rounded-2xl p-8 border border-white/20 shadow-xl hover:shadow-2xl transition-all duration-300 hover:scale-105">
<div class="flex items-center mb-6">
<div class="w-12 h-12 bg-gradient-to-r from-red-500 to-pink-500 rounded-lg flex items-center justify-center mr-4">
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"></path>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
</svg>
</div>
<h3 class="text-2xl font-bold text-slate-800 dark:text-white">Bug Fixes</h3>
</div>
<ul class="space-y-3">
<li class="flex items-start">
<span class="text-red-500 mr-3 mt-1">1.</span>
<span class="text-slate-600 dark:text-slate-300">Quickly locate and fix website issues, able to quickly locate and solve problems</span>
</li>
<li class="flex items-start">
<span class="text-red-500 mr-3 mt-1">2.</span>
<span class="text-slate-600 dark:text-slate-300">Help you solve any problems encountered in the project, Bug, functional optimization issues</span>
</li>
<li class="flex items-start">
<span class="text-red-500 mr-3 mt-1">3.</span>
<span class="text-slate-600 dark:text-slate-300">Application of Vue, React, Node and other technologies</span>
</li>
<li class="flex items-start">
<span class="text-red-500 mr-3 mt-1">4.</span>
<span class="text-slate-600 dark:text-slate-300">Frontend automation, deployment, monitoring, automation, etc.</span>
</li>
<li class="flex items-start">
<span class="text-red-500 mr-3 mt-1">5.</span>
<span class="text-slate-600 dark:text-slate-300">Only limited to Node.js projects</span>
</li>
</ul>
</div>
))}
</div>
</div>
</section>