Interactivity

Atomic interactivity classes allow you to quickly change an element's interactivity.

Pointer events

The pointer-events CSS property enables or disables all mouse events on an element.

Class	Output	Definition
`.pe-auto`	`pointer-events: auto;`	The element behaves as it would if the pointer-events property were not specified.
`.pe-none`	`pointer-events: none;`	Disables mouse events (clicking, dragging, hovering, etc.) on the element and its decendents.

The user-select CSS property controls whether the user can select text.

Class	Output	Definition
`.us-auto`	`user-select: auto;`	The element behaves as it would if the user-select property were not specified.
`.us-none`	`user-select: none;`	The text of the element and its sub-elements is not selectable. It may be appropriate to combine with `.c-default`

The user-drag CSS property controls whether an element can be dragged.

Class	Output	Definition
`.ud-auto`	`user-drag: auto;`	The element behaves as it would if the user-drag property were not specified.
`.ud-none`	`user-drag: none;`	The element and its sub-elements are not draggable. When applied to an image, the ghosted image will not appear in a loaded mouse cursor.