Evandro Fonseca Junior
4ba3339df7
- Rewrote README.md to describe the Tibia Trade project, including features, setup instructions, technologies, and SEO keywords in Portuguese - Removed "Pagodera" from thank you page text for rebranding - Added role and aria-label to main element in home page for better accessibility - Added metadata generation with localized titles and descriptions to prices page for improved SEO and user experience
74 lines
2.2 KiB
TypeScript
74 lines
2.2 KiB
TypeScript
"use client";
|
|
|
|
import { useTranslations } from "next-intl";
|
|
import { BentoGrid, BentoCard } from "@/components/ui/bento-grid";
|
|
import { ShoppingBag, Coins, Shield } from "lucide-react";
|
|
|
|
export function HowItWorks() {
|
|
const t = useTranslations("home.howItWorks");
|
|
|
|
const features = [
|
|
{
|
|
name: t("buy"),
|
|
description: "Encontre os melhores itens com preços justos",
|
|
className: "md:col-span-1",
|
|
background: (
|
|
<div className="absolute inset-0 bg-gradient-to-br from-green-500/10 via-green-500/5 to-transparent" />
|
|
),
|
|
Icon: ShoppingBag,
|
|
href: "/market",
|
|
cta: "Ver Mercado",
|
|
},
|
|
{
|
|
name: t("sell"),
|
|
description: "Venda seu loot e ganhe gold rapidamente",
|
|
className: "md:col-span-1",
|
|
background: (
|
|
<div className="absolute inset-0 bg-gradient-to-br from-amber-500/10 via-amber-500/5 to-transparent" />
|
|
),
|
|
Icon: Coins,
|
|
href: "/market",
|
|
cta: "Vender Agora",
|
|
},
|
|
{
|
|
name: t("trade"),
|
|
description: "Sistema seguro de escrow protege suas transações",
|
|
className: "md:col-span-2",
|
|
background: (
|
|
<div className="absolute inset-0 bg-gradient-to-br from-blue-500/10 via-blue-500/5 to-transparent" />
|
|
),
|
|
Icon: Shield,
|
|
href: "/market",
|
|
cta: "Negociar",
|
|
},
|
|
];
|
|
|
|
return (
|
|
<section className="py-20 bg-background">
|
|
<div className="container">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-4xl font-bold mb-4">{t("title")}</h2>
|
|
<p className="text-lg text-muted-foreground max-w-2xl mx-auto">
|
|
Descubra como funciona nossa plataforma de trading segura e
|
|
eficiente.{" "}
|
|
<a href="/market" className="text-primary hover:underline">
|
|
Explore o mercado
|
|
</a>{" "}
|
|
ou conheça nosso{" "}
|
|
<a href="#escrow" className="text-primary hover:underline">
|
|
sistema de escrow
|
|
</a>
|
|
.
|
|
</p>
|
|
</div>
|
|
|
|
<BentoGrid>
|
|
{features.map((feature, idx) => (
|
|
<BentoCard key={idx} {...feature} />
|
|
))}
|
|
</BentoGrid>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|