toggleLabel

ToggleLabel

Тоггл-лейбл с указанным свойством, который может быть включен или выключен. свойство - labelText используется в массиве. Например избранные названия , выборка свойств стилей и тд

Props

Props

selected

boolean

label

string (labelText)

There are no rows in this table

⁠

анимация

// On click // Change to: "selected=on"; // Animate: Dissolve; // Spring: { mass: 1, stiffness: 100, damping: 15 };

layout

display: inline-flex; padding: 0.375rem 0.5rem; align-items: center; gap: 0.5rem;

style

selected off

border-radius: 0.5rem; background: colors/common/blue/50;

selected on

border-radius: 0.5rem; background: var(--colors-base-primary-300, #7D96CF);

typography off

color: var(--colors-base-default-900, #4B4D84);

/* text-xs/leading-4/font-medium */ font-family: Inter; font-size: 0.75rem; font-style: normal; font-weight: 500; line-height: 1rem; /* 133.333% */

typography on color: var(--colors-base-secondary-foreground, #FFF);

/* text-xs/leading-4/font-medium */ font-family: Inter; font-size: 0.75rem; font-style: normal; font-weight: 500; line-height: 1rem; /* 133.333% */

content =labelText

Load content from whimsical.com?

Loading external content may reveal information to 3rd parties. Learn more

Allow

Want to print your doc?
This is not the way.

Try clicking the ⋯ next to your doc name or using a keyboard shortcut (

CtrlP

) instead.