feat(components): 添加鼠标交互粒子效果和高级浮动效果组件

refactor(sections): 移除各区块的多余标签元素
style(contact-section): 优化联系表单布局和动画效果
This commit is contained in:
张翔
2026-02-23 22:48:32 +08:00
parent a75673fa27
commit 44ba75e4d1
7 changed files with 650 additions and 18 deletions
@@ -53,9 +53,6 @@ export function AboutSection() {
className="max-w-4xl mx-auto"
>
<div className="text-center mb-16">
<span className="inline-flex items-center gap-2 px-5 py-2.5 rounded-full border border-[#1C1C1C]/20 bg-[#F5F5F5] text-[#1C1C1C] text-sm font-medium mb-4">
</span>
<h2 className="text-4xl md:text-5xl font-bold text-[#1C1C1C] mb-6">
<span className="text-[#C41E3A]">{COMPANY_INFO.shortName}</span>
</h2>
+6 -6
View File
@@ -130,7 +130,7 @@ export function ContactSection() {
<div className="grid lg:grid-cols-5 gap-12 lg:gap-16">
<div
className={`
lg:col-span-2 space-y-8
lg:col-span-2 space-y-8 flex flex-col
opacity-0 translate-y-4
${isVisible ? 'animate-fade-in-up stagger-1' : ''}
`}
@@ -209,16 +209,16 @@ export function ContactSection() {
<div
className={`
lg:col-span-3
lg:col-span-3 flex flex-col
opacity-0 translate-y-4
${isVisible ? 'animate-fade-in-up stagger-2' : ''}
`}
>
<div className="bg-[#F5F7FA] p-6 sm:p-8 rounded-lg border border-[#E2E8F0]">
<div className="bg-[#F5F7FA] p-6 sm:p-8 rounded-lg border border-[#E2E8F0] flex-1 flex flex-col">
<h3 className="text-lg font-semibold text-[#1A1A2E] mb-6"></h3>
{isSubmitted ? (
<div className="text-center py-12">
<div className="text-center py-12 flex-1 flex items-center justify-center">
<div className="w-16 h-16 bg-[#C41E3A] rounded-full flex items-center justify-center mx-auto mb-4 animate-stamp-in">
<CheckCircle2 className="w-8 h-8 text-white" />
</div>
@@ -226,7 +226,7 @@ export function ContactSection() {
<p className="text-[#718096]"></p>
</div>
) : (
<form onSubmit={handleSubmit} className="space-y-5">
<form onSubmit={handleSubmit} className="space-y-5 flex-1 flex flex-col">
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
<Input
label="姓名"
@@ -275,7 +275,7 @@ export function ContactSection() {
<Button
type="submit"
size="lg"
className="w-full group"
className="w-full group mt-auto"
disabled={isSubmitting}
>
{isSubmitting ? (
-3
View File
@@ -20,9 +20,6 @@ export function NewsSection() {
transition={{ duration: 0.6 }}
className="text-center max-w-3xl mx-auto mb-16"
>
<span className="inline-flex items-center gap-2 px-4 py-2 rounded-full border border-[#1C1C1C]/20 bg-[#F5F5F5] text-[#1C1C1C] text-sm font-medium mb-4">
</span>
<h2 className="text-3xl sm:text-4xl lg:text-5xl font-bold text-[#1C1C1C] mb-6">
<span className="text-[#C41E3A]"></span>
</h2>
@@ -24,9 +24,6 @@ export function ProductsSection() {
transition={{ duration: 0.6 }}
className="text-center max-w-3xl mx-auto mb-16"
>
<span className="inline-flex items-center gap-2 px-5 py-2.5 rounded-full border border-[#1C1C1C]/20 bg-[#F5F5F5] text-[#1C1C1C] text-sm font-medium mb-4">
</span>
<h2 className="text-4xl md:text-5xl font-bold text-[#1C1C1C] mb-6">
<span className="text-[#C41E3A]"></span>
</h2>
@@ -31,9 +31,6 @@ export function ServicesSection() {
transition={{ duration: 0.6 }}
className="text-center max-w-3xl mx-auto mb-16"
>
<span className="inline-flex items-center gap-2 px-5 py-2.5 rounded-full border border-[#1C1C1C]/20 bg-[#F5F5F5] text-[#1C1C1C] text-sm font-medium mb-4">
</span>
<h2 className="text-4xl md:text-5xl font-bold text-[#1C1C1C] mb-4">
<span className="text-[#C41E3A]"></span>
</h2>