Customizing FileManager

Variables

The following table lists the available variables for customization.

NameTypeDefault valueComputed value
$kendo-file-manager-spacerStringk-spacing(4)var(--kendo-spacing-4, 1rem)
Description
The space between the FileManager items.
$kendo-file-manager-border-widthNumber1px1px
Description
The border width of the FileManager.
$kendo-file-manager-font-familyStringvar( --kendo-font-family, inherit )var(--kendo-font-family, inherit)
Description
The font family of the FileManager.
$kendo-file-manager-font-sizeStringvar( --kendo-font-size, inherit )var(--kendo-font-size, inherit)
Description
The font size of the FileManager.
$kendo-file-manager-line-heightStringvar( --kendo-line-height, normal )var(--kendo-line-height, normal)
Description
The line height of the FileManager.
$kendo-file-manager-bgString$kendo-component-bgvar(--kendo-color-surface-alt, #ffffff)
Description
The background color of the FileManager.
$kendo-file-manager-textString$kendo-component-textvar(--kendo-color-on-app-surface, #3d3d3d)
Description
The text color of the FileManager.
$kendo-file-manager-borderString$kendo-component-bordervar(--kendo-color-border, rgba(0, 0, 0, 0.08))
Description
The border color of the FileManager.
$kendo-file-manager-toolbar-border-widthNumber$kendo-file-manager-border-width1px
Description
The border width of the FileManager Toolbar.
$kendo-file-manager-toolbar-bgNullnullnull
Description
The background color of the FileManager Toolbar.
$kendo-file-manager-toolbar-textNullnullnull
Description
The text color of the FileManager Toolbar.
$kendo-file-manager-toolbar-borderNullnullnull
Description
The border color of the FileManager Toolbar.
$kendo-file-manager-toolbar-gradientNullnullnull
Description
The gradient of the FileManager Toolbar.
$kendo-file-manager-navigation-padding-xString$kendo-file-manager-spacervar(--kendo-spacing-4, 1rem)
Description
The horizontal padding of the FileManager Navigation.
$kendo-file-manager-navigation-padding-yString$kendo-file-manager-spacervar(--kendo-spacing-4, 1rem)
Description
The vertical padding of the FileManager Navigation.
$kendo-file-manager-navigation-widthNumber20%20%
Description
The width of the FileManager Navigation.
$kendo-file-manager-navigation-border-widthNumber$kendo-file-manager-border-width1px
Description
The border width of the FileManager Navigation.
$kendo-file-manager-navigation-bgNullnullnull
Description
The background color of the FileManager Navigation.
$kendo-file-manager-navigation-textNullnullnull
Description
The text color of the FileManager Navigation.
$kendo-file-manager-navigation-borderNullnullnull
Description
The border color of the FileManager Navigation.
$kendo-file-manager-breadcrumb-padding-xStringk-spacing(2)var(--kendo-spacing-2, 0.5rem)
Description
The horizontal padding of the FileManager Breadcrumb.
$kendo-file-manager-breadcrumb-padding-yStringk-spacing(2)var(--kendo-spacing-2, 0.5rem)
Description
The vertical padding of the FileManager Breadcrumb.
$kendo-file-manager-breadcrumb-border-widthNumber$kendo-file-manager-border-width1px
Description
The border width of the FileManager Breadcrumb.
$kendo-file-manager-breadcrumb-bgString$kendo-toolbar-bgvar(--kendo-color-surface, #fafafa)
Description
The background color of the FileManager Breadcrumb.
$kendo-file-manager-breadcrumb-textNullnullnull
Description
The text color of the FileManager Breadcrumb.
$kendo-file-manager-breadcrumb-borderNullnullnull
Description
The border color of the FileManager Breadcrumb.
$kendo-file-manager-listview-bgNullnullnull
Description
The background color of the FileManager ListView.
$kendo-file-manager-listview-textNullnullnull
Description
The text color of the FileManager ListView.
$kendo-file-manager-listview-borderNullnullnull
Description
The border color of the FileManager ListView.
$kendo-file-manager-listview-item-padding-xStringk-spacing(4)var(--kendo-spacing-4, 1rem)
Description
The horizontal padding of the FileManager ListView item.
$kendo-file-manager-listview-item-padding-yStringk-spacing(4)var(--kendo-spacing-4, 1rem)
Description
The vertical padding of the FileManager ListView item.
$kendo-file-manager-listview-item-widthNumber120px120px
Description
The width of the FileManager ListView item.
$kendo-file-manager-listview-item-heightNumber120px120px
Description
The height of the FileManager ListView item.
$kendo-file-manager-listview-item-bgNullnullnull
Description
The background color of the FileManager ListView item.
$kendo-file-manager-listview-item-textNullnullnull
Description
The text color of the FileManager ListView item.
$kendo-file-manager-listview-item-borderNullnullnull
Description
The border color of the FileManager ListView item.
$kendo-file-manager-listview-item-icon-bgNullnullnull
Description
The background color of the FileManager ListView item icon.
$kendo-file-manager-listview-item-icon-textStringif($kendo-enable-color-system, k-color( subtle ), k-try-tint($kendo-file-manager-text, 4))var(--kendo-color-subtle, #666666)
Description
The text color of the FileManager ListView item icon.
$kendo-file-manager-listview-item-icon-borderNullnullnull
Description
The border color of the FileManager ListView item icon.
$kendo-file-manager-listview-item-icon-selected-bgNullnullnull
Description
Background color of the FileManager selected ListView item icon.
$kendo-file-manager-listview-item-icon-selected-textStringinheritinherit
Description
Text color of the FileManager selected ListView item icon.
$kendo-file-manager-listview-item-icon-selected-borderNullnullnull
Description
Border color of the FileManager selected ListView item icon.
$kendo-file-manager-grid-bgNullnullnull
Description
The background color of the FileManager Grid.
$kendo-file-manager-grid-textNullnullnull
Description
The text color of the FileManager Grid.
$kendo-file-manager-grid-borderNullnullnull
Description
The border color of the FileManager Grid.
$kendo-file-manager-preview-padding-xString$kendo-file-manager-spacervar(--kendo-spacing-4, 1rem)
Description
The horizontal padding of the FileManager preview.
$kendo-file-manager-preview-padding-yString$kendo-file-manager-spacervar(--kendo-spacing-4, 1rem)
Description
The vertical padding of the FileManager preview.
$kendo-file-manager-preview-widthNumber20%20%
Description
The width of the FileManager preview.
$kendo-file-manager-preview-border-widthNumber$kendo-file-manager-border-width1px
Description
The border width of the FileManager preview.
$kendo-file-manager-preview-spacingString$kendo-file-manager-spacervar(--kendo-spacing-4, 1rem)
Description
The spacing of the FileManager preview.
$kendo-file-manager-preview-column-gapStringk-spacing(1)var(--kendo-spacing-1, 0.25rem)
Description
The gap between the columns in the FileManager preview.
$kendo-file-manager-preview-bgNullnullnull
Description
The background color of the FileManager preview.
$kendo-file-manager-preview-textNullnullnull
Description
The text color of the FileManager preview.
$kendo-file-manager-preview-borderNullnullnull
Description
The border color of the FileManager preview.
$kendo-file-manager-preview-icon-bgNullnullnull
Description
The background color of the FileManager preview icon.
$kendo-file-manager-preview-icon-textStringif($kendo-enable-color-system, k-color( subtle ), k-try-tint($kendo-file-manager-text, 4))var(--kendo-color-subtle, #666666)
Description
The text color of the FileManager preview icon.
$kendo-file-manager-preview-icon-borderNullnullnull
Description
The border color of the FileManager preview icon.

In this article

Not finding the help you need?