Customizing Draggable

Variables

The following table lists the available variables for customization.

NameTypeDefault valueComputed value
$kendo-drag-clue-border-radiusvar( --kendo-border-radius-md, #{$kendo-border-radius-md} )
Description
Borer radius of the drag clue.
$kendo-drag-clue-border-width0px
Description
Borer width of the drag clue.
$kendo-drag-clue-border-stylesolid
Description
Borer style of the drag clue.
$kendo-drag-clue-padding-x$kendo-padding-lg-x
Description
Horizontal padding of the drag clue.
$kendo-drag-clue-padding-y$kendo-padding-lg-y
Description
Vertical padding of the drag clue.
$kendo-drag-clue-font-familyvar( --kendo-font-family, inherit )
Description
Font family of the drag clue.
$kendo-drag-clue-font-sizevar( --kendo-font-size, inherit )
Description
Font size of the drag clue.
$kendo-drag-clue-line-heightvar( --kendo-line-height, inherit )
Description
Line height of the drag clue.
$kendo-drag-clue-spacing.4ex
Description
Spacing of the drag clue.
$kendo-drag-clue-opacity.8
Description
Opacity of the drag clue.
$kendo-drag-clue-textvar( --kendo-selected-text, inherit )
Description
Text color of the drag clue.
$kendo-drag-clue-bgvar( --kendo-selected-bg, inherit )
Description
Background color of the drag clue.
$kendo-drag-clue-bordervar( --kendo-selected-border, inherit )
Description
Border color of the drag clue.
$kendo-drag-clue-gradientnull
Description
Gradient of the drag clue.
$kendo-drag-clue-shadowvar( --kendo-box-shadow-depth-2, none )
Description
Box shadow of the drag clue.
$kendo-drop-hint-arrow-size6px
Description
Arrow size of the drop hint.
$kendo-drop-hint-arrow-spacingmath.div( $kendo-drop-hint-arrow-size, 2 )
Description
Arrow spacing of the drop hint.
$kendo-drop-hint-line-h-width20px
Description
Width of the horizontal drop hint line.
$kendo-drop-hint-line-h-height1px
Description
Height of the horizontal drop hint line.
$kendo-drop-hint-line-v-width$kendo-drop-hint-line-h-height
Description
Width of the vertical drop hint line.
$kendo-drop-hint-line-v-height$kendo-drop-hint-line-h-width
Description
Height of the vertical drop hint line.
$kendo-drop-hint-bgif($kendo-enable-color-system, k-color( primary ), k-get-theme-color-var( primary-100 ))
Description
Background-color of the drop hint.

In this article

Not finding the help you need?