Files
kvarta_project/apps/landing/src/components/sections/Catalog.tsx
T
nunuchek 834c4e53a5 design: итерация критика 2
Заголовки через typo(): «и» не висит. Подписка: у цены нет своей
линейки, цена и CTA по низу полей. Этикетки сортов делят строки
через subgrid, ступеньки под названием нет; значения полей с
интерлиньяжем 1.3, «•» держится за следующую ноту, вес «250 г» —
число и единица отдельными span. Под ассортиментом строка про
бесплатную доставку от 50 BYN. В тёмной секции строки доставки —
поля с подписями, акцент только на «бесплатно». В подвале слеш
не отрывается.
2026-10-17 17:07:56 +03:00

35 lines
1.3 KiB
TypeScript

import { site } from '@/content/site';
import { typo } from '@/lib/typo';
import { Label } from '../Label';
export function Catalog({ roastDate }: { roastDate: string }) {
const { catalog } = site;
const packs = catalog.items.filter((item) => item.id !== 'drip');
const drip = catalog.items.find((item) => item.id === 'drip');
return (
<section id="coffee" aria-labelledby="coffee-title" className="page-x section-y">
<div className="container-page border-t-2 border-ink pt-10 lg:pt-14">
<h2 id="coffee-title" className="text-headline font-extrabold">
{typo(catalog.title)}
</h2>
<p className="mt-4 max-w-[46ch] text-lead">{typo(catalog.subtitle)}</p>
<div className="mt-10 grid gap-4 md:grid-cols-2 lg:mt-16 lg:grid-cols-3 lg:gap-x-6 lg:gap-y-6">
{packs.map((item) => (
<Label key={item.id} item={item} roastDate={roastDate} />
))}
{drip && (
<div className="md:col-span-2 lg:col-span-3">
<Label item={drip} roastDate={roastDate} wide />
</div>
)}
</div>
<p className="mt-6 text-small">
<a href={catalog.deliveryNote.href} className="inline-flex min-h-11 items-center underline">
{typo(catalog.deliveryNote.text)}
</a>
</p>
</div>
</section>
);
}