Skip to main content
VelinStyle v0.8.0
⌂ Home
  1. Docs
  2. Utilities
  3. Interactions

Interactions

Control how users interact with elements — cursor style, pointer events, text selection, and touch actions.

Cursor

<div class="velin-cursor-auto">Auto cursor</div>
<div class="velin-cursor-pointer">Pointer cursor</div>
<div class="velin-cursor-wait">Wait cursor</div>
<div class="velin-cursor-text">Text cursor</div>
<div class="velin-cursor-move">Move cursor</div>
<div class="velin-cursor-not-allowed">Not allowed cursor</div>
<div class="velin-cursor-grab">Grab cursor</div>
<div class="velin-cursor-grabbing">Grabbing cursor</div>

Pointer Events

<a class="velin-pe-none" href="#">This link is not clickable</a>
<a class="velin-pe-auto" href="#">This link is clickable (default)</a>

User Select

<p class="velin-user-select-all">Click to select all text at once.</p>
<p class="velin-user-select-auto">Default selection behavior.</p>
<p class="velin-user-select-none">This text cannot be selected.</p>

Touch Action

<div class="velin-touch-action-none">Disable all gestures</div>
<div class="velin-touch-action-auto">Default touch handling</div>
<div class="velin-touch-action-pan-x">Horizontal pan only</div>
<div class="velin-touch-action-pan-y">Vertical pan only</div>
<div class="velin-touch-action-manipulation">Pan + pinch zoom only</div>

Theme wählen