- FaqSection: h1/h2 based on standalone prop (fixes missing H1 on /faq) - faq/page: FAQPage JSON-LD, hreflang x-default, OG image/url - kontakty/page: LocalBusiness JSON-LD (address, geo, tel, openingHours), hreflang x-default, OG - uslugi/page: geo in H1 («в Пушкино»), hreflang x-default, OG, expanded description - [lang]/page: Organization JSON-LD, localized OG (ru_RU/en_US), x-default hreflang - [slug]/page: localized og:title/siteName, x-default hreflang, areaServed+telephone in Service JSON-LD - not-found.tsx: 404 page → generates 404.html for nginx error_page directive Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
42 lines
1.7 KiB
TypeScript
42 lines
1.7 KiB
TypeScript
'use client'
|
|
import { useState } from 'react'
|
|
import { ChevronDown } from 'lucide-react'
|
|
import type { Dictionary } from '@/lib/i18n'
|
|
|
|
function FaqItem({ q, a }: { q: string; a: string }) {
|
|
const [open, setOpen] = useState(false)
|
|
return (
|
|
<div className="border border-slate-200 rounded-xl overflow-hidden">
|
|
<button onClick={() => setOpen(!open)}
|
|
className="w-full flex items-center justify-between px-6 py-4 text-left bg-white hover:bg-slate-50 transition-colors">
|
|
<span className="font-semibold text-slate-800 pr-4">{q}</span>
|
|
<ChevronDown size={18} className={`text-slate-400 flex-shrink-0 transition-transform duration-200 ${open ? 'rotate-180' : ''}`} />
|
|
</button>
|
|
{open && (
|
|
<div className="px-6 py-4 bg-slate-50 border-t border-slate-200 text-slate-600 text-sm leading-relaxed">{a}</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default function FaqSection({ d, standalone }: { d: Dictionary; standalone?: boolean }) {
|
|
return (
|
|
<section id="faq" className={`${standalone ? 'py-24' : 'py-24 border-t border-slate-100'} bg-white`}>
|
|
<div className="max-w-3xl mx-auto px-4 sm:px-6">
|
|
<div className="text-center mb-12">
|
|
{standalone
|
|
? <h1 className="text-3xl sm:text-4xl font-bold text-slate-900 mb-4">{d.faq.title}</h1>
|
|
: <h2 className="text-3xl sm:text-4xl font-bold text-slate-900 mb-4">{d.faq.title}</h2>
|
|
}
|
|
<p className="text-slate-500 text-lg">{d.faq.subtitle}</p>
|
|
</div>
|
|
<div className="flex flex-col gap-3">
|
|
{d.faq.items.map((item, i) => (
|
|
<FaqItem key={i} q={item.q} a={item.a} />
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
)
|
|
}
|