chore(material): update readme

packages/material/README.md

@@ -31,7 +31,7 @@ and then import it in your project styles:
 
 ```scss
 // Import the entire theme
-@import "~@progress/kendo-theme-material/dist/all.scss";
+@use "@progress/kendo-theme-material/scss/all.scss" as *;
 ```
 
 For more information on how to implement the Material theme in your project, refer to the following articles:
@@ -46,12 +46,14 @@ You can customize Kendo UI Material Theme both in terms of what gets compiled an
 
 ### Importing
 
-In your custom scss file, you can import the entirety of the theme, by importing `dist/all.scss` or pick just the styles for the components you need. The files for individual components are in `scss/` folder:
+In your custom scss file, you can import the entirety of the theme, by importing `scss/all.scss` or pick just the styles for the components you need. The files for individual components:
 
 ```scss
-// Import only PanelBar and Grid styles
-@import "~@progress/kendo-theme-material/scss/panelbar/_index.scss";
-@import "~@progress/kendo-theme-material/scss/grid/_index.scss";
+// Import only Button and Grid styles
+@use "@progress/kendo-theme-material/scss/index.scss" as *;
+
+@include kendo-button--styles();
+@include kendo-grid--styles();
 ```
 
 ### SCSS Variables
@@ -62,36 +64,13 @@ Most component variables link to higher abstracted generic variables. For instan
 
 We have more than 2000 variables, so it's hard to list them all. We've tried to make variable names as coherent as possible. For instance, all variables ending in `-bg` control background color; all variables ending in `-text` control text color.
 
-Unique to Material theme is the styling based around the guidelines. As such, unlike the rest of the themes for Kendo UI, the preferred way to customize Material theme is trough high level variables:
-
-```scss
-// High level variables
-$primary-palette-name: blue;
-$secondary-palette-name: pink;
-$theme-type: dark;
-
-// When you are finished with your customization, import the theme
-@import "@progress/kendo-theme-material/dist/all.scss";
-```
-
-Still, if you wanted to, you can customize the theme like the rest:
+Here is a quick example on how to customize:
 
 ```scss
-// Make all inputs components with a different background color
-$input-bg: #f0f0f0;
-
-// Make the border of the grid black and slightly ticker
-$grid-border-width: 2px;
-$grid-border: #000000;
-
-// When you are finished with your customization, import the theme
-@import "@progress/kendo-theme-material/dist/all.scss";
-
-// Note: the variables bellow this point will not take effect,
-// because the theme is already imported
-
-$grid-border: red;
-
+@use "@progress/kendo-theme-material/scss/all.scss" as * with (
+    $kendo-button-bg: #ff0000,
+    $kendo-font-size: 20px
+);
 ```
 
 ## Integrating with third party frameworks