GithubBackup/moemail
1
0
Fork 0
mirror of https://github.com/beilunyang/moemail.git synced 2026-09-06 07:46:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add new content pages

Browse Source
This commit is contained in:
beilunyang
2026-01-18 14:33:11 +08:00
committed by ty
parent cef0ee0f0c
commit 07ad672e7d
54 changed files with 2314 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/home/faq-section.tsx
+38
View File
@@ -0,0 +1,38 @@
"use client"
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "@/components/ui/accordion"
import { useTranslations } from "next-intl"
export function FaqSection() {
const t = useTranslations("home.faq")
// We'll hardcode the keys for now to map them
const questions = ["q1", "q2", "q3", "q4", "q5"]
return (
<section className="py-24 bg-muted/30">
<div className="container mx-auto px-4 max-w-3xl">
<h2 className="text-4xl font-bold text-center mb-12">{t("title")}</h2>
<div className="bg-card w-full rounded-2xl border shadow-sm p-6 sm:p-10">
<Accordion type="single" collapsible className="w-full">
{questions.map((key) => (
<AccordionItem key={key} value={key} className="border-b-border/50 last:border-0 px-2">
<AccordionTrigger className="text-left py-6 text-lg hover:text-primary transition-colors hover:no-underline">
{t(`${key}.question`)}
</AccordionTrigger>
<AccordionContent className="text-muted-foreground text-base pb-6 leading-relaxed">
{t(`${key}.answer`)}
</AccordionContent>
</AccordionItem>
))}
</Accordion>
</div>
</div>
</section>
)
}
app/components/home/feature-card.tsx
+3 -3
View File
@@ -1,12 +1,12 @@
interface FeatureCardProps {
interface FeatureCardProps {
icon: React.ReactNode
title: string
description: string
description: string
}
export function FeatureCard({ icon, title, description }: FeatureCardProps) {
return (
<div className="p-4 rounded border-2 border-primary/20 hover:border-primary/40 transition-colors bg-white/5 backdrop-blur">
<div className="p-4 rounded-xl border border-primary/20 bg-background/50 backdrop-blur-sm hover:border-primary/50 transition-colors group">
<div className="flex items-center gap-3">
<div className="rounded-lg bg-primary/10 text-primary p-2">
{icon}
app/components/home/how-it-works.tsx
+68
View File
@@ -0,0 +1,68 @@
"use client"
import { useTranslations } from "next-intl"
import { MousePointerClick, RefreshCw, ArchiveX, Network, FileCode, Share2 } from "lucide-react"
export function HowItWorks() {
const t = useTranslations("home.howItWorks")
return (
<section className="py-16">
<div className="container mx-auto px-4 max-w-5xl">
<h2 className="text-3xl font-bold text-center mb-12">{t("title")}</h2>
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
<div className="flex flex-col items-center text-center space-y-4 p-6 rounded-xl border border-border bg-card/50 hover:border-primary/50 transition-colors">
<div className="p-4 bg-primary/10 rounded-full text-primary">
<MousePointerClick className="w-8 h-8" />
</div>
<h3 className="text-xl font-semibold">{t("step1.title")}</h3>
<p className="text-muted-foreground">{t("step1.description")}</p>
</div>
<div className="flex flex-col items-center text-center space-y-4 p-6 rounded-xl border border-border bg-card/50 hover:border-primary/50 transition-colors">
<div className="p-4 bg-primary/10 rounded-full text-primary">
<RefreshCw className="w-8 h-8" />
</div>
<h3 className="text-xl font-semibold">{t("step2.title")}</h3>
<p className="text-muted-foreground">{t("step2.description")}</p>
</div>
<div className="flex flex-col items-center text-center space-y-4 p-6 rounded-xl border border-border bg-card/50 hover:border-primary/50 transition-colors">
<div className="p-4 bg-primary/10 rounded-full text-primary">
<ArchiveX className="w-8 h-8" />
</div>
<h3 className="text-xl font-semibold">{t("step3.title")}</h3>
<p className="text-muted-foreground">{t("step3.description")}</p>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 mt-8">
<div className="flex flex-col items-center text-center space-y-4 p-6 rounded-xl border border-border bg-card/50 hover:border-primary/50 transition-colors">
<div className="p-4 bg-primary/10 rounded-full text-primary">
<Network className="w-8 h-8" />
</div>
<h3 className="text-xl font-semibold">{t("advStep1.title")}</h3>
<p className="text-muted-foreground">{t("advStep1.description")}</p>
</div>
<div className="flex flex-col items-center text-center space-y-4 p-6 rounded-xl border border-border bg-card/50 hover:border-primary/50 transition-colors">
<div className="p-4 bg-primary/10 rounded-full text-primary">
<FileCode className="w-8 h-8" />
</div>
<h3 className="text-xl font-semibold">{t("advStep2.title")}</h3>
<p className="text-muted-foreground">{t("advStep2.description")}</p>
</div>
<div className="flex flex-col items-center text-center space-y-4 p-6 rounded-xl border border-border bg-card/50 hover:border-primary/50 transition-colors">
<div className="p-4 bg-primary/10 rounded-full text-primary">
<Share2 className="w-8 h-8" />
</div>
<h3 className="text-xl font-semibold">{t("advStep3.title")}</h3>
<p className="text-muted-foreground">{t("advStep3.description")}</p>
</div>
</div>
</div>
</section>
)
}