Карточки
Data Display
Карточка объединяет связанный контент
Карточка нужна только тогда, когда рамка и поверхность помогают увидеть самостоятельную сущность или действие.
Базовая структура
Header, body и footer остаются независимыми смысловыми зонами.
Новый интерфейс
Краткое описание связанного содержимого карточки.
24,8%
За последние 30 дней
<article class="ox-card">
<header class="ox-card-header">
<h3 class="ox-card-title">Новый интерфейс</h3>
</header>
<div class="ox-card-body">...</div>
<footer class="ox-card-footer">...</footer>
</article>
Интерактивная карточка
Если кликабельна вся поверхность, она должна получать фокус и иметь понятное действие.