TitleDescriptionBox

import { TitleDescriptionBox } from '@megafon/ui-shared';

Примеры и код

Свойства и методы

Контент

Заголовок и описание

<TitleDescriptionBox
  title="Интернет"
  description="При подключении тарифа на вашем счёте должна быть сумма, достаточная для списания абонентской платы за месяц и дополнительных услуг, указанных в заявке."
/>

Только заголовок

Показать код

<TitleDescriptionBox
  title="Интернет"
/>

Только описание

Показать код

<TitleDescriptionBox
  description="При подключении тарифа на вашем счёте должна быть сумма, достаточная для списания абонентской платы за месяц и дополнительных услуг, указанных в заявке."
/>

Несколько описаний

Показать код

<TitleDescriptionBox
  title="Интернет"
  description="При подключении тарифа на вашем счёте должна быть сумма, достаточная для списания абонентской платы за месяц и дополнительных услуг, указанных в заявке."
/>
<TitleDescriptionBox
  description="При подключении тарифа на вашем счёте должна быть сумма, достаточная для списания абонентской платы за месяц и дополнительных услуг, указанных в заявке."
/>
<TitleDescriptionBox
  description="При подключении тарифа на вашем счёте должна быть сумма, достаточная для списания абонентской платы за месяц и дополнительных услуг, указанных в заявке."
/>

Горизонтальное выравнивание

Показать код

<TitleDescriptionBox
  title="Интернет"
  description="При подключении тарифа на вашем счёте должна быть сумма, достаточная для списания абонентской платы за месяц и дополнительных услуг, указанных в заявке."
  align="center"
/>

Цвет текста

Показать код

<TitleDescriptionBox
  title="Интернет"
  description="При подключении тарифа на вашем счёте должна быть сумма, достаточная для списания абонентской платы за месяц и дополнительных услуг, указанных в заявке."
  textColor="white"
/>

Prop name	Type	Description
dataAttrs	{ root?: Record<string, string> \| undefined; } \| undefined	Дополнительные data атрибуты к внутренним элементам
rootRef	Ref<HTMLDivElement> \| undefined	Ссылка на корневой элемент
className	string \| undefined	Дополнительный класс корневого элемента
title	ReactNode \| ReactNode[]	Заголовок
description	ReactNode \| ReactNode[]	Описание
textColor	"white" \| undefined	Цвет текста
align	"center" \| undefined	Горизонтальное выравнивание