anthonyandClaude Sonnet 5
948b77cef4
Create a dedicated, dynamically-routed page for each of 15 curated platforms (YouTube, TikTok, Instagram, Facebook, X, Reddit, Pinterest, Vimeo, SoundCloud, Twitch, Dailymotion, LinkedIn, Tumblr, VK, Snapchat) under /[locale]/[slug], with a tailored hero, an example URL matched to the platform, a unique "about" paragraph, and a mix of platform-specific and shared FAQ items, all translated across en/fr/es/it. Unknown slugs 404. Kept the scope to a curated list rather than all 1380 yt-dlp extractors to avoid thin/duplicate "doorway page" content that search engines penalize. The homepage's platform badges and the "+1000 sites" links now point to these pages, extracted the FAQ accordion markup into a shared FaqAccordion component reused by both the homepage FAQ and the new platform pages. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import type { ReactNode } from 'react'
|
|
|
|
function ChevronIcon() {
|
|
return (
|
|
<svg
|
|
width="18"
|
|
height="18"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
aria-hidden
|
|
className="shrink-0 transition-transform duration-200 group-open:rotate-180"
|
|
>
|
|
<path d="M6 9l6 6 6-6" />
|
|
</svg>
|
|
)
|
|
}
|
|
|
|
export function FaqAccordion({ items }: { items: { q: string; a: ReactNode }[] }) {
|
|
return (
|
|
<div className="space-y-3">
|
|
{items.map(({ q, a }) => (
|
|
<details
|
|
key={q}
|
|
className="group rounded-xl border border-gray-200 dark:border-slate-700 bg-white dark:bg-slate-900 px-5 py-4"
|
|
>
|
|
<summary className="flex items-center justify-between gap-4 cursor-pointer select-none font-medium text-gray-900 dark:text-gray-50 list-none [&::-webkit-details-marker]:hidden">
|
|
{q}
|
|
<ChevronIcon />
|
|
</summary>
|
|
<p className="mt-3 text-sm text-gray-500 dark:text-gray-400">{a}</p>
|
|
</details>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|