Портфолио
Выноски

Выноски

Callout Component – это встроенный компонент, предназначенный для выделения на странице наиболее значимых сообщений.

Примеры

💡

Выноска – это короткое сообщение для привлечения внимания пользователя.

Выноска – это короткое сообщение для привлечения внимания пользователя.

⚠️

Выноска – это короткое сообщение для привлечения внимания пользователя.

🚫

Выноска – это короткое сообщение для привлечения внимания пользователя.

Реализация

Для любых сообщений

👾

Space Invaders - это аркадная игра 1978 года, разработанная Томохиро Нисикадо.

import { Callout } from 'nextra/components'
 
<Callout emoji="👾">
  **Space Invaders** - это аркадная игра 1978 года, разработанная Томохиро Нисикадо.
</Callout>

Для информации

ℹ️

Сегодня пятница.

import { Callout } from 'nextra/components'
 
<Callout type="info" emoji="ℹ️">
  Сегодня пятница.
</Callout>

Для предупреждения

⚠️

Данный API вскоре перестанет быть актуальным.

import { Callout } from 'nextra/components'
 
<Callout type="warning" emoji="⚠️">
  Данный API вскоре перестанет быть актуальным.
</Callout>

Для системных ошибок

🚫

Данная фунция опасна, может привести к нарушению безопасности системы.

import { Callout } from 'nextra/components'
 
<Callout type="error" emoji="️🚫">
  Данная фунция опасна, может привести к нарушению безопасности системы.
</Callout>

API

Передаваемые свойства (props):

type (опционально)

Тип выноски.

  • Type: 'default' | 'info' | 'warning' | 'error'
  • Default: 'default'

emoji (опционально)

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

  • Type: string | ReactNode
  • Default: '💡'

children

Это текст сообщения в выноске.

  • Type: ReactNode