@progress/kendo-theme-material 8.0.0-dev.0 → 8.0.0-dev.10

package/scss/treeview/_variables.scss

@@ -2,19 +2,19 @@
 
 /// The font family of the TreeView.
 /// @group treeview
-$kendo-treeview-font-family: $kendo-font-family !default;
+$kendo-treeview-font-family: var( --kendo-font-family, inherit ) !default;
 /// The font size of the TreeView.
 /// @group treeview
-$kendo-treeview-font-size: $kendo-font-size-lg !default;
+$kendo-treeview-font-size: var( --kendo-font-size-lg, inherit ) !default;
 /// The font size of the small TreeView.
 /// @group treeview
-$kendo-treeview-sm-font-size: $kendo-font-size-md !default;
+$kendo-treeview-sm-font-size: var( --kendo-font-size, inherit ) !default;
 /// The font size of the medium TreeView.
 /// @group treeview
-$kendo-treeview-md-font-size: $kendo-font-size-md !default;
+$kendo-treeview-md-font-size: var( --kendo-font-size, inherit ) !default;
 /// The font size of the large TreeView.
 /// @group treeview
-$kendo-treeview-lg-font-size: $kendo-font-size-lg !default;
+$kendo-treeview-lg-font-size: var( --kendo-font-size-lg, inherit ) !default;
 /// The line height of the TreeView.
 /// @group treeview
 $kendo-treeview-line-height: 1.25 !default;
@@ -33,28 +33,28 @@ $kendo-treeview-indent: 24px !default;
 
 /// The horizontal padding of the TreeView items.
 /// @group treeview
-$kendo-treeview-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-treeview-item-padding-x: k-spacing(4) !default;
 /// The horizontal padding of the small TreeView items.
 /// @group treeview
-$kendo-treeview-sm-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-treeview-sm-item-padding-x: k-spacing(4) !default;
 /// The horizontal padding of the medium TreeView items.
 /// @group treeview
-$kendo-treeview-md-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-treeview-md-item-padding-x: k-spacing(4) !default;
 /// The horizontal padding of the large TreeView items.
 /// @group treeview
-$kendo-treeview-lg-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-treeview-lg-item-padding-x: k-spacing(4) !default;
 /// The vertical padding of the TreeView items.
 /// @group treeview
-$kendo-treeview-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-treeview-item-padding-y: k-spacing(2) !default;
 /// The vertical padding of the small TreeView items.
 /// @group treeview
-$kendo-treeview-sm-item-padding-y: k-map-get( $kendo-spacing, 1.5 ) !default;
+$kendo-treeview-sm-item-padding-y: k-spacing(1.5) !default;
 /// The vertical padding of the medium TreeView items.
 /// @group treeview
-$kendo-treeview-md-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-treeview-md-item-padding-y: k-spacing(2) !default;
 /// The vertical padding of the large TreeView items.
 /// @group treeview
-$kendo-treeview-lg-item-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-treeview-lg-item-padding-y: k-spacing(2) !default;
 /// The border width of the TreeView items.
 /// @group treeview
 $kendo-treeview-item-border-width: 0px !default;
@@ -64,7 +64,7 @@ $kendo-treeview-item-border-radius: null !default;
 
 /// The horizontal padding of the checkbox in the small TreeView.
 /// @group treeview
-$kendo-treeview-sm-checkbox-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
+$kendo-treeview-sm-checkbox-padding-x: k-spacing(1) !default;
 /// The horizontal padding of the checkbox in the medium TreeView.
 /// @group treeview
 $kendo-treeview-md-checkbox-padding-x: $kendo-treeview-sm-checkbox-padding-x !default;
@@ -73,7 +73,7 @@ $kendo-treeview-md-checkbox-padding-x: $kendo-treeview-sm-checkbox-padding-x !de
 $kendo-treeview-lg-checkbox-padding-x: $kendo-treeview-sm-checkbox-padding-x !default;
 /// The vertical padding of the checkbox in the small TreeView.
 /// @group treeview
-$kendo-treeview-sm-checkbox-padding-y: k-map-get( $kendo-spacing, .5 ) !default;
+$kendo-treeview-sm-checkbox-padding-y: k-spacing(0.5) !default;
 /// The vertical padding of the checkbox in the medium TreeView.
 /// @group treeview
 $kendo-treeview-md-checkbox-padding-y: $kendo-treeview-sm-checkbox-padding-y !default;

package/scss/typography/_variables.scss

@@ -2,98 +2,339 @@
 
 
 // Headings
+
+/// The font size of the highest level heading.
+/// @group typography
 $kendo-h1-font-size: 96px !default;
+/// The font size of the second highest level heading.
+/// @group typography
 $kendo-h2-font-size: 60px !default;
+/// The font size of the third highest level heading.
+/// @group typography
 $kendo-h3-font-size: 48px !default;
+/// The font size of the fourth highest level heading.
+/// @group typography
 $kendo-h4-font-size: 34px !default;
+/// The font size of the fifth highest level heading.
+/// @group typography
 $kendo-h5-font-size: 24px !default;
+/// The font size of the sixth highest level heading.
+/// @group typography
 $kendo-h6-font-size: 20px !default;
 
-$kendo-h1-font-family: $kendo-font-family !default;
-$kendo-h2-font-family: $kendo-font-family !default;
-$kendo-h3-font-family: $kendo-font-family !default;
-$kendo-h4-font-family: $kendo-font-family !default;
-$kendo-h5-font-family: $kendo-font-family !default;
-$kendo-h6-font-family: $kendo-font-family !default;
-
-$kendo-h1-line-height: 96px !default;
-$kendo-h2-line-height: 60px !default;
-$kendo-h3-line-height: 50px !default;
-$kendo-h4-line-height: 40px !default;
-$kendo-h5-line-height: 32px !default;
-$kendo-h6-line-height: 32px !default;
-
-$kendo-h1-font-weight: $kendo-font-weight-light !default;
-$kendo-h2-font-weight: $kendo-font-weight-light !default;
-$kendo-h3-font-weight: $kendo-font-weight-normal !default;
-$kendo-h4-font-weight: $kendo-font-weight-normal !default;
-$kendo-h5-font-weight: $kendo-font-weight-normal !default;
-$kendo-h6-font-weight: $kendo-font-weight-medium !default;
-
-$kendo-h1-letter-spacing: -1.5px !default;
-$kendo-h2-letter-spacing: -.5px !default;
-$kendo-h3-letter-spacing: 0px !default;
-$kendo-h4-letter-spacing: .25px !default;
-$kendo-h5-letter-spacing: 0px !default;
-$kendo-h6-letter-spacing: .15px !default;
+/// The font family of the highest level heading.
+/// @group typography
+$kendo-h1-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font family of the second highest level heading.
+/// @group typography
+$kendo-h2-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font family of the third highest level heading.
+/// @group typography
+$kendo-h3-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font family of the fourth highest level heading.
+/// @group typography
+$kendo-h4-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font family of the fifth highest level heading.
+/// @group typography
+$kendo-h5-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font family of the sixth highest level heading.
+/// @group typography
+$kendo-h6-font-family: var( --kendo-font-family, inherit ) !default;
+
+/// The line height of the highest level heading.
+/// @group typography
+$kendo-h1-line-height: 112px !default;
+/// The line height of the second highest level heading.
+/// @group typography
+$kendo-h2-line-height: 72px !default;
+/// The line height of the third highest level heading.
+/// @group typography
+$kendo-h3-line-height: 56px !default;
+/// The line height of the fourth highest level heading.
+/// @group typography
+$kendo-h4-line-height: 36px !default;
+/// The line height of the fifth highest level heading.
+/// @group typography
+$kendo-h5-line-height: 24px !default;
+/// The line height of the sixth highest level heading.
+/// @group typography
+$kendo-h6-line-height: 24px !default;
+
+/// The font weight of the highest level heading.
+/// @group typography
+$kendo-h1-font-weight: var( --kendo-font-weight-light, normal ) !default;
+/// The font weight of the second highest level heading.
+/// @group typography
+$kendo-h2-font-weight: var( --kendo-font-weight-light, normal ) !default;
+/// The font weight of the third highest level heading.
+/// @group typography
+$kendo-h3-font-weight: var( --kendo-font-weight-normal, normal ) !default;
+/// The font weight of the fourth highest level heading.
+/// @group typography
+$kendo-h4-font-weight: var( --kendo-font-weight-normal, normal ) !default;
+/// The font weight of the fifth highest level heading.
+/// @group typography
+$kendo-h5-font-weight: var( --kendo-font-weight-normal, normal ) !default;
+/// The font weight of the sixth highest level heading.
+/// @group typography
+$kendo-h6-font-weight: var( --kendo-font-weight-medium, normal ) !default;
 
+/// The letter spacing of the highest level heading.
+/// @group typography
+$kendo-h1-letter-spacing: var( --kendo-letter-spacing-tighter, normal ) !default;
+/// The letter spacing of the second highest level heading.
+/// @group typography
+$kendo-h2-letter-spacing: var( --kendo-letter-spacing-tight, normal ) !default;
+/// The letter spacing of the third highest level heading.
+/// @group typography
+$kendo-h3-letter-spacing: var( --kendo-letter-spacing-normal, normal ) !default;
+/// The letter spacing of the fourth highest level heading.
+/// @group typography
+$kendo-h4-letter-spacing: var( --kendo-letter-spacing-wider, normal ) !default;
+/// The letter spacing of the fifth highest level heading.
+/// @group typography
+$kendo-h5-letter-spacing: var( --kendo-letter-spacing-normal, normal ) !default;
+/// The letter spacing of the sixth highest level heading.
+/// @group typography
+$kendo-h6-letter-spacing: var( --kendo-letter-spacing-wide, normal ) !default;
+
+
+/// The margin of the highest level heading.
+/// @group typography
 $kendo-h1-margin: 0 0 12px !default;
+/// The margin of the second highest level heading.
+/// @group typography
 $kendo-h2-margin: 0 0 12px !default;
+/// The margin of the third highest level heading.
+/// @group typography
 $kendo-h3-margin: 0 0 12px !default;
+/// The margin of the fourth highest level heading.
+/// @group typography
 $kendo-h4-margin: 0 0 12px !default;
+/// The margin of the fifth highest level heading.
+/// @group typography
 $kendo-h5-margin: 0 0 12px !default;
+/// The margin of the sixth highest level heading.
+/// @group typography
 $kendo-h6-margin: 0 0 12px !default;
 
+/// The headings Map.
+/// @group typography
+$kendo-headings: (
+    h1: (
+        font-size: $kendo-h1-font-size,
+        font-family: $kendo-h1-font-family,
+        line-height: $kendo-h1-line-height,
+        font-weight: $kendo-h1-font-weight,
+        letter-spacing: $kendo-h1-letter-spacing,
+        margin: $kendo-h1-margin
+
+    ),
+    h2: (
+        font-size: $kendo-h2-font-size,
+        font-family: $kendo-h2-font-family,
+        line-height: $kendo-h2-line-height,
+        font-weight: $kendo-h2-font-weight,
+        letter-spacing: $kendo-h2-letter-spacing,
+        margin: $kendo-h2-margin
+    ),
+    h3: (
+        font-size: $kendo-h3-font-size,
+        font-family: $kendo-h3-font-family,
+        line-height: $kendo-h3-line-height,
+        font-weight: $kendo-h3-font-weight,
+        letter-spacing: $kendo-h3-letter-spacing,
+        margin: $kendo-h3-margin
+    ),
+    h4: (
+        font-size: $kendo-h4-font-size,
+        font-family: $kendo-h4-font-family,
+        line-height: $kendo-h4-line-height,
+        font-weight: $kendo-h4-font-weight,
+        letter-spacing: $kendo-h4-letter-spacing,
+        margin: $kendo-h4-margin
+    ),
+    h5: (
+        font-size: $kendo-h5-font-size,
+        font-family: $kendo-h5-font-family,
+        line-height: $kendo-h5-line-height,
+        font-weight: $kendo-h5-font-weight,
+        letter-spacing: $kendo-h5-letter-spacing,
+        margin: $kendo-h5-margin
+    ),
+    h6: (
+        font-size: $kendo-h6-font-size,
+        font-family: $kendo-h6-font-family,
+        line-height: $kendo-h6-line-height,
+        font-weight: $kendo-h6-font-weight,
+        letter-spacing: $kendo-h6-letter-spacing,
+        margin: $kendo-h6-margin
+    ),
+) !default;
+
 
 // Paragraph
+
+/// The margin of the paragraph.
+/// @group typography
 $kendo-paragraph-margin: 0 0 12px !default;
+/// The font size of the paragraph.
+/// @group typography
 $kendo-paragraph-font-size: 1rem !default;
-$kendo-paragraph-font-family: $kendo-font-family !default;
-$kendo-paragraph-line-height: $kendo-line-height-lg !default;
-$kendo-paragraph-font-weight: $kendo-font-weight-normal !default;
+/// The font family of the paragraph.
+/// @group typography
+$kendo-paragraph-font-family: var( --kendo-font-family, inherit ) !default;
+/// The line height of the paragraph.
+///  @group typography
+$kendo-paragraph-line-height: var( --kendo-line-height-lg, normal ) !default;
+/// The font weight of the paragraph.
+/// @group typography
+$kendo-paragraph-font-weight: var( --kendo-font-weight-normal, normal ) !default;
+/// The letter spacing of the paragraph.
+/// @group typography
 $kendo-paragraph-letter-spacing: .0313em !default;
 
 
 // Code
-$kendo-code-font-size: $kendo-font-size-md !default;
-$kendo-code-font-family: $kendo-font-family-monospace !default;
-$kendo-code-line-height: $kendo-line-height-md !default;
-$kendo-code-font-weight: $kendo-font-weight-normal !default;
+
+/// The font size of the code tag.
+/// @group typography
+$kendo-code-font-size: var( --kendo-font-size, inherit ) !default;
+/// The font family of the code tag.
+/// @group typography
+$kendo-code-font-family: var( --kendo-font-family-monospace, normal ) !default;
+/// The line height of the code tag.
+/// @group typography
+$kendo-code-line-height: var( --kendo-line-height, normal ) !default;
+/// The font weight of the code tag.
+/// @group typography
+$kendo-code-font-weight: var( --kendo-font-weight-normal, normal ) !default;
+/// The letter spacing of the code tag.
+/// @group typography
 $kendo-code-letter-spacing: null !default;
 
-$kendo-code-padding-x: 4px !default;
-$kendo-code-padding-y: 0px !default;
-$kendo-pre-padding-x: 24px !default;
-$kendo-pre-padding-y: 16px !default;
+/// The horizontal padding of the code tag.
+/// @group typography
+$kendo-code-padding-x: k-spacing(1) !default;
+/// The vertical padding of the code tag.
+/// @group typography
+$kendo-code-padding-y: k-spacing(0) !default;
+/// The horizontal padding of the preformatted text.
+/// @group typography
+$kendo-pre-padding-x: k-spacing(6) !default;
+/// The vertical padding of the preformatted text.
+/// @group typography
+$kendo-pre-padding-y: k-spacing(4) !default;
+/// The border width of the code tag.
+/// @group typography
 $kendo-code-border-width: 1px !default;
 
+/// The background color of the code tag.
+/// @group typography
 $kendo-code-bg: $kendo-base-bg !default;
+/// The text color of the code tag.
+/// @group typography
 $kendo-code-text: $kendo-component-text !default;
+/// The border color of the code tag.
+/// @group typography
 $kendo-code-border: $kendo-component-border !default;
 
-
 // Display
-$kendo-display1-font-size: 112px !default;
-$kendo-display2-font-size: 56px !default;
-$kendo-display3-font-size: 45px !default;
-$kendo-display4-font-size: 34px !default;
 
-$kendo-display1-font-family: $kendo-font-family !default;
-$kendo-display2-font-family: $kendo-font-family !default;
-$kendo-display3-font-family: $kendo-font-family !default;
-$kendo-display4-font-family: $kendo-font-family !default;
+/// The font size of the largest display text.
+/// @group typography
+$kendo-display1-font-size: calc( var( --kendo-font-size, .875rem ) * 9.5 ) !default;
+/// The font size of the second largest display text.
+/// @group typography
+$kendo-display2-font-size: calc( var( --kendo-font-size, .875rem ) * 8.75 ) !default;
+/// The font size of the third largest display text.
+/// @group typography
+$kendo-display3-font-size: calc( var( --kendo-font-size, .875rem ) * 8 ) !default;
+/// The font size of the fourth largest display text.
+/// @group typography
+$kendo-display4-font-size: calc( var( --kendo-font-size, .875rem ) * 7.25 ) !default;
+
+/// The font family of the largest display text.
+/// @group typography
+$kendo-display1-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font family of the second largest display text.
+/// @group typography
+$kendo-display2-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font family of the third largest display text.
+/// @group typography
+$kendo-display3-font-family: var( --kendo-font-family, inherit ) !default;
+/// The font family of the fourth largest display text.
+/// @group typography
+$kendo-display4-font-family: var( --kendo-font-family, inherit ) !default;
 
+/// The line height of the largest display text.
+/// @group typography
 $kendo-display1-line-height: 1.2 !default;
+/// The line height of the second largest display text.
+/// @group typography
 $kendo-display2-line-height: 1.2 !default;
+/// The line height of the third largest display text.
+/// @group typography
 $kendo-display3-line-height: 1.2 !default;
+/// The line height of the fourth largest display text.
+/// @group typography
 $kendo-display4-line-height: 1.2 !default;
 
-$kendo-display1-font-weight: $kendo-font-weight-light !default;
-$kendo-display2-font-weight: $kendo-font-weight-normal !default;
-$kendo-display3-font-weight: $kendo-font-weight-normal !default;
-$kendo-display4-font-weight: $kendo-font-weight-normal !default;
+/// The font weight of the largest display text.
+/// @group typography
+$kendo-display1-font-weight: var( --kendo-font-weight-light, normal ) !default;
+/// The font weight of the second largest display text.
+/// @group typography
+$kendo-display2-font-weight: var( --kendo-font-weight-light, normal ) !default;
+/// The font weight of the third largest display text.
+/// @group typography
+$kendo-display3-font-weight: var( --kendo-font-weight-light, normal ) !default;
+/// The font weight of the fourth largest display text.
+/// @group typography
+$kendo-display4-font-weight: var( --kendo-font-weight-light, normal ) !default;
+
+/// The letter spacing of the largest display text.
+/// @group typography
+$kendo-display1-letter-spacing: var( --kendo-letter-spacing-tighter, normal ) !default;
+/// The letter spacing of the second largest display text.
+/// @group typography
+$kendo-display2-letter-spacing: var( --kendo-letter-spacing-tighter, normal ) !default;
+/// The letter spacing of the third largest display text.
+/// @group typography
+$kendo-display3-letter-spacing: var( --kendo-letter-spacing-tighter, normal ) !default;
+/// The letter spacing of the fourth largest display text.
+/// @group typography
+$kendo-display4-letter-spacing: var( --kendo-letter-spacing-tighter, normal ) !default;
 
-$kendo-display1-letter-spacing: null !default;
-$kendo-display2-letter-spacing: null !default;
-$kendo-display3-letter-spacing: null !default;
-$kendo-display4-letter-spacing: null !default;
+/// The displays Map.
+/// @group typography
+$kendo-display: (
+    1: (
+        font-size: $kendo-display1-font-size,
+        font-family: $kendo-display1-font-family,
+        line-height: $kendo-display1-line-height,
+        font-weight: $kendo-display1-font-weight,
+        letter-spacing: $kendo-display1-letter-spacing
+    ),
+    2: (
+        font-size: $kendo-display2-font-size,
+        font-family: $kendo-display2-font-family,
+        line-height: $kendo-display2-line-height,
+        font-weight: $kendo-display2-font-weight,
+        letter-spacing: $kendo-display2-letter-spacing
+    ),
+    3: (
+        font-size: $kendo-display3-font-size,
+        font-family: $kendo-display3-font-family,
+        line-height: $kendo-display3-line-height,
+        font-weight: $kendo-display3-font-weight,
+        letter-spacing: $kendo-display3-letter-spacing
+    ),
+    4: (
+        font-size: $kendo-display4-font-size,
+        font-family: $kendo-display4-font-family,
+        line-height: $kendo-display4-line-height,
+        font-weight: $kendo-display4-font-weight,
+        letter-spacing: $kendo-display4-letter-spacing
+    ),
+) !default;

package/scss/upload/_variables.scss

@@ -5,10 +5,10 @@
 $kendo-upload-border-width: 1px !default;
 /// The font family of the Upload.
 /// @group upload
-$kendo-upload-font-family: $kendo-font-family !default;
+$kendo-upload-font-family: var( --kendo-font-family, inherit ) !default;
 /// The font size of the Upload.
 /// @group upload
-$kendo-upload-font-size: $kendo-font-size-md !default;
+$kendo-upload-font-size: var( --kendo-font-size, inherit ) !default;
 /// The line height of the Upload.
 /// @group upload
 $kendo-upload-line-height: k-math-div( 20, 14 ) !default;
@@ -28,10 +28,10 @@ $kendo-upload-border: $kendo-component-border !default;
 
 /// The horizontal padding of the Upload dropzone.
 /// @group upload
-$kendo-upload-dropzone-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-upload-dropzone-padding-x: k-spacing(2) !default;
 /// The vertical padding of the Upload dropzone.
 /// @group upload
-$kendo-upload-dropzone-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
+$kendo-upload-dropzone-padding-y: k-spacing(2) !default;
 /// The text color of the Upload dropzone.
 /// @group upload
 $kendo-upload-dropzone-text: $kendo-component-header-text !default;
@@ -54,14 +54,14 @@ $kendo-upload-status-text-opacity: null !default;
 
 /// The horizontal padding of an uploaded item.
 /// @group upload
-$kendo-upload-item-padding-x: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-upload-item-padding-x: k-spacing(4) !default;
 /// The vertical padding of an uploaded item.
 /// @group upload
-$kendo-upload-item-padding-y: k-map-get( $kendo-spacing, 4 ) !default;
+$kendo-upload-item-padding-y: k-spacing(4) !default;
 
 /// The vertical spacing between uploaded batch items.
 /// @group upload
-$kendo-upload-multiple-items-spacing: 12px !default;
+$kendo-upload-multiple-items-spacing: k-spacing(3) !default;
 
 /// The font size of the Upload validation message.
 /// @group upload

package/scss/window/_variables.scss

@@ -10,20 +10,20 @@ $kendo-window-border-width: 0px !default;
 $kendo-window-border-radius: 4px !default;
 /// The font family of the Window.
 /// @group window
-$kendo-window-font-family: $kendo-font-family !default;
+$kendo-window-font-family: var( --kendo-font-family, inherit ) !default;
 /// The font size of the Window.
 /// @group window
-$kendo-window-font-size: $kendo-font-size-md !default;
+$kendo-window-font-size: var( --kendo-font-size, inherit ) !default;
 /// The line height of the Window.
 /// @group window
 $kendo-window-line-height: 1.5 !default;
 
 /// The horizontal padding of the Window titlebar.
 /// @group window
-$kendo-window-titlebar-padding-x: 24px !default;
+$kendo-window-titlebar-padding-x: k-spacing(6) !default;
 /// The vertical padding of the Window titlebar.
 /// @group window
-$kendo-window-titlebar-padding-y: 16px !default;
+$kendo-window-titlebar-padding-y: k-spacing(4) !default;
 /// The width of the border of the Window titlebar.
 /// @group window
 $kendo-window-titlebar-border-width: 0px !default;
@@ -50,10 +50,10 @@ $kendo-window-action-hover-opacity: null !default;
 
 /// The horizontal padding of the content of the Window.
 /// @group window
-$kendo-window-inner-padding-x: 24px !default;
+$kendo-window-inner-padding-x: k-spacing(6) !default;
 /// The vertical padding of the content of the Window.
 /// @group window
-$kendo-window-inner-padding-y: 8px !default;
+$kendo-window-inner-padding-y: k-spacing(2) !default;
 
 /// The horizontal padding of the Window action buttons.
 /// @group window

package/scss/wizard/_variables.scss

@@ -2,32 +2,32 @@
 
 /// The horizontal padding of the Wizard.
 /// @group wizard
-$kendo-wizard-padding-x: $kendo-padding-md-x * 1.25 !default;
+$kendo-wizard-padding-x: calc( #{$kendo-padding-md-x} * 1.25 ) !default;
 /// The vertical padding of the Wizard.
 /// @group wizard
 $kendo-wizard-padding-y: $kendo-wizard-padding-x !default;
 /// The horizontal padding of the Wizard content.
 /// @group wizard
-$kendo-wizard-content-padding-x: $kendo-padding-md-x * 2 !default;
+$kendo-wizard-content-padding-x: calc( #{$kendo-padding-md-x} * 2 ) !default;
 /// The vertical padding of the Wizard content.
 /// @group wizard
-$kendo-wizard-content-padding-y: $kendo-padding-md-y * 8 !default;
+$kendo-wizard-content-padding-y: calc( #{$kendo-padding-md-y} * 8 ) !default;
 /// The horizontal margin of the Wizard's Button container.
 /// @group wizard
-$kendo-wizard-buttons-margin-x: 10px !default;
+$kendo-wizard-buttons-margin-x: k-spacing(2.5) !default;
 
 /// The border width of the Wizard.
 /// @group wizard
 $kendo-wizard-border-width: 0px !default;
 /// The font size of the Wizard.
 /// @group wizard
-$kendo-wizard-font-size: $kendo-font-size-md !default;
+$kendo-wizard-font-size: var( --kendo-font-size, inherit ) !default;
 /// The line height of the Wizard.
 /// @group wizard
-$kendo-wizard-line-height: $kendo-line-height-md !default;
+$kendo-wizard-line-height: var( --kendo-line-height, normal ) !default;
 /// The font family of the Wizard.
 /// @group wizard
-$kendo-wizard-font-family: $kendo-font-family !default;
+$kendo-wizard-font-family: var( --kendo-font-family, inherit ) !default;
 
 /// The outline of the focused Wizard step.
 /// @group wizard