Callout · Nupek

Выделенный блок Nupek для заметок, предупреждений и пояснений - обводка и заливка статусного цвета.

Callout привлекает внимание к одному фрагменту текста внутри гайда - примечанию, предупреждению о совместимости, ссылке на смежный раздел.

Информация

Используется для контекста, который не является ни ошибкой, ни подтверждением - просто дополнительное знание.

На проверке

Отмечает раздел или поведение, которое ещё может измениться до стабильного релиза.

Стабильно

Подтверждает, что описанное поведение зафиксировано и не изменится в следующих версиях.

Форма

Радиус - lg (20px), как у карточек: Callout визуально принадлежит той же весовой категории, что и Card, но заливка и обводка берутся из палитры статуса, а не из нейтральной поверхности.

Разметка

<div class="callout callout-info" role="note">
  <p class="callout-kicker">Совместимость</p>
  <p>Пакет требует NurOS ≥ 2.4.</p>
</div>

.callout {
  padding: var(--space-5);
  border-radius: var(--radius-lg);
  border: 1.5px solid transparent;
}

.callout-info {
  background: var(--color-status-info-bg);
  color: var(--color-status-info-text);
  border-color: color-mix(in srgb, var(--color-status-info-text) 30%, transparent);
}