Элементы

Уведомление

Короткое сообщение над содержимым: ошибка, успех, пояснение.

Примеры

<p class="notice notice--error" role="alert">Не удалось сохранить встречу: дата уже прошла.</p>
<p class="notice notice--ok" role="status">Приглашения отправлены трём участникам.</p>
<p class="notice notice--info" role="status">Встреча начнётся через 15 минут.</p>

Установка

bukatchuk-ui add notice

Файлы

Варианты

Вставка для Jekyll

{%- comment -%} Уведомление. Параметры: text, kind (error | ok | info). {%- endcomment -%}
<p class="notice notice--{{ include.kind | default: 'info' }}" role="status">{{ include.text }}</p>

Макрос для Jinja

{#- Уведомление. kind: error | ok | info; error и ok объявляются скринридером сразу. -#}
{% macro notice(text, kind='info') -%}
{%- if text %}<p class="notice notice--{{ kind }}" role="{{ 'alert' if kind == 'error' else 'status' }}">{{ text }}</p>{% endif -%}
{%- endmacro %}