UNPKG

@telerik/kendo-theme-default

Version:

SASS resources for the default Kendo UI theme

30 lines (15 loc) 1.8 kB
# Default theme for Kendo UI A SCSS-based theme for Kendo UI components. Currently available for **Kendo UI for React** and **Kendo UI for Angular 2**. ## Usage ### As a pre-built theme Clone the repo and build it via `npm run build`. This will output CSS files in the `dist/` folder. The file `dist/packages/all.css` will contain the complete theme, which can be used in your project. ### Via webpack The `webpackThemeConfig` function from the [@telerik/kendo-common-tasks module](https://github.com/telerik/kendo-common-tasks) embeds the recommended theme configuration options in a given webpack config. See a preconfigured [webpack.config.js for React](examples/react/webpack.config.js). ### With Kendo UI jQuery Use with the jQuery widgets is currently **not supported**, as this theme is focused on the React / Angular 2 offering, and requires changes in order to work with the jQuery widgets. ## Customization The theme can be customized in one swoop via the colors defined in the [`styles/_variables.scss` file](styles/_variables.scss). Any change in this file is propagated to every component. To style specific components, use the variables used in their specific scss file. ## Development Styles are split into components, and dependencies are managed by the [`import-once` mixin](styles/mixins/_import-once.scss). Styles must be defined within an `import-once` block, so that they are bundled once when required from multiple files. During development, the SCSS files are linted on every `commit` and built at `push`. The theme package can be tested against a component by linking the theme in the components package. Class names are prefixed with `k-` during builds. Browser-specific properties are generated via [PostCSS autoprefixer](https://github.com/postcss/autoprefixer).