panhuixia/xunchiProduct
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

字体响应式

Browse Source
This commit is contained in:
小潘
2026-05-29 17:32:15 +08:00
parent 9b53072baa
commit ec6222d183
7 changed files with 79 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/src/pages/ProductPage.jsx
+15 -14
View File
@@ -1,13 +1,14 @@
import { useParams, Link } from 'react-router-dom'
import { ChevronDown, ArrowRight, Shield, Clock, Headphones, Sparkles, CheckCircle2, AlertCircle } from 'lucide-react'
import { getProduct, products } from '../data/products'
import ProductCard from '../components/ProductCard'
import { ChevronDown, ArrowRight, Shield, Clock, Headphones, AlertCircle } from 'lucide-react'
import { getProduct } from '../data/products'
import ScrollReveal from '../components/ScrollReveal'
export default function ProductPage() {
const { slug } = useParams()
const product = getProduct(slug)
if (!product) {
return (
<div className="min-h-screen flex items-center justify-center bg-white">
@@ -20,8 +21,8 @@ export default function ProductPage() {
)
}
const Icon = product.icon
const otherProducts = products.filter(p => p.slug !== slug)
// const Icon = product.icon
// const otherProducts = products.filter(p => p.slug !== slug)
return (
<main className="bg-white">
@@ -40,7 +41,7 @@ export default function ProductPage() {
<div className="relative max-w-4xl mx-auto px-6 text-center pt-32">
<h1 className="text-5xl md:text-7xl font-extrabold mb-5 tracking-tight leading-[1.1] text-white hero-product-title">
<h1 className="text-4xl md:text-7xl font-extrabold mb-5 tracking-tight leading-[1.1] text-white hero-product-title">
{product.name}
</h1>
<p className="text-2xl md:text-3xl mb-6 max-w-xl mx-auto leading-relaxed hero-product-slogan">
@@ -107,7 +108,7 @@ export default function ProductPage() {
<span className="w-5 h-[2px] rounded-full bg-[#043b8f]" />
<span className="text-xs font-semibold uppercase tracking-[0.25em] text-[#043b8f]">Pain Points</span>
</div>
<h2 className="text-4xl md:text-[3.5rem] font-black text-[#0f172a] tracking-tight leading-[1.1]">
<h2 className="text-2xl md:text-[3.5rem] font-black text-[#0f172a] tracking-tight leading-[1.1]">
{product.painPointsTitle || `${product.name}解决的核心问题`}
</h2>
<p className="text-[#475569] text-lg md:text-xl mt-6 max-w-xl leading-relaxed">深入理解管理难题，提供经过实战验证的解决方案</p>
@@ -147,7 +148,7 @@ export default function ProductPage() {
<span className="w-5 h-[2px] rounded-full bg-[#043b8f]" />
<span className="text-xs font-semibold uppercase tracking-[0.25em] text-[#043b8f]">Core Features</span>
</div>
<h2 className="text-4xl md:text-[3.5rem] font-black text-[#0f172a] tracking-tight leading-[1.1]">
<h2 className="text-3xl md:text-[3.5rem] font-black text-[#0f172a] tracking-tight leading-[1.1]">
核心功能
</h2>
{product.target && (
@@ -287,21 +288,21 @@ export default function ProductPage() {
/>
<div className="relative max-w-3xl mx-auto text-center">
<ScrollReveal>
<h2 className="text-5xl md:text-6xl font-bold text-white mb-8">对{product.name}感兴趣？</h2>
<p className="text-white text-lg mb-14 max-w-xl mx-auto leading-relaxed">
<h2 className="text-3xl xs:text-4xl sm:text-5xl md:text-6xl font-bold text-white mb-8">对{product.name}感兴趣？</h2>
<p className="text-white text-sm xs:text-base sm:text-lg mb-14 max-w-xl mx-auto leading-relaxed">
获取产品演示与个性化方案，迈出数字化转型第一步
</p>
<div className="flex flex-col sm:flex-row gap-4 justify-center">
<div className="flex flex-col sm:flex-row gap-3 xs:gap-4 justify-center mx-auto w-[90%] xs:w-[85%] sm:w-auto">
<Link
to="/contact"
className="inline-flex items-center gap-2 px-8 py-3 rounded-xl text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
className="inline-flex items-center justify-center gap-2 px-5 xs:px-6 py-2.5 xs:py-3 rounded-xl text-xs xs:text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
>
联系我们
<ArrowRight className="w-4 h-4" />
<ArrowRight className="w-3.5 h-3.5 xs:w-4 xs:h-4" />
</Link>
<a
href="tel:07713864294"
className="inline-flex items-center gap-2 px-8 py-3 rounded-xl text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
className="inline-flex items-center justify-center gap-2 px-5 xs:px-6 py-2.5 xs:py-3 rounded-xl text-xs xs:text-sm font-semibold text-white border border-white hover:bg-white/10 transition-all"
>
致电 0771-3864294
</a>