Раньше карточки шли одна под другой, и коробка с двумя десятками вещей
превращалась в длинную колонку. Теперь сетка на CSS grid с auto-fill: сколько
колонок влезает в экран, столько и будет — на телефоне обычно две,
на планшете три-четыре.
Чтобы плитка была компактной:
- превью квадратные (object-fit: cover) — ряд выглядит ровным;
- кнопки только иконками, подписи в них не влезали; что означает какая,
написано подсказкой под сеткой и в title;
- теги в плитке скрыты, они её распирали — видны при правке;
- карточка с открытой правкой растягивается на всю ширину, иначе поля
ввода оказались бы в колонке шириной с ладонь.
Один результат сеткой не оформляется: выглядело бы как обрезанная витрина.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
alexandClaude Opus 5
9cbc7f02ac