style(ui组件): 更新UI组件颜色方案为深色主题

refactor(card): 调整卡片背景色和边框颜色
refactor(badge): 修改徽章颜色变体
refactor(button): 更新按钮颜色样式
refactor(input): 调整输入框颜色方案
refactor(textarea): 修改文本区域颜色样式
refactor(header): 更新导航栏颜色
refactor(hero-section): 调整英雄区域颜色和渐变
This commit is contained in:
张翔
2026-02-23 09:18:41 +08:00
parent 9e7fb20d2a
commit 5ec2ad0043
168 changed files with 823 additions and 822 deletions
+26 -26
View File
@@ -105,7 +105,7 @@ export function ContactSection() {
return (
<section id="contact" className="section-padding relative bg-white overflow-hidden" ref={sectionRef}>
<div className="absolute inset-0 pointer-events-none">
<div className="absolute inset-0 bg-gradient-radial from-[rgba(0,94,184,0.03)] via-transparent to-transparent" />
<div className="absolute inset-0 bg-gradient-radial from-[rgba(79,70,229,0.03)] via-transparent to-transparent" />
</div>
<div className="container-wide relative z-10">
@@ -116,13 +116,13 @@ export function ContactSection() {
`}
>
<div className="flex items-center gap-3 mb-4">
<div className="w-8 h-px bg-gradient-to-r from-[#005EB8] to-[#C41E3A]" />
<span className="text-sm text-[#718096] tracking-wide"></span>
<div className="w-8 h-px bg-gradient-to-r from-[#1C1C1C] to-[#C41E3A]" />
<span className="text-sm text-[#5C5C5C] tracking-wide"></span>
</div>
<h2 className="text-4xl md:text-5xl font-bold text-[#1A1A2E] mb-4">
<h2 className="text-4xl md:text-5xl font-bold text-[#1C1C1C] mb-4">
<span className="text-[#C41E3A]"></span>
</h2>
<p className="mt-4 text-[#718096] max-w-2xl">
<p className="mt-4 text-[#5C5C5C] max-w-2xl">
</p>
</div>
@@ -136,72 +136,72 @@ export function ContactSection() {
`}
>
<div>
<h3 className="text-lg font-semibold text-[#1A1A2E] mb-6"></h3>
<h3 className="text-lg font-semibold text-[#1C1C1C] mb-6"></h3>
<div className="space-y-4">
<div className="flex items-start gap-4 group">
<div className="w-10 h-10 bg-[#005EB8] rounded-md flex items-center justify-center flex-shrink-0 transition-transform duration-200 group-hover:scale-105">
<div className="w-10 h-10 bg-[#C41E3A] rounded-md flex items-center justify-center flex-shrink-0 transition-transform duration-200 group-hover:scale-105">
<Mail className="w-5 h-5 text-white" />
</div>
<div>
<p className="text-sm text-[#718096] mb-1"></p>
<a href={`mailto:${COMPANY_INFO.email}`} className="text-[#1A1A2E] hover:text-[#005EB8] transition-colors duration-200">
<p className="text-sm text-[#5C5C5C] mb-1"></p>
<a href={`mailto:${COMPANY_INFO.email}`} className="text-[#1C1C1C] hover:text-[#C41E3A] transition-colors duration-200">
{COMPANY_INFO.email}
</a>
</div>
</div>
<div className="flex items-start gap-4 group">
<div className="w-10 h-10 bg-[#005EB8] rounded-md flex items-center justify-center flex-shrink-0 transition-transform duration-200 group-hover:scale-105">
<div className="w-10 h-10 bg-[#C41E3A] rounded-md flex items-center justify-center flex-shrink-0 transition-transform duration-200 group-hover:scale-105">
<Phone className="w-5 h-5 text-white" />
</div>
<div>
<p className="text-sm text-[#718096] mb-1"></p>
<a href={`tel:${COMPANY_INFO.phone}`} className="text-[#1A1A2E] hover:text-[#005EB8] transition-colors duration-200">
<p className="text-sm text-[#5C5C5C] mb-1"></p>
<a href={`tel:${COMPANY_INFO.phone}`} className="text-[#1C1C1C] hover:text-[#C41E3A] transition-colors duration-200">
{COMPANY_INFO.phone}
</a>
</div>
</div>
<div className="flex items-start gap-4 group">
<div className="w-10 h-10 bg-[#005EB8] rounded-md flex items-center justify-center flex-shrink-0 transition-transform duration-200 group-hover:scale-105">
<div className="w-10 h-10 bg-[#C41E3A] rounded-md flex items-center justify-center flex-shrink-0 transition-transform duration-200 group-hover:scale-105">
<MapPin className="w-5 h-5 text-white" />
</div>
<div>
<p className="text-sm text-[#718096] mb-1"></p>
<p className="text-[#1A1A2E]">{COMPANY_INFO.address}</p>
<p className="text-sm text-[#5C5C5C] mb-1"></p>
<p className="text-[#1C1C1C]">{COMPANY_INFO.address}</p>
</div>
</div>
</div>
</div>
<div className="bg-[#F5F7FA] p-5 rounded-lg border border-[#E2E8F0]">
<div className="bg-[#FFFBF5] p-5 rounded-lg border border-[#E5E5E5]">
<div className="flex items-center gap-2 mb-3">
<Clock className="w-4 h-4 text-[#005EB8]" />
<h4 className="text-sm font-medium text-[#1A1A2E]"></h4>
<Clock className="w-4 h-4 text-[#C41E3A]" />
<h4 className="text-sm font-medium text-[#1C1C1C]"></h4>
</div>
<div className="space-y-1">
<div className="flex justify-between text-sm">
<span className="text-[#718096]"></span>
<span className="text-[#005EB8]">9:00 - 18:00</span>
<span className="text-[#5C5C5C]"></span>
<span className="text-[#C41E3A]">9:00 - 18:00</span>
</div>
</div>
</div>
<div className="bg-[#F5F7FA] p-5 rounded-lg border border-[#E2E8F0]">
<div className="bg-[#FFFBF5] p-5 rounded-lg border border-[#E5E5E5]">
<div className="flex items-center gap-2 mb-3">
<HeadphonesIcon className="w-4 h-4 text-[#005EB8]" />
<h4 className="text-sm font-medium text-[#1A1A2E]"></h4>
<HeadphonesIcon className="w-4 h-4 text-[#C41E3A]" />
<h4 className="text-sm font-medium text-[#1C1C1C]"></h4>
</div>
<div className="space-y-3">
<div className="flex items-start gap-2">
<div className="w-1.5 h-1.5 bg-[#C41E3A] rounded-full mt-2 flex-shrink-0" />
<p className="text-sm text-[#718096]"> 2 </p>
<p className="text-sm text-[#5C5C5C]"> 2 </p>
</div>
<div className="flex items-start gap-2">
<div className="w-1.5 h-1.5 bg-[#C41E3A] rounded-full mt-2 flex-shrink-0" />
<p className="text-sm text-[#718096]"></p>
<p className="text-sm text-[#5C5C5C]"></p>
</div>
<div className="flex items-start gap-2">
<div className="w-1.5 h-1.5 bg-[#C41E3A] rounded-full mt-2 flex-shrink-0" />
<p className="text-sm text-[#718096]"></p>
<p className="text-sm text-[#5C5C5C]"></p>
</div>
</div>
</div>