design

min-width: 0 и text-overflow в flex-строке

min-width: 0 и text-overflow в flex-строке

В горизонтальном flex средний блок с длинным названием должен иметь min-width: 0 и overflow: hidden; text-overflow: ellipsis — иначе flex item refuses to shrink.

Иконка слева и кнопка справа с flex-shrink: 0 — текст в центре сжимается корректно.

- [min-width — MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/min-width) — auto vs 0.

- [text-overflow — MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow) — ellipsis.

---

## Grid

В grid minmax(0, 1fr) на колонке решает ту же задачу.

beforetoggle: хук жизненного цикла popover

Аналитика до открытия панели.

Мы используем обязательные cookie для работы сайта (корзина, вход, оформление заказа) и необязательные — для аналитики и маркетинга. Вы можете принять все, отклонить необязательные или настроить категории. Подробнее в политике cookies.