Customizing Tilelayout

Variables

The following table lists the available variables for customization.

NameTypeDefault valueComputed value
$kendo-tile-layout-border-widthNumber0px0px
Description
The width of the border around the TileLayout.
$kendo-tile-layout-bgColor$gray-100#f8f9fa
Description
The background color of the TileLayout.
$kendo-tile-layout-padding-xStringk-spacing(4)var(--kendo-spacing-4, 1rem)
Description
The horizontal padding of the TileLayout.
$kendo-tile-layout-padding-yString$kendo-tile-layout-padding-xvar(--kendo-spacing-4, 1rem)
Description
The vertical padding of the TileLayout
$kendo-tile-layout-card-border-widthNumber$kendo-card-border-width1px
Description
The width of the border around the TileLayout card.
$kendo-tile-layout-card-focus-shadowString$kendo-card-focus-shadowvar(--kendo-elevation-3, 0px 4px 10px rgba(0, 0, 0, 0.1))
Description
The focus box shadow of the TileLayout card.
$kendo-tile-layout-hint-border-widthNumber1px1px
Description
The width of the border around the TileLayout hint.
$kendo-tile-layout-hint-border-radiusNumber$kendo-card-border-radius0.375rem
Description
The radius of the border around the TileLayout hint.
$kendo-tile-layout-hint-borderString$kendo-component-bordervar(--kendo-color-border, #dee2e6)
Description
The color of the border around the TileLayout hint.
$kendo-tile-layout-hint-bgColorrgba( white, .2 )rgba(255, 255, 255, 0.2)
Description
The background color of the TileLayout hint.

In this article

Not finding the help you need?