Text 🔗
Текстовый блок
Пример использования:
Lorem ipsum dolor sit amet consectetur adipisicing elit. Error repudiandae numquam sint nobis labore quibusdam.
Lorem ipsum dolor sit amet consectetur adipisicing elit. Error repudiandae numquam sint nobis labore quibusdam.
Исходный код для примера выше:
<Text className="subtitle" color="#444444">Lorem ipsum dolor...</Text>
<Text color="#888888">Lorem ipsum dolor...</Text>
Параметры:
color string
Цвет текста в компоненте.
Поддерживаются любые валидные значения CSS (Например: #0000FF
, var(--blue)
или magenta
)
Значение по умолчанию: black
opacity string
Прозрачность текста в компоненте.
Поддерживаются любые валидные значения CSS (Например: 0.1
или 80%
)
Значение по умолчанию: 1
margin object
Объект, описывающий отступы компонента. Имеет следующие свойства:
x
– отступ по горизонтали
y
– отступ по вертикали
top
– отступ сверху
bottom
– отступ снизу
left
– отступ слева
right
– отступ справа
Все значения могут иметь один из двух типов: string
или number
В случае, если значение одного из свойств имеет тип number
, ему будет добавлена единица измерения em
Пример: margin={{ top: 1, x: 'auto' }}
будет преобразовано в margin: 1em auto 0
inline boolean
Если этот параметр установлен (имеет значение true
), то к компоненту будет применено свойство display: inline-block
Иначе – display: block
Значение по умолчанию: false
align enum
Выравнивание текста внутри компонента
Поддерживаются 5 значений: unset
, initial
, left
, center
и right
Значение по умолчанию: unset
node HTMLElement
Параметр для связки с HTML-элементом, который лежит в основе компонента
(аналог стандартного bind:this
)
id string
Аналог стандартного атрибута id
className string
Аналог стандартного атрибута class