52 lines
1.5 KiB
TypeScript
52 lines
1.5 KiB
TypeScript
'use client';
|
|
|
|
import type { FeaturesProps } from '@/types/component-props';
|
|
|
|
export default function Features({}: FeaturesProps) {
|
|
const features = [
|
|
{
|
|
icon: '🎙️',
|
|
title: 'Voice Recording',
|
|
description: 'Record voice notes directly in your browser with one click',
|
|
},
|
|
{
|
|
icon: '📝',
|
|
title: 'AI Transcription',
|
|
description: 'Automatic transcription powered by OpenAI Whisper',
|
|
},
|
|
{
|
|
icon: '✨',
|
|
title: 'Smart Summaries',
|
|
description: 'Get AI-generated summaries of your recordings using Gemini',
|
|
},
|
|
{
|
|
icon: '🚀',
|
|
title: 'Auto App Generation',
|
|
description: 'Say "create an app" and watch AI build it from your ideas',
|
|
},
|
|
];
|
|
|
|
return (
|
|
<section className="py-16 bg-white">
|
|
<div className="container mx-auto px-4">
|
|
<h2 className="text-3xl font-bold text-center text-gray-900 mb-12">
|
|
Everything You Need
|
|
</h2>
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
|
|
{features.map((feature, index) => (
|
|
<div key={index} className="text-center">
|
|
<div className="text-5xl mb-4">{feature.icon}</div>
|
|
<h3 className="text-xl font-semibold text-gray-900 mb-2">
|
|
{feature.title}
|
|
</h3>
|
|
<p className="text-gray-600">
|
|
{feature.description}
|
|
</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|