@progress/kendo-theme-default 5.12.1-dev.2 → 5.12.1-dev.3

package/scss/typography/_layout.scss

@@ -1,6 +1,6 @@
 @include exports( "typography/layout" ) {
 
-    @if $enable-typography {
+    @if $kendo-enable-typography {
         body { @extend .k-body; }
         h1 { @extend .k-h1; }
         h2 { @extend .k-h2; }
@@ -17,109 +17,109 @@
     .k-body,
     .k-typography {
         @include typography(
-            $font-size,
-            $font-family,
-            $line-height,
-            $font-weight-normal,
-            $letter-spacing
+            $kendo-font-size-md,
+            $kendo-font-family,
+            $kendo-line-height-md,
+            $kendo-font-weight-normal,
+            $kendo-letter-spacing
         );
         margin: 0;
 
         p {
-            margin: $paragraph-margin;
+            margin: $kendo-paragraph-margin;
         }
     }
 
     // Headings
     .k-h1 {
         @include typography(
-            $h1-font-size,
-            $h1-font-family,
-            $h1-line-height,
-            $h1-font-weight,
-            $h1-letter-spacing
+            $kendo-h1-font-size,
+            $kendo-h1-font-family,
+            $kendo-h1-line-height,
+            $kendo-h1-font-weight,
+            $kendo-h1-letter-spacing
         );
-        margin: $h1-margin;
+        margin: $kendo-h1-margin;
     }
     .k-h2 {
         @include typography(
-            $h2-font-size,
-            $h2-font-family,
-            $h2-line-height,
-            $h2-font-weight,
-            $h2-letter-spacing
+            $kendo-h2-font-size,
+            $kendo-h2-font-family,
+            $kendo-h2-line-height,
+            $kendo-h2-font-weight,
+            $kendo-h2-letter-spacing
         );
-        margin: $h2-margin;
+        margin: $kendo-h2-margin;
     }
     .k-h3 {
         @include typography(
-            $h3-font-size,
-            $h3-font-family,
-            $h3-line-height,
-            $h3-font-weight,
-            $h3-letter-spacing
+            $kendo-h3-font-size,
+            $kendo-h3-font-family,
+            $kendo-h3-line-height,
+            $kendo-h3-font-weight,
+            $kendo-h3-letter-spacing
         );
-        margin: $h3-margin;
+        margin: $kendo-h3-margin;
     }
     .k-h4 {
         @include typography(
-            $h4-font-size,
-            $h4-font-family,
-            $h4-line-height,
-            $h4-font-weight,
-            $h4-letter-spacing
+            $kendo-h4-font-size,
+            $kendo-h4-font-family,
+            $kendo-h4-line-height,
+            $kendo-h4-font-weight,
+            $kendo-h4-letter-spacing
         );
-        margin: $h4-margin;
+        margin: $kendo-h4-margin;
     }
     .k-h5 {
         @include typography(
-            $h5-font-size,
-            $h5-font-family,
-            $h5-line-height,
-            $h5-font-weight,
-            $h5-letter-spacing
+            $kendo-h5-font-size,
+            $kendo-h5-font-family,
+            $kendo-h5-line-height,
+            $kendo-h5-font-weight,
+            $kendo-h5-letter-spacing
         );
-        margin: $h5-margin;
+        margin: $kendo-h5-margin;
     }
     .k-h6 {
         @include typography(
-            $h6-font-size,
-            $h6-font-family,
-            $h6-line-height,
-            $h6-font-weight,
-            $h6-letter-spacing
+            $kendo-h6-font-size,
+            $kendo-h6-font-family,
+            $kendo-h6-line-height,
+            $kendo-h6-font-weight,
+            $kendo-h6-letter-spacing
         );
-        margin: $h6-margin;
+        margin: $kendo-h6-margin;
     }
 
     // Paragraph
     .k-paragraph {
         @include typography(
-            $paragraph-font-size,
-            $paragraph-font-family,
-            $paragraph-line-height,
-            $paragraph-font-weight,
-            $paragraph-letter-spacing
+            $kendo-paragraph-font-size,
+            $kendo-paragraph-font-family,
+            $kendo-paragraph-line-height,
+            $kendo-paragraph-font-weight,
+            $kendo-paragraph-letter-spacing
         );
-        margin: $paragraph-margin;
+        margin: $kendo-paragraph-margin;
     }
 
     // Code snippet
     .k-pre,
     .k-code {
         @include typography(
-            $code-font-size,
-            $code-font-family,
-            $code-line-height,
-            $code-font-weight,
-            $code-letter-spacing
+            $kendo-code-font-size,
+            $kendo-code-font-family,
+            $kendo-code-line-height,
+            $kendo-code-font-weight,
+            $kendo-code-letter-spacing
         );
         border-style: solid;
-        border-width: $code-border-width;
+        border-width: $kendo-code-border-width;
     }
 
     .k-pre {
-        padding: $pre-padding-y $pre-padding-x;
+        padding: $kendo-pre-padding-y $kendo-pre-padding-x;
         overflow: auto;
     }
 
@@ -133,44 +133,44 @@
     }
 
     .k-code {
-        padding: $code-padding-y $code-padding-x;
+        padding: $kendo-code-padding-y $kendo-code-padding-x;
     }
 
     // Display
     .k-display-1 {
         @include typography(
-            $display1-font-size,
-            $display1-font-family,
-            $display1-line-height,
-            $display1-font-weight,
-            $display1-letter-spacing
+            $kendo-display1-font-size,
+            $kendo-display1-font-family,
+            $kendo-display1-line-height,
+            $kendo-display1-font-weight,
+            $kendo-display1-letter-spacing
         );
     }
     .k-display-2 {
         @include typography(
-            $display2-font-size,
-            $display2-font-family,
-            $display2-line-height,
-            $display2-font-weight,
-            $display2-letter-spacing
+            $kendo-display2-font-size,
+            $kendo-display2-font-family,
+            $kendo-display2-line-height,
+            $kendo-display2-font-weight,
+            $kendo-display2-letter-spacing
         );
     }
     .k-display-3 {
         @include typography(
-            $display3-font-size,
-            $display3-font-family,
-            $display3-line-height,
-            $display3-font-weight,
-            $display3-letter-spacing
+            $kendo-display3-font-size,
+            $kendo-display3-font-family,
+            $kendo-display3-line-height,
+            $kendo-display3-font-weight,
+            $kendo-display3-letter-spacing
         );
     }
     .k-display-4 {
         @include typography(
-            $display4-font-size,
-            $display4-font-family,
-            $display4-line-height,
-            $display4-font-weight,
-            $display4-letter-spacing
+            $kendo-display4-font-size,
+            $kendo-display4-font-family,
+            $kendo-display4-line-height,
+            $kendo-display4-font-weight,
+            $kendo-display4-letter-spacing
         );
     }
 }

package/scss/typography/_theme.scss

@@ -11,9 +11,9 @@
     .k-pre,
     .k-code {
         @include fill(
-            $code-text,
-            $code-bg,
-            $code-border
+            $kendo-code-text,
+            $kendo-code-bg,
+            $kendo-code-border
         );
     }
 }

package/scss/typography/_variables.scss

@@ -1,107 +1,99 @@
 // Typography
 
-/// Global typography styles for the Kendo Default theme.
-/// @group typography
-$enable-typography: false !default;
-
 
 // Headings
-$h1-font-size: ($font-size * 3) !default;
-$h2-font-size: 34px !default;
-$h3-font-size: ($font-size * 2) !default;
-$h4-font-size: 22px !default;
-$h5-font-size: $font-size-lg !default;
-$h6-font-size: $font-size !default;
-
-$h1-font-family: $font-family !default;
-$h2-font-family: $font-family !default;
-$h3-font-family: $font-family !default;
-$h4-font-family: $font-family !default;
-$h5-font-family: $font-family !default;
-$h6-font-family: $font-family !default;
-
-$h1-line-height: 54px !default;
-$h2-line-height: 46px !default;
-$h3-line-height: 42px !default;
-$h4-line-height: 32px !default;
-$h5-line-height: 26px !default;
-$h6-line-height: 20px !default;
-
-$h1-font-weight: $font-weight-normal !default;
-$h2-font-weight: $font-weight-normal !default;
-$h3-font-weight: $font-weight-normal !default;
-$h4-font-weight: $font-weight-bold !default;
-$h5-font-weight: $font-weight-bold !default;
-$h6-font-weight: $font-weight-bold !default;
-
-$h1-letter-spacing: null !default;
-$h2-letter-spacing: null !default;
-$h3-letter-spacing: null !default;
-$h4-letter-spacing: null !default;
-$h5-letter-spacing: null !default;
-$h6-letter-spacing: null !default;
-
-$h1-margin: 0 0 $font-size !default;
-$h2-margin: 0 0 $font-size !default;
-$h3-margin: 0 0 $font-size !default;
-$h4-margin: 0 0 $font-size !default;
-$h5-margin: 0 0 $font-size !default;
-$h6-margin: 0 0 $font-size !default;
+$kendo-h1-font-size: ($kendo-font-size-md * 3) !default;
+$kendo-h2-font-size: 34px !default;
+$kendo-h3-font-size: ($kendo-font-size-md * 2) !default;
+$kendo-h4-font-size: 22px !default;
+$kendo-h5-font-size: $kendo-font-size-lg !default;
+$kendo-h6-font-size: $kendo-font-size-md !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: 54px !default;
+$kendo-h2-line-height: 46px !default;
+$kendo-h3-line-height: 42px !default;
+$kendo-h4-line-height: 32px !default;
+$kendo-h5-line-height: 26px !default;
+$kendo-h6-line-height: 20px !default;
+
+$kendo-h1-font-weight: $kendo-font-weight-normal !default;
+$kendo-h2-font-weight: $kendo-font-weight-normal !default;
+$kendo-h3-font-weight: $kendo-font-weight-normal !default;
+$kendo-h4-font-weight: $kendo-font-weight-bold !default;
+$kendo-h5-font-weight: $kendo-font-weight-bold !default;
+$kendo-h6-font-weight: $kendo-font-weight-bold !default;
+
+$kendo-h1-letter-spacing: null !default;
+$kendo-h2-letter-spacing: null !default;
+$kendo-h3-letter-spacing: null !default;
+$kendo-h4-letter-spacing: null !default;
+$kendo-h5-letter-spacing: null !default;
+$kendo-h6-letter-spacing: null !default;
+
+$kendo-h1-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h2-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h3-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h4-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h5-margin: 0 0 $kendo-font-size-md !default;
+$kendo-h6-margin: 0 0 $kendo-font-size-md !default;
 
 
 // Paragraph
-$paragraph-margin: 0 0 $font-size !default;
-$paragraph-font-size: $font-size !default;
-$paragraph-font-family: $font-family !default;
-$paragraph-line-height: 20px !default;
-$paragraph-font-weight: $font-weight-normal !default;
-$paragraph-letter-spacing: null !default;
+$kendo-paragraph-margin: 0 0 $kendo-font-size-md !default;
+$kendo-paragraph-font-size: $kendo-font-size-md !default;
+$kendo-paragraph-font-family: $kendo-font-family !default;
+$kendo-paragraph-line-height: 20px !default;
+$kendo-paragraph-font-weight: $kendo-font-weight-normal !default;
+$kendo-paragraph-letter-spacing: null !default;
 
 
 // Code
-$code-font-size: $font-size !default;
-$code-font-family: $font-family-monospace !default;
-$code-line-height: 20px !default;
-$code-font-weight: $font-weight-normal !default;
-$code-letter-spacing: null !default;
-
-$code-padding-x: 4px !default;
-$code-padding-y: 0px !default;
-$pre-padding-x: 24px !default;
-$pre-padding-y: 16px !default;
-$code-border-width: 1px !default;
+$kendo-code-font-size: $kendo-font-size-md !default;
+$kendo-code-font-family: $kendo-font-family-monospace !default;
+$kendo-code-line-height: 20px !default;
+$kendo-code-font-weight: $kendo-font-weight-normal !default;
+$kendo-code-letter-spacing: null !default;
 
-$code-bg: $base-bg !default;
-$code-text: $kendo-component-text !default;
-$code-border: $kendo-component-border !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;
+$kendo-code-border-width: 1px !default;
 
-// Link
-$link-text: $kendo-color-primary !default;
-$link-hover-text: $kendo-color-primary-darker !default;
+$kendo-code-bg: $kendo-base-bg !default;
+$kendo-code-text: $kendo-component-text !default;
+$kendo-code-border: $kendo-component-border !default;
 
 
 // Display
-$display1-font-size: ($font-size * 6) !default;
-$display2-font-size: ($font-size * 5) !default;
-$display3-font-size: ($font-size * 4) !default;
-$display4-font-size: ($font-size * 3) !default;
-
-$display1-font-family: $font-family !default;
-$display2-font-family: $font-family !default;
-$display3-font-family: $font-family !default;
-$display4-font-family: $font-family !default;
-
-$display1-line-height: 1.2 !default;
-$display2-line-height: 1.2 !default;
-$display3-line-height: 1.2 !default;
-$display4-line-height: 1.2 !default;
-
-$display1-font-weight: $font-weight-light !default;
-$display2-font-weight: $font-weight-light !default;
-$display3-font-weight: $font-weight-light !default;
-$display4-font-weight: $font-weight-light !default;
-
-$display1-letter-spacing: null !default;
-$display2-letter-spacing: null !default;
-$display3-letter-spacing: null !default;
-$display4-letter-spacing: null !default;
+$kendo-display1-font-size: ($kendo-font-size-md * 6) !default;
+$kendo-display2-font-size: ($kendo-font-size-md * 5) !default;
+$kendo-display3-font-size: ($kendo-font-size-md * 4) !default;
+$kendo-display4-font-size: ($kendo-font-size-md * 3) !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;
+
+$kendo-display1-line-height: 1.2 !default;
+$kendo-display2-line-height: 1.2 !default;
+$kendo-display3-line-height: 1.2 !default;
+$kendo-display4-line-height: 1.2 !default;
+
+$kendo-display1-font-weight: $kendo-font-weight-light !default;
+$kendo-display2-font-weight: $kendo-font-weight-light !default;
+$kendo-display3-font-weight: $kendo-font-weight-light !default;
+$kendo-display4-font-weight: $kendo-font-weight-light !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;

package/scss/upload/_variables.scss

@@ -1,9 +1,9 @@
 // Upload
 
 $kendo-upload-border-width: 1px !default;
-$kendo-upload-font-family: $font-family !default;
-$kendo-upload-font-size: $font-size !default;
-$kendo-upload-line-height: $line-height !default;
+$kendo-upload-font-family: $kendo-font-family !default;
+$kendo-upload-font-size: $kendo-font-size-md !default;
+$kendo-upload-line-height: $kendo-line-height-md !default;
 $kendo-upload-max-height: 300px !default;
 
 $kendo-upload-bg: $kendo-component-bg !default;

package/scss/validator/_layout.scss

@@ -1,7 +1,7 @@
 @include exports("validator/layout") {
 
     .k-validator-tooltip {
-        margin-top: calc( #{$tooltip-callout-size} + #{$tooltip-border-width} );
+        margin-top: calc( #{$kendo-tooltip-callout-size} + #{$kendo-tooltip-border-width} );
         width: auto;
         white-space: normal;
         display: flex;

package/scss/window/_variables.scss

@@ -5,8 +5,8 @@
 
 $kendo-window-border-width: 0px !default;
 $kendo-window-border-radius: 0px !default;
-$kendo-window-font-family: $font-family !default;
-$kendo-window-font-size: $font-size !default;
+$kendo-window-font-family: $kendo-font-family !default;
+$kendo-window-font-size: $kendo-font-size-md !default;
 $kendo-window-line-height: 1.25 !default;
 
 $kendo-window-titlebar-padding-x: 16px !default;
@@ -14,7 +14,7 @@ $kendo-window-titlebar-padding-y: 12px !default;
 $kendo-window-titlebar-border-width: 0 0 1px !default;
 $kendo-window-titlebar-border-style: solid !default;
 
-$kendo-window-title-font-size: $font-size-lg !default;
+$kendo-window-title-font-size: $kendo-font-size-lg !default;
 $kendo-window-title-line-height: 1.25 !default;
 
 $kendo-window-actions-gap: null !default;
@@ -25,8 +25,8 @@ $kendo-window-action-hover-opacity: null !default;
 $kendo-window-inner-padding-x: 16px !default;
 $kendo-window-inner-padding-y: 16px !default;
 
-$kendo-window-buttongroup-padding-x: $actions-padding-x !default;
-$kendo-window-buttongroup-padding-y: $actions-padding-y !default;
+$kendo-window-buttongroup-padding-x: $kendo-actions-padding-x !default;
+$kendo-window-buttongroup-padding-y: $kendo-actions-padding-y !default;
 $kendo-window-buttongroup-border-width: 1px !default;
 
 $kendo-window-bg: $kendo-component-bg !default;

package/scss/wizard/_layout.scss

@@ -1,13 +1,13 @@
 @include exports("wizard/layout") {
     .k-wizard {
-        padding: $wizard-padding-y $wizard-padding-x;
-        border-width: $wizard-border-width;
+        padding: $kendo-wizard-padding-y $kendo-wizard-padding-x;
+        border-width: $kendo-wizard-border-width;
         border-style: solid;
         box-sizing: border-box;
         outline: 0;
-        font-size: $wizard-font-size;
-        line-height: $wizard-line-height;
-        font-family: $wizard-font-family;
+        font-size: $kendo-wizard-font-size;
+        line-height: $kendo-wizard-line-height;
+        font-family: $kendo-wizard-font-family;
         position: relative;
         color: inherit;
         background: none;
@@ -23,7 +23,7 @@
 
         .k-wizard-step {
             box-sizing: border-box;
-            padding: calc(#{k-math-div( $wizard-content-padding-x, 4 )} + 2px);
+            padding: calc(#{k-math-div( $kendo-wizard-content-padding-x, 4 )} + 2px);
             width: 100%;
             display: flex;
             flex-direction: column;
@@ -44,7 +44,7 @@
         }
 
         .k-wizard-buttons {
-            margin-top: $wizard-content-padding-y;
+            margin-top: $kendo-wizard-content-padding-y;
             box-sizing: border-box;
             display: flex;
             flex-wrap: nowrap;
@@ -53,7 +53,7 @@
             flex-shrink: 0;
 
             .k-button {
-                margin-right: $wizard-buttons-margin-x;
+                margin-right: $kendo-wizard-buttons-margin-x;
             }
 
             .k-wizard-pager {
@@ -84,7 +84,7 @@
         flex-direction: column;
 
         .k-wizard-steps {
-            margin-top: $wizard-content-padding-y;
+            margin-top: $kendo-wizard-content-padding-y;
         }
 
         .k-wizard-steps,
@@ -104,7 +104,7 @@
         }
 
         .k-wizard-steps {
-            margin-left: $wizard-content-padding-x;
+            margin-left: $kendo-wizard-content-padding-x;
         }
     }
 
@@ -112,7 +112,7 @@
         flex-direction: row-reverse;
 
         .k-wizard-steps {
-            margin-right: $wizard-content-padding-x;
+            margin-right: $kendo-wizard-content-padding-x;
             margin-left: 0;
         }
     }

package/scss/wizard/_theme.scss

@@ -3,7 +3,7 @@
     .k-wizard-step {
         &:focus,
         &.k-focus {
-            outline-color: $wizard-step-focus-border;
+            outline-color: $kendo-wizard-step-focus-border;
         }
     }
 

package/scss/wizard/_variables.scss

@@ -1,13 +1,13 @@
 // Wizard
-$wizard-padding-x: $kendo-padding-md-x * 2.5 !default;
-$wizard-padding-y: $wizard-padding-x !default;
-$wizard-content-padding-x: $kendo-padding-md-x * 4 !default;
-$wizard-content-padding-y: $kendo-padding-md-y * 8 !default;
-$wizard-buttons-margin-x: 10px !default;
+$kendo-wizard-padding-x: $kendo-padding-md-x * 2.5 !default;
+$kendo-wizard-padding-y: $kendo-wizard-padding-x !default;
+$kendo-wizard-content-padding-x: $kendo-padding-md-x * 4 !default;
+$kendo-wizard-content-padding-y: $kendo-padding-md-y * 8 !default;
+$kendo-wizard-buttons-margin-x: 10px !default;
 
-$wizard-border-width: 0px !default;
-$wizard-font-size: $font-size !default;
-$wizard-line-height: $line-height !default;
-$wizard-font-family: $font-family !default;
+$kendo-wizard-border-width: 0px !default;
+$kendo-wizard-font-size: $kendo-font-size-md !default;
+$kendo-wizard-line-height: $kendo-line-height-md !default;
+$kendo-wizard-font-family: $kendo-font-family !default;
 
-$wizard-step-focus-border: #656565 !default;
+$kendo-wizard-step-focus-border: #656565 !default;