Comet Border
Комета бежит по краю кнопки или карточки, оставляя гаснущий хвост и, по желанию, свечение.
зависимости 0файлы tsx + cssпараметры 9react 18+
X 0000 Y 0000
Пульт09 параметров
01children
Содержимое.
02color
Цвет кометы.
03speed
s
Секунд на круг.
04thickness
px
Толщина рамки.
05tail
deg
Длина хвоста.
06radius
px
Скругление углов.
07fill
Цвет внутренней поверхности.
08glow
Мягкое свечение за рамкой.
09twin
Вторая комета с противоположной стороны.
01 Пропсы
| Проп | Тип | По умолчанию | Описание |
|---|---|---|---|
children | string | "Начать запись" | Содержимое. |
color | string | "#b6e24c" | Цвет кометы. |
speed | number | 3 | Секунд на круг. |
thickness | number | 1.5 | Толщина рамки. |
tail | number | 110 | Длина хвоста. |
radius | number | 14 | Скругление углов. |
fill | string | "#0e0e0d" | Цвет внутренней поверхности. |
glow | boolean | true | Мягкое свечение за рамкой. |
twin | boolean | false | Вторая комета с противоположной стороны. |
as | ElementType | 'button' | Какой элемент рендерить; остальные пропсы передаются ему. |
className | string | — | Передаётся корневому элементу. |
style | CSSProperties | — | Передаётся корневому элементу. |