@progress/kendo-theme-default 6.2.1-dev.1 → 6.2.1-dev.154

package/scss/appbar/_theme.scss

@@ -1,4 +1,4 @@
-@include exports("appbar/theme") {
+@mixin kendo-appbar--theme-base() {
 
     .k-appbar {
         @include box-shadow( $kendo-appbar-box-shadow );
@@ -25,3 +25,8 @@
     }
 
 }
+
+
+@mixin kendo-appbar--theme() {
+    @include kendo-appbar--theme-base();
+}

package/scss/autocomplete/_index.scss

@@ -27,3 +27,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-autocomplete--styles() {
+    @include module-render( "autocomplete" ) {
+        @include kendo-autocomplete--layout();
+        @include kendo-autocomplete--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-autocomplete--styles();
+}

package/scss/autocomplete/_layout.scss

@@ -1,6 +1,11 @@
-@include exports( "autocomplete/layout" ) {
+@mixin kendo-autocomplete--layout-base() {
 
     // Autocomplete
     .k-autocomplete {}
 
 }
+
+
+@mixin kendo-autocomplete--layout() {
+    @include kendo-autocomplete--layout-base();
+}

package/scss/autocomplete/_theme.scss

@@ -1,6 +1,11 @@
-@include exports( "autocomplete/theme" ) {
+@mixin kendo-autocomplete--theme-base() {
 
     // Autocomplete
     .k-autocomplete {}
 
 }
+
+
+@mixin kendo-autocomplete--theme() {
+    @include kendo-autocomplete--theme-base();
+}

package/scss/avatar/_index.scss

@@ -17,3 +17,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-avatar--styles() {
+    @include module-render( "avatar" ) {
+        @include kendo-avatar--layout();
+        @include kendo-avatar--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-avatar--styles();
+}

package/scss/avatar/_layout.scss

@@ -1,4 +1,4 @@
-@include exports( "avatar/layout" ) {
+@mixin kendo-avatar--layout-base() {
 
     // Avatar
     .k-avatar {
@@ -75,3 +75,7 @@
 
 }
 
+
+@mixin kendo-avatar--layout() {
+    @include kendo-avatar--layout-base();
+}

package/scss/avatar/_theme.scss

@@ -1,4 +1,4 @@
-@include exports( "avatar/theme" ) {
+@mixin kendo-avatar--theme-base() {
 
     // Solid Avatars
     @each $name, $color in $kendo-avatar-theme-colors {
@@ -21,3 +21,8 @@
     }
 
 }
+
+
+@mixin kendo-avatar--theme() {
+    @include kendo-avatar--theme-base();
+}

package/scss/badge/_index.scss

@@ -21,3 +21,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-badge--styles() {
+    @include module-render( "badge" ) {
+        @include kendo-badge--layout();
+        @include kendo-badge--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-badge--styles();
+}

package/scss/badge/_layout.scss

@@ -1,4 +1,4 @@
-@include exports( "badge/layout" ) {
+@mixin kendo-badge--layout-base() {
 
     .k-badge {
         padding: 0;
@@ -143,3 +143,8 @@
     }
 
 }
+
+
+@mixin kendo-badge--layout() {
+    @include kendo-badge--layout-base();
+}

package/scss/badge/_theme.scss

@@ -1,4 +1,4 @@
-@include exports( "badge/theme" ) {
+@mixin kendo-badge--theme-base() {
 
     // Solid badges
     @each $name, $color in $kendo-theme-colors {
@@ -20,4 +20,10 @@
             color: $color;
         }
     }
+
+}
+
+
+@mixin kendo-badge--theme() {
+    @include kendo-badge--theme-base();
 }

package/scss/bottom-navigation/_index.scss

@@ -22,3 +22,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-bottom-navigation--styles() {
+    @include module-render( "bottom-navigation" ) {
+        @include kendo-bottom-navigation--layout();
+        @include kendo-bottom-navigation--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-bottom-navigation--styles();
+}

package/scss/bottom-navigation/_layout.scss

@@ -1,4 +1,4 @@
-@include exports("bottom-navigation/layout") {
+@mixin kendo-bottom-navigation--layout-base() {
 
     // Bottom Navigation
     .k-bottom-nav {
@@ -113,4 +113,10 @@
         bottom: 0;
         z-index: 1;
     }
+
+}
+
+
+@mixin kendo-bottom-navigation--layout() {
+    @include kendo-bottom-navigation--layout-base();
 }

package/scss/bottom-navigation/_theme.scss

@@ -1,4 +1,4 @@
-@include exports("bottom-navigation/theme") {
+@mixin kendo-bottom-navigation--theme-base() {
 
     // Solid
     @each $name, $color in $kendo-theme-colors {
@@ -44,3 +44,8 @@
     }
 
 }
+
+
+@mixin kendo-bottom-navigation--theme() {
+    @include kendo-bottom-navigation--theme-base();
+}

package/scss/breadcrumb/_index.scss

@@ -22,3 +22,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-breadcrumb--styles() {
+    @include module-render( "breadcrumb" ) {
+        @include kendo-breadcrumb--layout();
+        @include kendo-breadcrumb--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-breadcrumb--styles();
+}

package/scss/breadcrumb/_layout.scss

@@ -1,4 +1,4 @@
-@include exports( "breadcrumb/layout" ) {
+@mixin kendo-breadcrumb--layout-base() {
 
     // Breadcrumb
     .k-breadcrumb {
@@ -119,3 +119,8 @@
     }
 
 }
+
+
+@mixin kendo-breadcrumb--layout() {
+    @include kendo-breadcrumb--layout-base();
+}

package/scss/breadcrumb/_theme.scss

@@ -1,4 +1,4 @@
-@include exports( "breadcrumb/theme" ) {
+@mixin kendo-breadcrumb--theme-base() {
 
     // Breadcrumb
     .k-breadcrumb {
@@ -95,3 +95,8 @@
     }
 
 }
+
+
+@mixin kendo-breadcrumb--theme() {
+    @include kendo-breadcrumb--theme-base();
+}

package/scss/button/_index.scss

@@ -21,3 +21,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-button--styles() {
+    @include module-render( "button" ) {
+        @include kendo-button--layout();
+        @include kendo-button--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-button--styles();
+}

package/scss/button/_layout.scss

@@ -1,4 +1,4 @@
-@include exports("button/layout") {
+@mixin kendo-button--layout-base() {
 
     // Button
     .k-button {
@@ -256,12 +256,8 @@
         box-shadow: none !important; // sass-lint:disable-line no-important
     }
 
-}
-
-
 
 
-@include exports( "button/layout/overlay" ) {
 
     // Button overlay
     .k-button-overlay {
@@ -326,13 +322,10 @@
 
     }
 
-}
-
 
 
 
-@include exports( "button/layout/focus-ring" ) {
-
+    // Button focus ring
     .k-button {
 
         &::after {
@@ -350,4 +343,10 @@
             transition: opacity .2s ease-in-out;
         }
     }
+
+}
+
+
+@mixin kendo-button--layout() {
+    @include kendo-button--layout-base();
 }

package/scss/button/_theme.scss

@@ -1,4 +1,4 @@
-@include exports( "button/theme" ) {
+@mixin kendo-button--theme-base() {
 
     // Solid button
     .k-button-solid-base {
@@ -277,3 +277,8 @@
 
 
 }
+
+
+@mixin kendo-button--theme() {
+    @include kendo-button--theme-base();
+}

package/scss/button/_variables.scss

@@ -1,82 +1,85 @@
 // Button
 
-/// Width of the border around the button.
+/// The width of the border around the Button.
 /// @group button
 $kendo-button-border-width: 1px !default;
 
-/// Border radius of the button.
+/// The border radius of the Button.
 /// @group button
 $kendo-button-border-radius: null !default;
 
-/// Horizontal padding of the button.
+/// The horizontal padding of the Button.
 /// @group button
 $kendo-button-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-/// Horizontal padding of the small button.
+/// The horizontal padding of the small Button.
 /// @group button
 $kendo-button-sm-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
-/// Horizontal padding of the medium button.
+/// The horizontal padding of the medium Button.
 /// @group button
 $kendo-button-md-padding-x: $kendo-button-padding-x !default;
-/// Horizontal padding of the large button.
+/// The horizontal padding of the large Button.
 /// @group button
 $kendo-button-lg-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
 
-/// Vertical padding of the button.
+/// The vertical padding of the Button.
 /// @group button
 $kendo-button-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
-/// Vertical padding of the small button.
+/// The vertical padding of the small Button.
 /// @group button
 $kendo-button-sm-padding-y: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
-/// Vertical padding of the medium button.
+/// The vertical padding of the medium Button.
 /// @group button
 $kendo-button-md-padding-y: $kendo-button-padding-y !default;
-/// Vertical padding of the large button.
+/// The vertical padding of the large Button.
 /// @group button
 $kendo-button-lg-padding-y: k-map-get( $kendo-spacing, 2 ) !default;
 
-/// Font family of the button.
+/// The font family of the Button.
 /// @group button
 $kendo-button-font-family: $kendo-font-family !default;
 
-/// Font size of the button.
+/// The font size of the Button.
 /// @group button
 $kendo-button-font-size: $kendo-font-size-md !default;
-/// Font size of the small button.
+/// The font size of the small Button.
 /// @group button
 $kendo-button-sm-font-size: $kendo-font-size-md !default;
-/// Font size of the medium button.
+/// The font size of the medium Button.
 /// @group button
 $kendo-button-md-font-size: $kendo-button-font-size !default;
-/// Font size of the large button.
+/// The font size of the large Button.
 /// @group button
 $kendo-button-lg-font-size: $kendo-font-size-lg !default;
 
-/// Line height used along with $kendo-font-size.
+/// The line height used along with $kendo-font-size.
 /// @group button
 $kendo-button-line-height: $kendo-line-height-md !default;
-/// Line height used along with $kendo-font-size of the small button.
+/// The line height used along with the $kendo-font-size of the small Button.
 /// @group button
 $kendo-button-sm-line-height: $kendo-line-height-md !default;
-/// Line height used along with $kendo-font-size of the medium button.
+/// The line height used along with the $kendo-font-size of the medium Button.
 /// @group button
 $kendo-button-md-line-height: $kendo-button-line-height !default;
-/// Line height used along with $kendo-font-size of the large button.
+/// The line height used along with the $kendo-font-size of the large Button.
 /// @group button
 $kendo-button-lg-line-height: $kendo-line-height-lg !default;
 
-// Calculated height of the button.
+/// The calculated height of the Button.
+/// @group button
 $kendo-button-calc-size: calc( #{$kendo-button-line-height * 1em} + #{$kendo-button-padding-y * 2} + #{$kendo-button-border-width * 2} ) !default;
 $kendo-button-sm-calc-size: calc( #{$kendo-button-sm-line-height * 1em} + #{$kendo-button-sm-padding-y * 2} + #{$kendo-button-border-width * 2} ) !default;
 $kendo-button-md-calc-size: calc( #{$kendo-button-md-line-height * 1em} + #{$kendo-button-md-padding-y * 2} + #{$kendo-button-border-width * 2} ) !default;
 $kendo-button-lg-calc-size: calc( #{$kendo-button-lg-line-height * 1em} + #{$kendo-button-lg-padding-y * 2} + #{$kendo-button-border-width * 2} ) !default;
 
-// Calculated inner height of the button. Without the border width.
+/// The calculated inner height of the Button excluding the border width.
+/// @group button
 $kendo-button-inner-calc-size: calc( #{$kendo-button-line-height * 1em} + #{$kendo-button-padding-y * 2} ) !default;
 $kendo-button-sm-inner-calc-size: calc( #{$kendo-button-sm-line-height * 1em} + #{$kendo-button-sm-padding-y * 2} ) !default;
 $kendo-button-md-inner-calc-size: calc( #{$kendo-button-md-line-height * 1em} + #{$kendo-button-md-padding-y * 2} ) !default;
 $kendo-button-lg-inner-calc-size: calc( #{$kendo-button-lg-line-height * 1em} + #{$kendo-button-lg-padding-y * 2} ) !default;
 
-// Sizes map for the button.
+/// The sizes map for the Button.
+/// @group button
 $kendo-button-sizes: (
     sm: (
         padding-x: $kendo-button-sm-padding-x,
@@ -98,110 +101,110 @@ $kendo-button-sizes: (
     )
 ) !default;
 
-/// Theme colors map for the button.
+/// The theme colors map for the Button.
 /// @group button
 $kendo-button-theme-colors: k-map-merge(
     $kendo-theme-colors,
     ( "base": #f5f5f5 )
 ) !default;
 
-/// The base background of the button.
+/// The base background of the Button.
 /// @group button
 $kendo-button-bg: #f5f5f5 !default;
-/// The base text color of the button.
+/// The base text color of the Button.
 /// @group button
 $kendo-button-text: #424242 !default;
-/// The base border color of the button.
+/// The base border color of the Button.
 /// @group button
 $kendo-button-border: rgba( black, .08 ) !default;
-/// The base background gradient of the button.
+/// The base background gradient of the Button.
 /// @group button
 $kendo-button-gradient: rgba( black, 0 ), rgba( black, .02 ) !default;
-/// The base shadow of the button.
+/// The base shadow of the Button.
 /// @group button
 $kendo-button-shadow: null !default;
 
-/// The base background of hovered button.
+/// The base background of the hovered Button.
 /// @group button
 $kendo-button-hover-bg: k-try-shade( $kendo-button-bg, .5 ) !default;
-/// The base text color of hovered button.
+/// The base text color of the hovered Button.
 /// @group button
 $kendo-button-hover-text: null !default;
-/// The base border color of hovered button.
+/// The base border color of the hovered Button.
 /// @group button
 $kendo-button-hover-border: null !default;
-/// The base background gradient of hovered button.
+/// The base background gradient of the hovered Button.
 /// @group button
 $kendo-button-hover-gradient: null !default;
-/// The base shadow of hovered button.
+/// The base shadow of the hovered Button.
 /// @group button
 $kendo-button-hover-shadow: null !default;
 
-/// The base background color of active button.
+/// The base background color of the active Button.
 /// @group button
 $kendo-button-active-bg: k-try-shade( $kendo-button-bg, 1.5 ) !default;
-/// The base text color of active button.
+/// The base text color of the active Button.
 /// @group button
 $kendo-button-active-text: null !default;
-/// The base border color of active button.
+/// The base border color of the active Button.
 /// @group button
 $kendo-button-active-border: null !default;
-/// The base background gradient of active button.
+/// The base background gradient of the active Button.
 /// @group button
 $kendo-button-active-gradient: null !default;
-/// The base shadow of active button.
+/// The base shadow of the active Button.
 /// @group button
 $kendo-button-active-shadow: null !default;
 
-/// The base background color of selected button.
+/// The base background color of the selected Button.
 /// @group button
 $kendo-button-selected-bg: $kendo-color-primary !default;
-/// The text color of selected buttons.
+/// The text color of the selected Button.
 /// @group button
 $kendo-button-selected-text: k-contrast-legacy( $kendo-button-selected-bg ) !default;
-/// The border color of selected buttons.
+/// The border color of the selected Button.
 /// @group button
 $kendo-button-selected-border: $kendo-button-selected-bg !default;
-/// The background gradient of selected buttons.
+/// The background gradient of the selected Button.
 /// @group button
 $kendo-button-selected-gradient: $kendo-button-active-gradient !default;
-/// The base shadow of selected button.
+/// The base shadow of the selected Button.
 /// @group button
 $kendo-button-selected-shadow: $kendo-button-active-shadow !default;
 
-/// The base background of focused button.
+/// The base background of the focused Button.
 /// @group button
 $kendo-button-focus-bg: null !default;
-/// The base text color of focused button.
+/// The base text color of the focused Button.
 /// @group button
 $kendo-button-focus-text: null !default;
-/// The base border color of focused button.
+/// The base border color of the focused Button.
 /// @group button
 $kendo-button-focus-border: null !default;
-/// The base background gradient of focused button.
+/// The base background gradient of the focused Button.
 /// @group button
 $kendo-button-focus-gradient: null !default;
-/// The base shadow of focused button.
+/// The base shadow of the focused Button.
 /// @group button
 $kendo-button-focus-shadow: 0 0 0 2px rgba( $kendo-button-border, .08 ) !default;
 
-/// The base background of disabled button.
+/// The base background of the disabled Button.
 /// @group button
 $kendo-button-disabled-bg: null !default;
-/// The base text color of disabled button.
+/// The base text color of the disabled Button.
 /// @group button
 $kendo-button-disabled-text: null !default;
-/// The base border color of disabled buttons.
+/// The base border color of the disabled Button.
 /// @group button
 $kendo-button-disabled-border: null !default;
-/// The base background gradient of disabled button.
+/// The base background gradient of the disabled Button.
 /// @group button
 $kendo-button-disabled-gradient: null !default;
-/// The base shadow of disabled button.
+/// The base shadow of the disabled Button.
 /// @group button
 $kendo-button-disabled-shadow: null !default;
 
-// Solid button
+// Solid Button
 $kendo-solid-button-gradient: rgba( black, 0 ), rgba( black, .02 ) !default;
 $kendo-solid-button-shade-function: "k-try-shade" !default;
 $kendo-solid-button-shade-text-amount: 0 !default;
@@ -218,37 +221,37 @@ $kendo-solid-button-shadow-blur: 0px !default;
 $kendo-solid-button-shadow-spread: 2px !default;
 $kendo-solid-button-shadow-opacity: .3 !default;
 
-// Outline button
+// Outline Button
 $kendo-outline-button-shadow: true !default;
 $kendo-outline-button-shadow-blur: 0px !default;
 $kendo-outline-button-shadow-spread: 2px !default;
 $kendo-outline-button-shadow-opacity: .3 !default;
 
-// Link button
+// Link Button
 $kendo-link-button-shadow: true !default;
 $kendo-link-button-shadow-blur: 0px !default;
 $kendo-link-button-shadow-spread: 2px !default;
 $kendo-link-button-shadow-opacity: .3 !default;
 
-// Clear button
+// Clear Button
 $kendo-clear-button-focus-opacity: .1 !default;
 
-/// The overlay opacity of hovered flat button. Used to create background for the flat button.
+/// The overlay opacity of the hovered flat Button. Used to create a background for the flat Button.
 /// @group button
 $kendo-flat-button-hover-opacity: .04 !default;
-/// The overlay opacity of focused flat button. Used to create background for the flat button.
+/// The overlay opacity of the focused flat Button. Used to create a background for the flat Button.
 /// @group button
 $kendo-flat-button-focus-opacity: null !default;
-/// The overlay opacity of active flat button. Used to create background for the flat button.
+/// The overlay opacity of the active flat Button. Used to create background for the flat Button.
 /// @group button
 $kendo-flat-button-active-opacity: .16 !default;
-/// The overlay opacity of selected flat button. Used to create background for the flat button.
+/// The overlay opacity of the selected flat Button. Used to create background for the flat Button.
 /// @group button
 $kendo-flat-button-selected-opacity: .2 !default;
-/// The opacity of the flat button focus ring. Used to create border for the flat button.
+/// The opacity of the flat Button focus ring. Used to create a border for the flat Button.
 /// @group button
 $kendo-flat-button-focus-ring-opacity: .12 !default;
 
-/// The color transition of the flat button.
+/// The color transition of the flat Button.
 /// @group button
 $kendo-button-transition: color .2s ease-in-out !default;