---
import { getCollection } from 'astro:content'
import BaseLayout from '@/layouts/BaseLayout.astro'
export async function getStaticPaths() {
  const items = await getCollection('kb')
  return items.map((a) => ({ params: { slug: a.slug }, props: { article: a } }))
}
const { article } = Astro.props
const { Content } = await article.render()
---
<BaseLayout title={article.data.title} description={`База знаний Food Market: ${article.data.title}.`}>
  <article class="max-w-[720px] mx-auto px-4 sm:px-6 py-12">
    <a href="/kb" class="text-xs text-brand hover:underline">← Все статьи</a>
    <p class="text-xs text-slate-500 mt-4">{article.data.category}</p>
    <h1 class="text-4xl font-extrabold mt-2">{article.data.title}</h1>
    <div class="prose-md mt-8"><Content /></div>
  </article>
</BaseLayout>
