@progress/kendo-theme-default 10.2.0-dev.1 → 10.2.0-dev.3

package/scss/tabstrip/_variables.scss

@@ -226,3 +226,68 @@ $kendo-tabstrip-sizes: (
         item-padding-y: $kendo-tabstrip-lg-item-padding-y
     )
 ) !default;
+
+@forward "@progress/kendo-theme-core/scss/components/tabstrip/_variables.scss" with (
+    $kendo-tabstrip-wrapper-padding-x: $kendo-tabstrip-wrapper-padding-x,
+    $kendo-tabstrip-wrapper-padding-y: $kendo-tabstrip-wrapper-padding-y,
+    $kendo-tabstrip-wrapper-border-width: $kendo-tabstrip-wrapper-border-width,
+    $kendo-tabstrip-font-family: $kendo-tabstrip-font-family,
+    $kendo-tabstrip-font-size: $kendo-tabstrip-font-size,
+    $kendo-tabstrip-line-height: $kendo-tabstrip-line-height,
+    $kendo-tabstrip-border-width: $kendo-tabstrip-border-width,
+    $kendo-tabstrip-sm-font-size: $kendo-tabstrip-sm-font-size,
+    $kendo-tabstrip-sm-line-height: $kendo-tabstrip-sm-line-height,
+    $kendo-tabstrip-md-font-size: $kendo-tabstrip-md-font-size,
+    $kendo-tabstrip-md-line-height: $kendo-tabstrip-md-line-height,
+    $kendo-tabstrip-lg-font-size: $kendo-tabstrip-lg-font-size,
+    $kendo-tabstrip-lg-line-height: $kendo-tabstrip-lg-line-height,
+    $kendo-tabstrip-wrapper-bg: $kendo-tabstrip-wrapper-bg,
+    $kendo-tabstrip-wrapper-text: $kendo-tabstrip-wrapper-text,
+    $kendo-tabstrip-wrapper-border: $kendo-tabstrip-wrapper-border,
+    $kendo-tabstrip-bg: $kendo-tabstrip-bg,
+    $kendo-tabstrip-text: $kendo-tabstrip-text,
+    $kendo-tabstrip-border: $kendo-tabstrip-border,
+    $kendo-tabstrip-item-padding-x: $kendo-tabstrip-item-padding-x,
+    $kendo-tabstrip-item-padding-y: $kendo-tabstrip-item-padding-y,
+    $kendo-tabstrip-item-border-width: $kendo-tabstrip-item-border-width,
+    $kendo-tabstrip-item-border-radius: $kendo-tabstrip-item-border-radius,
+    $kendo-tabstrip-item-gap: $kendo-tabstrip-item-gap,
+    $kendo-tabstrip-sm-item-padding-x: $kendo-tabstrip-sm-item-padding-x,
+    $kendo-tabstrip-sm-item-padding-y: $kendo-tabstrip-sm-item-padding-y,
+    $kendo-tabstrip-md-item-padding-x: $kendo-tabstrip-md-item-padding-x,
+    $kendo-tabstrip-md-item-padding-y: $kendo-tabstrip-md-item-padding-y,
+    $kendo-tabstrip-lg-item-padding-x: $kendo-tabstrip-lg-item-padding-x,
+    $kendo-tabstrip-lg-item-padding-y: $kendo-tabstrip-lg-item-padding-y,
+    $kendo-tabstrip-item-bg: $kendo-tabstrip-item-bg,
+    $kendo-tabstrip-item-text: $kendo-tabstrip-item-text,
+    $kendo-tabstrip-item-border: $kendo-tabstrip-item-border,
+    $kendo-tabstrip-item-gradient: $kendo-tabstrip-item-gradient,
+    $kendo-tabstrip-item-hover-bg: $kendo-tabstrip-item-hover-bg,
+    $kendo-tabstrip-item-hover-text: $kendo-tabstrip-item-hover-text,
+    $kendo-tabstrip-item-hover-border: $kendo-tabstrip-item-hover-border,
+    $kendo-tabstrip-item-hover-gradient: $kendo-tabstrip-item-hover-gradient,
+    $kendo-tabstrip-item-selected-bg: $kendo-tabstrip-item-selected-bg,
+    $kendo-tabstrip-item-selected-text: $kendo-tabstrip-item-selected-text,
+    $kendo-tabstrip-item-selected-border: $kendo-tabstrip-item-selected-border,
+    $kendo-tabstrip-item-selected-gradient: $kendo-tabstrip-item-selected-gradient,
+    $kendo-tabstrip-item-selected-font-weight: $kendo-tabstrip-item-selected-font-weight,
+    $kendo-tabstrip-item-focus-shadow: $kendo-tabstrip-item-focus-shadow,
+    $kendo-tabstrip-item-dragging-shadow: $kendo-tabstrip-item-dragging-shadow,
+    $kendo-tabstrip-item-disabled-bg: $kendo-tabstrip-item-disabled-bg,
+    $kendo-tabstrip-item-disabled-text: $kendo-tabstrip-item-disabled-text,
+    $kendo-tabstrip-item-disabled-border: $kendo-tabstrip-item-disabled-border,
+    $kendo-tabstrip-item-disabled-gradient: $kendo-tabstrip-item-disabled-gradient,
+    $kendo-tabstrip-item-disabled-opacity: $kendo-tabstrip-item-disabled-opacity,
+    $kendo-tabstrip-item-disabled-filter: $kendo-tabstrip-item-disabled-filter,
+    $kendo-tabstrip-indicator-size: $kendo-tabstrip-indicator-size,
+    $kendo-tabstrip-indicator-color: $kendo-tabstrip-indicator-color,
+    $kendo-tabstrip-content-padding-x: $kendo-tabstrip-content-padding-x,
+    $kendo-tabstrip-content-padding-y: $kendo-tabstrip-content-padding-y,
+    $kendo-tabstrip-content-border-width: $kendo-tabstrip-content-border-width,
+    $kendo-tabstrip-content-bg: $kendo-tabstrip-content-bg,
+    $kendo-tabstrip-content-text: $kendo-tabstrip-content-text,
+    $kendo-tabstrip-content-border: $kendo-tabstrip-content-border,
+    $kendo-tabstrip-content-focus-border: $kendo-tabstrip-content-focus-border,
+    $kendo-tabstrip-scroll-overlay: $kendo-tabstrip-scroll-overlay,
+    $kendo-tabstrip-sizes: $kendo-tabstrip-sizes
+);

package/scss/taskboard/_layout.scss

@@ -1,220 +1,4 @@
-@use "../core/_index.scss" as *;
-@use "./variables.scss" as *;
-
-@mixin kendo-task-board--layout-base() {
-
-    // TaskBoard
-    .k-taskboard {
-        padding-block: $kendo-taskboard-padding-y;
-        padding-inline: $kendo-taskboard-padding-x;
-        box-sizing: border-box;
-        font-size: $kendo-taskboard-font-size;
-        font-family: $kendo-taskboard-font-family;
-        line-height: $kendo-taskboard-line-height;
-        display: flex;
-        flex-direction: column;
-        position: relative;
-
-        *,
-        *::before,
-        *::after {
-            box-sizing: border-box;
-        }
-    }
-
-    // Toolbar
-    .k-taskboard-toolbar {
-        padding-block: $kendo-taskboard-toolbar-padding-y;
-        padding-inline: $kendo-taskboard-toolbar-padding-x;
-        border-width: 0;
-        box-shadow: none;
-        background: none;
-    }
-
-    // Content
-    .k-taskboard-content {
-        padding: 0 $kendo-taskboard-toolbar-padding-x $kendo-taskboard-content-padding-y;
-        display: flex;
-        position: relative;
-        flex: 1 1 auto;
-        overflow-x: auto;
-    }
-
-    // Columns
-    .k-taskboard-columns-container {
-        outline: none;
-        display: flex;
-        flex-direction: row;
-        overflow: hidden;
-        gap: $kendo-taskboard-columns-container-gap;
-        overflow-x: visible;
-    }
-
-    .k-taskboard-column {
-        width: $kendo-taskboard-column-width;
-        border-width: $kendo-taskboard-column-border-width;
-        border-radius: $kendo-taskboard-column-border-radius;
-        border-style: solid;
-        outline: none;
-        display: flex;
-        flex-direction: column;
-        flex-shrink: 0;
-        overflow: hidden;
-    }
-
-    .k-taskboard-column-header {
-        padding-block: $kendo-taskboard-column-header-padding-y;
-        padding-inline: $kendo-taskboard-column-header-padding-x;
-        font-weight: $kendo-taskboard-column-header-font-weight;
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        gap: $kendo-taskboard-column-header-gap;
-    }
-
-    .k-taskboard-column-header-actions {
-        display: inline-flex;
-        flex-shrink: 0;
-        align-self: flex-start;
-        gap: $kendo-taskboard-column-header-actions-gap;
-    }
-
-    .k-taskboard-column-cards-container {
-        margin-bottom: $kendo-taskboard-column-container-spacing-y;
-        padding-block: $kendo-taskboard-column-container-padding-y;
-        padding-inline: $kendo-taskboard-column-container-padding-x;
-        outline: none;
-        overflow: auto;
-        flex: 1 1 auto;
-    }
-
-    .k-taskboard-column-cards {
-        padding-block: $kendo-taskboard-column-cards-padding-y;
-        padding-inline: $kendo-taskboard-column-cards-padding-x;
-        min-height: 100%;
-        display: flex;
-        flex-direction: column;
-        gap: $kendo-taskboard-column-cards-gap 0;
-    }
-
-    // Edit/New Columns
-    .k-taskboard-column-new {
-        // TODO: we need better way
-        // max-height: $kendo-taskboard-column-new-calc-height;
-    }
-
-    .k-taskboard-column-new,
-    .k-taskboard-column-edit {
-        .k-taskboard-column-header {
-            font-weight: inherit;
-        }
-
-        .k-taskboard-column-header-text {
-            flex: 1 1 100%;
-        }
-    }
-
-    // Preview/Edit Pane
-    .k-taskboard-pane {
-        padding-block: $kendo-taskboard-pane-padding-y;
-        padding-inline: $kendo-taskboard-pane-padding-x;
-        width: $kendo-taskboard-pane-width;
-        border-width: $kendo-taskboard-pane-border-width;
-        border-style: solid;
-        display: flex;
-        flex-direction: column;
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        overflow: hidden;
-        z-index: 2;
-    }
-
-    .k-taskboard-pane-header {
-        padding-block: $kendo-taskboard-pane-header-padding-y;
-        padding-inline: $kendo-taskboard-pane-header-padding-x;
-        font-weight: $kendo-taskboard-pane-header-font-weight;
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-    }
-
-    .k-taskboard-pane-header-text {
-        word-break: normal;
-        overflow-wrap: anywhere;
-    }
-
-    .k-taskboard-pane-header-actions {
-        flex-shrink: 0;
-        align-self: flex-start;
-    }
-
-    .k-taskboard-pane-content {
-        padding-block: $kendo-taskboard-pane-content-padding-y;
-        padding-inline: $kendo-taskboard-pane-content-padding-x;
-        overflow: auto;
-        flex: 1 1 auto;
-    }
-
-    .k-taskboard-pane-actions {
-        padding-block: $kendo-taskboard-pane-actions-padding-y;
-        padding-inline: $kendo-taskboard-pane-actions-padding-x;
-    }
-
-    .k-taskboard-pane-start {
-        right: auto;
-        left: 0;
-    }
-
-    // Cards
-    .k-taskboard-card {
-        @include border-radius( $kendo-taskboard-card-border-radius );
-        border-width: $kendo-taskboard-card-border-width;
-
-        &.k-taskboard-card-category {
-            border-inline-start-width: $kendo-taskboard-card-category-border-width;
-        }
-
-        .k-card-header
-        .k-card-body,
-        .k-card-footer {
-            padding-block: $kendo-taskboard-card-padding-y;
-            padding-inline: $kendo-taskboard-card-padding-x;
-        }
-
-        .k-card-header {
-            align-items: center;
-        }
-
-        .k-card-title {
-            font-size: inherit;
-            font-weight: inherit;
-            word-break: normal;
-            overflow-wrap: anywhere;
-
-            &:focus,
-            &.k-focus,
-            &:hover,
-            &.k-hover {
-                text-decoration: underline;
-            }
-        }
-
-        .k-card-header-actions {
-            align-self: flex-start;
-        }
-    }
-
-    // Card Drag Placeholder
-    .k-taskboard-drag-placeholder {
-        @include border-radius( $kendo-taskboard-drag-placeholder-border-radius );
-        border-width: $kendo-taskboard-drag-placeholder-border-width;
-        border-style: solid;
-        position: relative;
-    }
-
-}
+@use "@progress/kendo-theme-core/scss/components/taskboard/_layout.scss" as *;
 
 
 @mixin kendo-task-board--layout() {

package/scss/taskboard/_theme.scss

@@ -1,114 +1,4 @@
-@use "../core/_index.scss" as *;
-@use "./variables.scss" as *;
-
-@mixin kendo-task-board--theme-base() {
-
-    // TaskBoard
-    .k-taskboard {
-        @include fill(
-            $kendo-taskboard-text,
-            $kendo-taskboard-bg,
-            $kendo-taskboard-border
-        );
-    }
-
-    // Toolbar
-    .k-taskboard-toolbar {
-        @include fill(
-            $kendo-taskboard-toolbar-text,
-            $kendo-taskboard-toolbar-bg,
-            $kendo-taskboard-toolbar-border,
-            $kendo-taskboard-toolbar-gradient
-        );
-    }
-
-    // Columns
-    .k-taskboard-column {
-        @include fill(
-            $kendo-taskboard-column-text,
-            $kendo-taskboard-column-bg,
-            $kendo-taskboard-column-border
-        );
-    }
-    .k-taskboard-column:focus,
-    .k-taskboard-column.k-focus {
-        @include fill(
-            $kendo-taskboard-column-focus-text,
-            $kendo-taskboard-column-focus-bg,
-            $kendo-taskboard-column-focus-border
-        );
-    }
-
-    .k-taskboard-column-header {
-        @include fill( $color: $kendo-taskboard-column-header-text );
-    }
-
-    // Preview/Edit Pane
-    .k-taskboard-pane {
-        @include fill (
-            $kendo-taskboard-pane-text,
-            $kendo-taskboard-pane-bg,
-            $kendo-taskboard-pane-border
-        );
-    }
-
-    .k-taskboard-pane-header {
-        @include fill( $color: $kendo-taskboard-pane-header-text );
-    }
-
-    // Cards
-    .k-taskboard-card {
-        @include fill(
-            $kendo-taskboard-card-text,
-            $kendo-taskboard-card-bg,
-            $kendo-taskboard-card-border
-        );
-        @include box-shadow( $kendo-taskboard-card-shadow );
-
-        .k-card-title {
-            @include fill( $color: $kendo-taskboard-card-header-text );
-
-            &:focus,
-            &.k-focus {
-                @include fill( $color: $kendo-taskboard-card-header-focus-text );
-            }
-
-            &:hover,
-            &.k-hover {
-                @include fill( $color: $kendo-taskboard-card-header-hover-text );
-            }
-        }
-
-        &:focus,
-        &.k-focus {
-            @include focus-indicator( $kendo-taskboard-card-focus-shadow );
-            @include fill( $border: $kendo-taskboard-card-focus-border );
-        }
-
-        &:hover,
-        &.k-hover {
-            @include fill( $border: $kendo-taskboard-card-hover-border );
-        }
-
-        &.k-selected {
-            @include fill( $border: $kendo-taskboard-card-selected-border );
-            @include box-shadow( $kendo-taskboard-card-selected-shadow );
-        }
-
-        &.k-disabled {
-            @include disabled( $kendo-disabled-styling... );
-        }
-    }
-
-    // Card Drag Placeholder
-    .k-taskboard-drag-placeholder {
-        @include fill(
-            $bg: $kendo-taskboard-drag-placeholder-bg,
-            $border: $kendo-taskboard-drag-placeholder-border
-        );
-    }
-
-}
+@use "@progress/kendo-theme-core/scss/components/taskboard/_theme.scss" as *;
 
 
 @mixin kendo-task-board--theme() {

package/scss/taskboard/_variables.scss

@@ -247,3 +247,81 @@ $kendo-taskboard-drag-placeholder-bg: rgba(255, 255, 255, .2) !default;
 /// The border color of the TaskBoard Card placeholder.
 /// @group taskboard
 $kendo-taskboard-drag-placeholder-border: $kendo-component-border !default;
+
+@forward "@progress/kendo-theme-core/scss/components/taskboard/_variables.scss" with (
+    $kendo-taskboard-spacer: $kendo-taskboard-spacer,
+    $kendo-taskboard-padding-y: $kendo-taskboard-padding-y,
+    $kendo-taskboard-padding-x: $kendo-taskboard-padding-x,
+    $kendo-taskboard-font-family: $kendo-taskboard-font-family,
+    $kendo-taskboard-font-size: $kendo-taskboard-font-size,
+    $kendo-taskboard-line-height: $kendo-taskboard-line-height,
+    $kendo-taskboard-bg: $kendo-taskboard-bg,
+    $kendo-taskboard-text: $kendo-taskboard-text,
+    $kendo-taskboard-border: $kendo-taskboard-border,
+    $kendo-taskboard-toolbar-padding-y: $kendo-taskboard-toolbar-padding-y,
+    $kendo-taskboard-toolbar-padding-x: $kendo-taskboard-toolbar-padding-x,
+    $kendo-taskboard-toolbar-bg: $kendo-taskboard-toolbar-bg,
+    $kendo-taskboard-toolbar-text: $kendo-taskboard-toolbar-text,
+    $kendo-taskboard-toolbar-border: $kendo-taskboard-toolbar-border,
+    $kendo-taskboard-toolbar-gradient: $kendo-taskboard-toolbar-gradient,
+    $kendo-taskboard-content-padding-y: $kendo-taskboard-content-padding-y,
+    $kendo-taskboard-content-padding-x: $kendo-taskboard-content-padding-x,
+    $kendo-taskboard-column-container-spacing-y: $kendo-taskboard-column-container-spacing-y,
+    $kendo-taskboard-column-container-padding-y: $kendo-taskboard-column-container-padding-y,
+    $kendo-taskboard-column-container-padding-x: $kendo-taskboard-column-container-padding-x,
+    $kendo-taskboard-columns-container-gap: $kendo-taskboard-columns-container-gap,
+    $kendo-taskboard-column-width: $kendo-taskboard-column-width,
+    $kendo-taskboard-column-border-width: $kendo-taskboard-column-border-width,
+    $kendo-taskboard-column-border-radius: $kendo-taskboard-column-border-radius,
+    $kendo-taskboard-column-bg: $kendo-taskboard-column-bg,
+    $kendo-taskboard-column-text: $kendo-taskboard-column-text,
+    $kendo-taskboard-column-border: $kendo-taskboard-column-border,
+    $kendo-taskboard-column-focus-bg: $kendo-taskboard-column-focus-bg,
+    $kendo-taskboard-column-focus-text: $kendo-taskboard-column-focus-text,
+    $kendo-taskboard-column-focus-border: $kendo-taskboard-column-focus-border,
+    $kendo-taskboard-column-header-padding-y: $kendo-taskboard-column-header-padding-y,
+    $kendo-taskboard-column-header-padding-x: $kendo-taskboard-column-header-padding-x,
+    $kendo-taskboard-column-header-gap: $kendo-taskboard-column-header-gap,
+    $kendo-taskboard-column-header-actions-gap: $kendo-taskboard-column-header-actions-gap,
+    $kendo-taskboard-column-header-font-weight: $kendo-taskboard-column-header-font-weight,
+    $kendo-taskboard-column-header-text: $kendo-taskboard-column-header-text,
+    $kendo-taskboard-column-cards-padding-y: $kendo-taskboard-column-cards-padding-y,
+    $kendo-taskboard-column-cards-padding-x: $kendo-taskboard-column-cards-padding-x,
+    $kendo-taskboard-column-cards-gap: $kendo-taskboard-column-cards-gap,
+    $kendo-taskboard-pane-width: $kendo-taskboard-pane-width,
+    $kendo-taskboard-pane-padding-y: $kendo-taskboard-pane-padding-y,
+    $kendo-taskboard-pane-padding-x: $kendo-taskboard-pane-padding-x,
+    $kendo-taskboard-pane-border-width: $kendo-taskboard-pane-border-width,
+    $kendo-taskboard-pane-bg: $kendo-taskboard-pane-bg,
+    $kendo-taskboard-pane-text: $kendo-taskboard-pane-text,
+    $kendo-taskboard-pane-border: $kendo-taskboard-pane-border,
+    $kendo-taskboard-pane-header-padding-y: $kendo-taskboard-pane-header-padding-y,
+    $kendo-taskboard-pane-header-padding-x: $kendo-taskboard-pane-header-padding-x,
+    $kendo-taskboard-pane-header-font-weight: $kendo-taskboard-pane-header-font-weight,
+    $kendo-taskboard-pane-header-text: $kendo-taskboard-pane-header-text,
+    $kendo-taskboard-pane-content-padding-y: $kendo-taskboard-pane-content-padding-y,
+    $kendo-taskboard-pane-content-padding-x: $kendo-taskboard-pane-content-padding-x,
+    $kendo-taskboard-pane-actions-padding-y: $kendo-taskboard-pane-actions-padding-y,
+    $kendo-taskboard-pane-actions-padding-x: $kendo-taskboard-pane-actions-padding-x,
+    $kendo-taskboard-card-padding-y: $kendo-taskboard-card-padding-y,
+    $kendo-taskboard-card-padding-x: $kendo-taskboard-card-padding-x,
+    $kendo-taskboard-card-border-width: $kendo-taskboard-card-border-width,
+    $kendo-taskboard-card-border-radius: $kendo-taskboard-card-border-radius,
+    $kendo-taskboard-card-shadow: $kendo-taskboard-card-shadow,
+    $kendo-taskboard-card-bg: $kendo-taskboard-card-bg,
+    $kendo-taskboard-card-text: $kendo-taskboard-card-text,
+    $kendo-taskboard-card-border: $kendo-taskboard-card-border,
+    $kendo-taskboard-card-category-border-width: $kendo-taskboard-card-category-border-width,
+    $kendo-taskboard-card-hover-border: $kendo-taskboard-card-hover-border,
+    $kendo-taskboard-card-focus-border: $kendo-taskboard-card-focus-border,
+    $kendo-taskboard-card-focus-shadow: $kendo-taskboard-card-focus-shadow,
+    $kendo-taskboard-card-selected-border: $kendo-taskboard-card-selected-border,
+    $kendo-taskboard-card-selected-shadow: $kendo-taskboard-card-selected-shadow,
+    $kendo-taskboard-card-header-text: $kendo-taskboard-card-header-text,
+    $kendo-taskboard-card-header-hover-text: $kendo-taskboard-card-header-hover-text,
+    $kendo-taskboard-card-header-focus-text: $kendo-taskboard-card-header-focus-text,
+    $kendo-taskboard-drag-placeholder-border-width: $kendo-taskboard-drag-placeholder-border-width,
+    $kendo-taskboard-drag-placeholder-border-radius: $kendo-taskboard-drag-placeholder-border-radius,
+    $kendo-taskboard-drag-placeholder-bg: $kendo-taskboard-drag-placeholder-bg,
+    $kendo-taskboard-drag-placeholder-border: $kendo-taskboard-drag-placeholder-border
+);

package/scss/textarea/_layout.scss

@@ -1,11 +1,4 @@
-@mixin kendo-textarea--layout-base() {
-
-    // Textarea
-    .k-textarea:has(.k-input-inner[style*="width"]) {
-        width: max-content;
-    }
-
-}
+@use "@progress/kendo-theme-core/scss/components/textarea/_layout.scss" as *;
 
 
 @mixin kendo-textarea--layout() {

package/scss/textarea/_theme.scss

@@ -1,11 +1,6 @@
-@mixin kendo-textarea--theme-base() {
-
-    // Textarea
-    .k-textarea {}
-
-}
+@use "@progress/kendo-theme-core/scss/components/textarea/_theme.scss" as *;
 
 
 @mixin kendo-textarea--theme() {
-    @include kendo-textarea--theme-base();
+    @include  kendo-textarea--theme-base();
 }

package/scss/textbox/_layout.scss

@@ -1,9 +1,4 @@
-@mixin kendo-textbox--layout-base() {
-
-    // Textbox
-    .k-textbox {}
-
-}
+@use "@progress/kendo-theme-core/scss/components/textbox/_layout.scss" as *;
 
 
 @mixin kendo-textbox--layout() {

package/scss/textbox/_theme.scss

@@ -1,9 +1,4 @@
-@mixin kendo-textbox--theme-base() {
-
-    // Textbox
-    .k-textbox {}
-
-}
+@use "@progress/kendo-theme-core/scss/components/textbox/_theme.scss" as *;
 
 
 @mixin kendo-textbox--theme() {

package/scss/tilelayout/_layout.scss

@@ -1,50 +1,4 @@
-@use "../core/_index.scss" as *;
-@use "./variables.scss" as *;
-
-@mixin kendo-tile-layout--layout-base() {
-
-    .k-tilelayout {
-        border-width: $kendo-tile-layout-border-width;
-        border-style: solid;
-        box-sizing: border-box;
-        outline: 0;
-        display: grid;
-        position: relative;
-        padding: $kendo-tile-layout-padding-y $kendo-tile-layout-padding-x;
-        -webkit-touch-callout: none;
-        -webkit-tap-highlight-color: $kendo-color-rgba-transparent;
-
-        .k-card {
-            @include box-shadow( none );
-            border-width: $kendo-tile-layout-card-border-width;
-        }
-    }
-
-    .k-tilelayout-item {
-        position: relative;
-        z-index: 0;
-    }
-
-    .k-layout-item-hint {
-        @include border-radius( $kendo-tile-layout-hint-border-radius );
-        border-width: $kendo-tile-layout-hint-border-width;
-        border-style: solid;
-        position: relative;
-
-        &.k-layout-item-hint-resize {
-            z-index: 3;
-        }
-    }
-
-    .k-tilelayout-item-header.k-card-header {
-        z-index: 0;
-    }
-
-    .k-tilelayout-item-body {
-        min-height: 0;
-    }
-
-}
+@use "@progress/kendo-theme-core/scss/components/tilelayout/_layout.scss" as *;
 
 
 @mixin kendo-tile-layout--layout() {

package/scss/tilelayout/_theme.scss

@@ -1,27 +1,4 @@
-@use "../core/_index.scss" as *;
-@use "./variables.scss" as *;
-
-@mixin kendo-tile-layout--theme-base() {
-
-    .k-tilelayout {
-        @include fill(
-            $bg: $kendo-tile-layout-bg
-        );
-    }
-
-    .k-tilelayout-item:focus,
-    .k-tilelayout-item.k-focus {
-        @include focus-indicator($kendo-tile-layout-card-focus-shadow);
-    }
-
-    .k-layout-item-hint {
-        @include fill(
-            $bg: $kendo-tile-layout-hint-bg,
-            $border: $kendo-tile-layout-hint-border
-        );
-    }
-
-}
+@use "@progress/kendo-theme-core/scss/components/tilelayout/_theme.scss" as *;
 
 
 @mixin kendo-tile-layout--theme() {

package/scss/tilelayout/_variables.scss

@@ -40,3 +40,16 @@ $kendo-tile-layout-hint-bg: rgba(255, 255, 255, .2) !default;
 
 
 
+
+@forward "@progress/kendo-theme-core/scss/components/tilelayout/_variables.scss" with (
+    $kendo-tile-layout-border-width: $kendo-tile-layout-border-width,
+    $kendo-tile-layout-bg: $kendo-tile-layout-bg,
+    $kendo-tile-layout-padding-x: $kendo-tile-layout-padding-x,
+    $kendo-tile-layout-padding-y: $kendo-tile-layout-padding-y,
+    $kendo-tile-layout-card-border-width: $kendo-tile-layout-card-border-width,
+    $kendo-tile-layout-card-focus-shadow: $kendo-tile-layout-card-focus-shadow,
+    $kendo-tile-layout-hint-border-width: $kendo-tile-layout-hint-border-width,
+    $kendo-tile-layout-hint-border-radius: $kendo-tile-layout-hint-border-radius,
+    $kendo-tile-layout-hint-border: $kendo-tile-layout-hint-border,
+    $kendo-tile-layout-hint-bg: $kendo-tile-layout-hint-bg
+);

package/scss/time-marker/_layout.scss

@@ -1,22 +1,4 @@
-@use "./_variables.scss" as *;
-
-@mixin kendo-time-marker--layout-base() {
-
-    .k-current-time {
-        width: $kendo-current-time-width;
-        position: absolute;
-
-        &.k-current-time-arrow-left,
-        &.k-current-time-arrow-right,
-        &.k-current-time-arrow-down {
-            width: 0;
-            height: 0;
-            background: transparent;
-            border: 4px solid transparent;
-        }
-    }
-
-}
+@use "@progress/kendo-theme-core/scss/components/time-marker/_layout.scss" as *;
 
 @mixin kendo-time-marker--layout() {
     @include kendo-time-marker--layout-base();

package/scss/time-marker/_theme.scss

@@ -1,24 +1,4 @@
-@use "./_variables.scss" as *;
-
-@mixin kendo-time-marker--theme-base() {
-
-    .k-current-time {
-        background: $kendo-current-time-color;
-
-        &.k-current-time-arrow-left {
-            border-right-color: $kendo-current-time-color;
-        }
-
-        &.k-current-time-arrow-right {
-            border-left-color: $kendo-current-time-color;
-        }
-
-        &.k-current-time-arrow-down {
-            border-top-color: $kendo-current-time-color;
-        }
-    }
-
-}
+@use "@progress/kendo-theme-core/scss/components/time-marker/_theme.scss" as *;
 
 
 @mixin kendo-time-marker--theme() {