УрФУ

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


Поддерживаемые события:

on:click