Skip to content

Commit

Permalink
docs: update acc to latest changes
Browse files Browse the repository at this point in the history
  • Loading branch information
dmihaylo authored and tsvetomir committed Jan 18, 2017
1 parent 48b52dd commit 6687fb8
Showing 1 changed file with 11 additions and 15 deletions.
26 changes: 11 additions & 15 deletions docs/styles-and-layout/sass-themes.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: SASS-Based Themes
page_title: SASS-Based Themes | Kendo UI Styles and Appearance
description: "Learn how to define CSS classes in the Kendo UI desktop widgets to change their appearance and further customize their style."
description: "Learn how to apply CSS classes to the Kendo UI desktop widgets to change their appearance and further customize their style."
slug: sassbasedthemes_kendoui
position: 2
---
Expand All @@ -10,23 +10,20 @@ position: 2

As of the R1 2017 release, the Kendo UI distribution includes SASS-based themes.

Currently, Kendo UI delivers a single SASS theme. This is the Kendo UI "Default v2" theme which is a modern update of the Kendo UI Default theme.

The work on revamping the Kendo UI Bootstrap theme has also started and the new theme is soon expected to be available.
Currently, Kendo UI delivers a single SASS theme. This is the **Default v2** theme which is a modern update of the Kendo UI Default theme. The work on revamping the Kendo UI Bootstrap theme has also started and the new theme is soon expected to be available.

## Overview

Apart from being written in a different language, the SASS-based themes demonstrate subtle differences from the LESS-based ones.
This article outlines those differences and shows how you can use the SASS-based themes.
Apart from being written in a different language, the SASS-based themes are slightly different from the LESS-based ones. This article outlines those differences and shows how you can use the SASS-based themes.

## Differences

In Kendo UI, the SASS-based themes demonstrate the following differences from the LESS-based ones:

- Each SASS-based theme is represented by a single CSS file that combines the layout and the themes of the components. As a result, you do not need to match a theme with its common file.
- Based on the widget you work with, the SASS-based themes can build a part of the widget theme in a similar way the Download Builder trims unused scripts.
- The SASS-based themes are available on NPM. Each theme is available as an NPM package and can be easily upgraded.
- Each SASS-based theme is compatible with the [Kendo UI for Angular 2](http://www.telerik.com/kendo-angular-ui/) components. This enables you to port parts of your application to Angular 2 while maintaining their styling.
- The SASS-based themes are available on NPM. Each theme is stored as an NPM package and can be easily upgraded.
- Each SASS-based theme is compatible with the [Kendo UI components for Angular 2](http://www.telerik.com/kendo-angular-ui/). This enables you to port parts of your application to Angular 2 while maintaining their styling.

## Getting the Themes

Expand All @@ -39,17 +36,16 @@ To get the SASS-based Kendo UI themes, you can:

To get a complete theme by using its pre-built CSS files, apply either of the following approaches:

- Use the CSS files that are shipped with the Kendo UI distribution. For example, the "Default v2" theme is distributed as `styles/kendo.default-v2.min.css`.
- Use the NPM package which contains a pre-built `dist/all.css` CSS file for the theme. See below for instructions on how to obtain the NPM package.
- Use the CSS files that are shipped with the Kendo UI distribution. For example, the **Default v2** theme is distributed as `styles/kendo.default-v2.min.css`.
- Use the NPM package which contains a pre-built `dist/all.css` CSS file for the theme. For more information on how to obtain the NPM package, refer to the following section on using NPM packages.

### Using NPM Packages

The SASS-based themes are available as packages on the Progress NPM registry:
The Kendo UI SASS-based themes are located on the Progress NPM registry:

* `@progress/kendo-theme-default` "Default v2"
* **Default v2** theme—Available as @progress/kendo-theme-default.

To access the Progress NPM registry you need an *Telerik account with active commercial license*.
See [Kendo UI Professional - Installation]({% slug kendoui_npm_packages_kendoui_installation %}#kendo-ui-professional) for instructions on how to access the registry.
To access the Progress NPM registry, you need an active Telerik account with an active commercial license. For more information on how to access the NPM registry, refer to the [installation instructions for Kendo UI Professional]({% slug kendoui_npm_packages_kendoui_installation %}#kendo-ui-professional).

## Customizing the Themes

Expand Down Expand Up @@ -82,7 +78,7 @@ To customize a SASS-based theme, create a `.scss` file and consume the theme pac

## Contribution

To contribute to the development of the Kendo UI "Default v2" theme, checkout the [telerik/kendo-theme-default](https://github.com/telerik/kendo-theme-default) GitHub repositiory it is stored in.
To contribute to the development of the Kendo UI **Default v2** theme, check out the [telerik/kendo-theme-default](https://github.com/telerik/kendo-theme-default) GitHub repository it is stored in.

## See Also

Expand Down

0 comments on commit 6687fb8

Please sign in to comment.