Files
nutriscan/app/components/landing/Features.tsx
T
Evandro Fonseca Junior bfb58ef16e feat(search): implement paginated API fetching for large page sizes
- Removed upper limit on page_size validation to support requests >100
- Added automatic pagination logic to fetch from Open Food Facts API in chunks of 1000
- Accumulates products across multiple API pages until desired count is reached
- Updated error messages and product data fields for consistency
2025-10-09 07:16:26 -03:00

94 lines
3.5 KiB
TypeScript

import { Shield, Zap, Sparkles, Heart, CheckCircle } from "lucide-react";
const features = [
{
icon: Shield,
title: "Dados da Comunidade Open Food Facts",
description:
"Informações fornecidas pela maior base de dados colaborativa de alimentos do mundo, mantida por uma comunidade global de colaboradores voluntários.",
color: "text-blue-600 dark:text-blue-400",
bgColor: "bg-blue-50 dark:bg-blue-900/20",
iconBg: "bg-blue-100 dark:bg-blue-900/40",
benefit: "Base colaborativa mundial",
},
{
icon: Zap,
title: "Atualizações em Tempo Real",
description:
"Novos produtos são adicionados a cada minuto. Quando a indústria muda fórmulas, a comunidade atualiza — e você tem acesso instantâneo às informações mais recentes.",
color: "text-green-600 dark:text-green-400",
bgColor: "bg-green-50 dark:bg-green-900/20",
iconBg: "bg-green-100 dark:bg-green-900/40",
benefit: "Atualizado continuamente",
},
{
icon: Sparkles,
title: "Interface Intuitiva, Resultado Imediato",
description:
"Desenvolvido pensando em quem não tem tempo a perder. Digitalize, veja os dados e tome sua decisão em menos de 10 segundos.",
color: "text-purple-600 dark:text-purple-400",
bgColor: "bg-purple-50 dark:bg-purple-900/20",
iconBg: "bg-purple-100 dark:bg-purple-900/40",
benefit: "Resultados em <10 segundos",
},
{
icon: Heart,
title: "100% Gratuito, Para Sempre",
description:
"Construído sobre dados open source, o NutriScan nunca cobrará pelo acesso à informação. Porque conhecimento sobre saúde deve ser universal, não um privilégio.",
color: "text-orange-600 dark:text-orange-400",
bgColor: "bg-orange-50 dark:bg-orange-900/20",
iconBg: "bg-orange-100 dark:bg-orange-900/40",
benefit: "Sempre gratuito, sem truques",
},
];
export function Features() {
return (
<section className="py-20 bg-gray-50 dark:bg-gray-800">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
{/* Header */}
<div className="text-center mb-16">
<h2 className="text-3xl sm:text-4xl font-bold text-gray-900 dark:text-white mb-4">
Por que milhares confiam no NutriScan
</h2>
<p className="text-xl text-gray-600 dark:text-gray-400">
Transparência que transforma alimentação
</p>
</div>
{/* Features Grid */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
{features.map((feature, index) => (
<div
key={index}
className="bg-white dark:bg-gray-900 rounded-2xl p-8 shadow-lg hover:shadow-2xl transition-shadow"
>
{/* Icon */}
<div
className={`${feature.iconBg} w-12 h-12 rounded-lg flex items-center justify-center mb-4`}
>
<feature.icon className={`w-6 h-6 ${feature.color}`} />
</div>
{/* Content */}
<h3 className={`text-2xl font-bold mb-3 ${feature.color}`}>
{feature.title}
</h3>
<p className="text-gray-600 dark:text-gray-400 mb-4">
{feature.description}
</p>
{/* Benefit */}
<div className="flex items-center text-sm text-blue-600">
<CheckCircle className="w-4 h-4 mr-2" />
<span>{feature.benefit}</span>
</div>
</div>
))}
</div>
</div>
</section>
);
}