Skip to content

Documentation

Iliana Nikolova edited this page Sep 14, 2023 · 1 revision

Document Variables for Public Use

To document a variable, use triple-slash comments (///) before its definition. This marks it as a public variable and lists it in the customization help topic. All variables should have $kendo- prefix to avoid conflicts with other libraries.

/// Variable description
$kendo-foo: 42px !default;

The available variables for customizing each theme are listed in the article on customization for each theme (docs/customization.md) The file is generated from the SCSS source files by running the npm run docs command.

Notes: variables should be grouped by element/selector in top-to-bottom visual appearance order, starting from the variables used in the _layout.scss file, followed by the ones in the _theme.scss file, e.g:

// Toolbar main element vars
// Layout vars
$kendo-toolbar-padding-x: 8px !default;
$kendo-toolbar-padding-y: 4px !default;
// Theme vars
$kendo-toolbar-bg: #f6f6f6 !default
$kendo-toolbar-text: #656565 !default