45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
import React from 'react'
|
|
import { Sparkles, Zap, Video } from 'lucide-react'
|
|
|
|
const FeaturesHighlight: React.FC = () => {
|
|
const features = [
|
|
{
|
|
icon: Sparkles,
|
|
title: 'AI 智能剪辑',
|
|
description: '使用先进的 AI 技术，自动识别精彩片段，智能生成视频剪辑'
|
|
},
|
|
{
|
|
icon: Zap,
|
|
title: '高效处理',
|
|
description: '优化的渲染引擎，支持多种格式，快速导出高质量视频'
|
|
},
|
|
{
|
|
icon: Video,
|
|
title: '专业工具',
|
|
description: '丰富的编辑工具和特效，满足从入门到专业的各种需求'
|
|
}
|
|
]
|
|
|
|
return (
|
|
<div className="bg-gradient-to-r from-primary-500 to-primary-600 rounded-lg p-8 text-white">
|
|
<h2 className="text-2xl font-bold mb-4">强大的功能特性</h2>
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
{features.map((feature, index) => {
|
|
const IconComponent = feature.icon
|
|
return (
|
|
<div key={index} className="text-center">
|
|
<div className="inline-flex items-center justify-center w-12 h-12 bg-white/20 rounded-lg mb-4">
|
|
<IconComponent size={24} />
|
|
</div>
|
|
<h3 className="font-semibold mb-2">{feature.title}</h3>
|
|
<p className="text-primary-100 text-sm">{feature.description}</p>
|
|
</div>
|
|
)
|
|
})}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default FeaturesHighlight
|