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

package/scss/switch/_variables.scss

@@ -193,3 +193,62 @@ $kendo-switch-on-thumb-hover-border: null !default;
 /// The background gradient of the thumb when the hovered Switch is checked.
 /// @group switch
 $kendo-switch-on-thumb-hover-gradient: null !default;
+
+@forward "@progress/kendo-theme-core/scss/components/switch/_variables.scss" with (
+    $kendo-switch-font-family: $kendo-switch-font-family,
+    $kendo-switch-track-border-width: $kendo-switch-track-border-width,
+    $kendo-switch-thumb-border-width: $kendo-switch-thumb-border-width,
+    $kendo-switch-label-text-transform: $kendo-switch-label-text-transform,
+    $kendo-switch-label-display: $kendo-switch-label-display,
+    $kendo-switch-sizes: $kendo-switch-sizes,
+    $kendo-switch-off-track-bg: $kendo-switch-off-track-bg,
+    $kendo-switch-off-track-text: $kendo-switch-off-track-text,
+    $kendo-switch-off-track-border: $kendo-switch-off-track-border,
+    $kendo-switch-off-track-gradient: $kendo-switch-off-track-gradient,
+    $kendo-switch-off-track-hover-bg: $kendo-switch-off-track-hover-bg,
+    $kendo-switch-off-track-hover-text: $kendo-switch-off-track-hover-text,
+    $kendo-switch-off-track-hover-border: $kendo-switch-off-track-hover-border,
+    $kendo-switch-off-track-hover-gradient: $kendo-switch-off-track-hover-gradient,
+    $kendo-switch-off-track-focus-bg: $kendo-switch-off-track-focus-bg,
+    $kendo-switch-off-track-focus-text: $kendo-switch-off-track-focus-text,
+    $kendo-switch-off-track-focus-border: $kendo-switch-off-track-focus-border,
+    $kendo-switch-off-track-focus-gradient: $kendo-switch-off-track-focus-gradient,
+    $kendo-switch-off-track-focus-ring: $kendo-switch-off-track-focus-ring,
+    $kendo-switch-off-track-disabled-bg: $kendo-switch-off-track-disabled-bg,
+    $kendo-switch-off-track-disabled-text: $kendo-switch-off-track-disabled-text,
+    $kendo-switch-off-track-disabled-border: $kendo-switch-off-track-disabled-border,
+    $kendo-switch-off-track-disabled-gradient: $kendo-switch-off-track-disabled-gradient,
+    $kendo-switch-off-thumb-bg: $kendo-switch-off-thumb-bg,
+    $kendo-switch-off-thumb-text: $kendo-switch-off-thumb-text,
+    $kendo-switch-off-thumb-border: $kendo-switch-off-thumb-border,
+    $kendo-switch-off-thumb-gradient: $kendo-switch-off-thumb-gradient,
+    $kendo-switch-off-thumb-hover-bg: $kendo-switch-off-thumb-hover-bg,
+    $kendo-switch-off-thumb-hover-text: $kendo-switch-off-thumb-hover-text,
+    $kendo-switch-off-thumb-hover-border: $kendo-switch-off-thumb-hover-border,
+    $kendo-switch-off-thumb-hover-gradient: $kendo-switch-off-thumb-hover-gradient,
+    $kendo-switch-on-track-bg: $kendo-switch-on-track-bg,
+    $kendo-switch-on-track-text: $kendo-switch-on-track-text,
+    $kendo-switch-on-track-border: $kendo-switch-on-track-border,
+    $kendo-switch-on-track-gradient: $kendo-switch-on-track-gradient,
+    $kendo-switch-on-track-hover-bg: $kendo-switch-on-track-hover-bg,
+    $kendo-switch-on-track-hover-text: $kendo-switch-on-track-hover-text,
+    $kendo-switch-on-track-hover-border: $kendo-switch-on-track-hover-border,
+    $kendo-switch-on-track-hover-gradient: $kendo-switch-on-track-hover-gradient,
+    $kendo-switch-on-track-focus-bg: $kendo-switch-on-track-focus-bg,
+    $kendo-switch-on-track-focus-text: $kendo-switch-on-track-focus-text,
+    $kendo-switch-on-track-focus-border: $kendo-switch-on-track-focus-border,
+    $kendo-switch-on-track-focus-gradient: $kendo-switch-on-track-focus-gradient,
+    $kendo-switch-on-track-focus-ring: $kendo-switch-on-track-focus-ring,
+    $kendo-switch-on-track-disabled-bg: $kendo-switch-on-track-disabled-bg,
+    $kendo-switch-on-track-disabled-text: $kendo-switch-on-track-disabled-text,
+    $kendo-switch-on-track-disabled-border: $kendo-switch-on-track-disabled-border,
+    $kendo-switch-on-track-disabled-gradient: $kendo-switch-on-track-disabled-gradient,
+    $kendo-switch-on-thumb-bg: $kendo-switch-on-thumb-bg,
+    $kendo-switch-on-thumb-text: $kendo-switch-on-thumb-text,
+    $kendo-switch-on-thumb-border: $kendo-switch-on-thumb-border,
+    $kendo-switch-on-thumb-gradient: $kendo-switch-on-thumb-gradient,
+    $kendo-switch-on-thumb-hover-bg: $kendo-switch-on-thumb-hover-bg,
+    $kendo-switch-on-thumb-hover-text: $kendo-switch-on-thumb-hover-text,
+    $kendo-switch-on-thumb-hover-border: $kendo-switch-on-thumb-hover-border,
+    $kendo-switch-on-thumb-hover-gradient: $kendo-switch-on-thumb-hover-gradient
+);

package/scss/table/_layout.scss

@@ -1,291 +1,4 @@
-@use "./_variables.scss" as *;
-@use "sass:map";
-
-@mixin kendo-table--layout-base() {
-
-    // Table
-    .k-table {
-        width: 100%;
-        max-width: none;
-        border-width: $kendo-table-border-width;
-        border-style: solid;
-        font-size: $kendo-table-font-size;
-        line-height: $kendo-table-line-height;
-        text-align: start;
-        border-collapse: collapse;
-        border-spacing: 0;
-        empty-cells: show;
-        outline: none;
-    }
-
-
-    // Data table
-    .k-data-table {
-        border-width: $kendo-table-border-width;
-        border-style: solid;
-
-        .k-table {
-            table-layout: fixed;
-        }
-    }
-
-
-    // Table native parts
-    .k-table-thead,
-    .k-table-tbody,
-    .k-table-tfoot,
-    .k-table-row,
-    .k-table-alt-row {
-        border-color: inherit;
-        text-align: inherit;
-    }
-    .k-table-th,
-    .k-table-td {
-        padding-block: $kendo-table-cell-padding-y;
-        padding-inline: $kendo-table-cell-padding-x;
-        border-width: 0 0 $kendo-table-cell-horizontal-border-width $kendo-table-cell-vertical-border-width;
-        border-style: solid;
-        border-color: inherit;
-        box-sizing: border-box;
-        font-weight: normal;
-        text-align: inherit;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-        display: table-cell;
-        overflow: hidden;
-        position: relative;
-
-        &:first-child {
-            border-left-width: 0;
-        }
-    }
-    .k-table-th {
-        border-bottom-width: 1px;
-    }
-
-
-    // Table header
-    .k-table-header {
-        padding-inline-end: var(--kendo-scrollbar-width);
-        border-width: 0 0 1px;
-        border-style: solid;
-        box-sizing: border-box;
-
-        .k-table {
-            border-width: 0;
-        }
-    }
-    .k-table-header-wrap {
-        margin-right: -1px;
-        width: 100%;
-        border-width: 0 $kendo-table-cell-vertical-border-width 0 0;
-        border-style: solid;
-        border-color: inherit;
-        overflow: hidden;
-    }
-    .k-table-header,
-    .k-table-header-wrap {
-        > .k-table {
-            margin-bottom: -1px;
-        }
-    }
-    .k-table-group-sticky-header {
-        flex: none;
-
-        .k-table-th {
-            display: flex;
-            flex-flow: row nowrap;
-            align-items: center;
-            align-content: center;
-        }
-    }
-
-
-    // Table list
-    .k-table-list {
-        margin: 0;
-        padding: 0;
-        width: 100%;
-        max-width: none;
-        border-width: 0;
-        display: table;
-        border-collapse: collapse;
-        border-spacing: 0;
-        table-layout: fixed;
-        empty-cells: show;
-        list-style: none;
-        outline: none;
-
-        .k-table-row {
-            position: relative;
-        }
-
-        .k-table-row,
-        .k-table-group-row {
-            width: 100%;
-            box-sizing: border-box;
-            display: table-row;
-        }
-        .k-table-row.k-first {
-            border-top: 1px solid currentColor;
-        }
-
-        .k-table-th,
-        .k-table-td {
-            vertical-align: middle;
-        }
-
-        .k-table-group-row {
-            position: sticky;
-
-            &::before {
-                content: "\200b";
-                padding-block: $kendo-table-cell-padding-y;
-                padding-inline: 0;
-                width: 0;
-                display: block;
-                overflow: hidden;
-            }
-
-            .k-table-th {
-                width: 100%;
-                border-color: inherit;
-                color: inherit;
-                background-color: inherit;
-                position: absolute;
-                top: 0;
-            }
-        }
-
-        // stylelint-disable declaration-no-important
-        .k-table-spacer-td {
-            padding: 0 !important;
-            width: 0 !important;
-            border-left-width: 0 !important;
-            border-right-width: 0 !important;
-        }
-        .k-table-group-td {
-            padding: 0 !important;
-            width: 0 !important;
-            border-left-width: 0 !important;
-            border-right-width: 0 !important;
-            overflow: visible;
-
-            > span {
-                font-size: .75em;
-                position: absolute;
-                top: 0;
-                right: 0;
-            }
-        }
-        // stylelint-enable declaration-no-important
-    }
-
-
-    // Virtualization
-    .k-virtual-table .k-table-row,
-    .k-virtual-table .k-table-group-row {
-        position: absolute;
-        width: 100%;
-    }
-
-
-    // Table scroller
-    .k-table-scroller {
-        position: relative;
-        overflow: auto;
-
-        > .k-table {
-            border-width: 0;
-        }
-    }
-
-
-    // Table footer
-    .k-table-footer {
-        padding-inline-end: var(--kendo-scrollbar-width);
-        border-width: 1px 0 0;
-        border-style: solid;
-        box-sizing: border-box;
-
-        .k-table {
-            border-width: 0;
-        }
-    }
-    .k-table-footer-wrap {
-        margin-right: -1px;
-        width: 100%;
-        border-width: 0 $kendo-table-cell-vertical-border-width 0 0;
-        border-style: solid;
-        border-color: inherit;
-        overflow: hidden;
-    }
-
-
-    // Sizes
-    @each $size, $size-props in $kendo-table-sizes {
-        $_font-size: map.get( $size-props, font-size);
-        $_line-height: map.get( $size-props, line-height);
-        $_cell-padding-x: map.get( $size-props, cell-padding-x);
-        $_cell-padding-y: map.get( $size-props, cell-padding-y);
-
-        .k-table-#{$size} {
-            font-size: $_font-size;
-            line-height: $_line-height;
-        }
-
-        .k-table-#{$size} .k-table-th,
-        .k-table-#{$size} .k-table-td {
-            padding-block: $_cell-padding-y;
-            padding-inline: $_cell-padding-x;
-        }
-
-        .k-table-#{$size} .k-table-list .k-table-group-td > span {
-            padding-block: 0;
-            padding-inline: calc( #{$_cell-padding-x} / 2 );
-        }
-
-        .k-table-#{$size} .k-table-list .k-table-group-row::before {
-            padding-block: $_cell-padding-y;
-            padding-inline: 0;
-        }
-    }
-
-
-    // RTL
-    .k-rtl,
-    [dir="rtl"] {
-        &.k-table,
-        .k-table {
-
-            .k-table-th,
-            .k-table-td {
-                border-left-width: 0;
-                border-right-width: $kendo-table-cell-vertical-border-width;
-
-                &:first-child {
-                    border-right-width: 0;
-                }
-            }
-
-            .k-table-header-wrap,
-            .k-table-footer-wrap {
-                margin-right: 0;
-                margin-left: -1px;
-                border-left-width: $kendo-table-cell-vertical-border-width;
-                border-right-width: 0;
-            }
-        }
-
-        .k-table-list {
-            .k-table-group-td > span {
-                left: 0;
-                right: auto;
-            }
-        }
-    }
-
-}
+@use "@progress/kendo-theme-core/scss/components/table/_layout.scss" as *;
 
 
 @mixin kendo-table--layout() {

package/scss/table/_theme.scss

@@ -1,91 +1,4 @@
-@use "../core/_index.scss" as *;
-@use "./_variables.scss" as *;
-
-@mixin kendo-table--theme-base() {
-
-    // Table
-    .k-table,
-    .k-data-table {
-        border-color: $kendo-table-border;
-        color: $kendo-table-text;
-        background-color: $kendo-table-bg;
-    }
-
-
-    // Table header
-    .k-table-thead,
-    .k-table-header,
-    .k-table-group-sticky-header {
-        border-color: $kendo-table-header-border;
-        color: $kendo-table-header-text;
-        background-color: $kendo-table-header-bg;
-    }
-
-
-    // Table footer
-    .k-table-tfoot,
-    .k-table-footer {
-        border-color: $kendo-table-footer-border;
-        color: $kendo-table-footer-text;
-        background-color: $kendo-table-footer-bg;
-    }
-
-
-    // Group row
-    .k-table-group-row {
-        border-color: $kendo-table-group-row-border;
-        color: $kendo-table-group-row-text;
-        background-color: $kendo-table-group-row-bg;
-    }
-    .k-table-group-td > span {
-        color: $kendo-table-bg;
-        background-color: $kendo-table-text;
-    }
-
-
-    // Alternating row
-    .k-table-alt-row {
-        border-color: $kendo-table-alt-row-border;
-        color: $kendo-table-alt-row-text;
-        background-color: $kendo-table-alt-row-bg;
-    }
-
-
-    // Hover state
-    .k-table-tbody .k-table-row:hover,
-    .k-table-list .k-table-row:hover,
-    .k-table-tbody .k-table-row.k-hover,
-    .k-table-list .k-table-row.k-hover {
-        border-color: $kendo-table-hover-border;
-        color: $kendo-table-hover-text;
-        background-color: $kendo-table-hover-bg;
-    }
-
-
-    // Focus state
-    .k-table-tbody .k-table-row,
-    .k-table-list .k-table-row,
-    .k-table-tbody .k-table-td,
-    .k-table-list .k-table-td {
-        &.k-focus,
-        &:focus {
-            border-color: $kendo-table-focus-border;
-            color: $kendo-table-focus-text;
-            background-color: $kendo-table-focus-bg;
-            @include focus-indicator( $kendo-table-focus-shadow, inset );
-        }
-    }
-
-
-    // Selected state
-    .k-table-tbody .k-table-row.k-selected > .k-table-td,
-    .k-table-list .k-table-row.k-selected {
-        border-color: $kendo-table-selected-border;
-        color: $kendo-table-selected-text;
-        background-color: $kendo-table-selected-bg;
-    }
-
-}
+@use "@progress/kendo-theme-core/scss/components/table/_theme.scss" as *;
 
 
 @mixin kendo-table--theme() {

package/scss/table/_variables.scss

@@ -154,3 +154,46 @@ $kendo-table-selected-text: null !default;
 /// Border color of selected rows in table.
 /// @group table
 $kendo-table-selected-border: null !default;
+
+@forward "@progress/kendo-theme-core/scss/components/table/_variables.scss" with (
+    $kendo-table-border-width: $kendo-table-border-width,
+    $kendo-table-cell-vertical-border-width: $kendo-table-cell-vertical-border-width,
+    $kendo-table-cell-horizontal-border-width: $kendo-table-cell-horizontal-border-width,
+    $kendo-table-font-size: $kendo-table-font-size,
+    $kendo-table-line-height: $kendo-table-line-height,
+    $kendo-table-cell-padding-x: $kendo-table-cell-padding-x,
+    $kendo-table-cell-padding-y: $kendo-table-cell-padding-y,
+    $kendo-table-sm-cell-padding-x: $kendo-table-sm-cell-padding-x,
+    $kendo-table-sm-cell-padding-y: $kendo-table-sm-cell-padding-y,
+    $kendo-table-md-cell-padding-x: $kendo-table-md-cell-padding-x,
+    $kendo-table-md-cell-padding-y: $kendo-table-md-cell-padding-y,
+    $kendo-table-lg-cell-padding-x: $kendo-table-lg-cell-padding-x,
+    $kendo-table-lg-cell-padding-y: $kendo-table-lg-cell-padding-y,
+    $kendo-table-sizes: $kendo-table-sizes,
+    $kendo-table-bg: $kendo-table-bg,
+    $kendo-table-text: $kendo-table-text,
+    $kendo-table-border: $kendo-table-border,
+    $kendo-table-header-bg: $kendo-table-header-bg,
+    $kendo-table-header-text: $kendo-table-header-text,
+    $kendo-table-header-border: $kendo-table-header-border,
+    $kendo-table-header-gradient: $kendo-table-header-gradient,
+    $kendo-table-footer-bg: $kendo-table-footer-bg,
+    $kendo-table-footer-text: $kendo-table-footer-text,
+    $kendo-table-footer-border: $kendo-table-footer-border,
+    $kendo-table-group-row-bg: $kendo-table-group-row-bg,
+    $kendo-table-group-row-text: $kendo-table-group-row-text,
+    $kendo-table-group-row-border: $kendo-table-group-row-border,
+    $kendo-table-alt-row-bg: $kendo-table-alt-row-bg,
+    $kendo-table-alt-row-text: $kendo-table-alt-row-text,
+    $kendo-table-alt-row-border: $kendo-table-alt-row-border,
+    $kendo-table-hover-bg: $kendo-table-hover-bg,
+    $kendo-table-hover-text: $kendo-table-hover-text,
+    $kendo-table-hover-border: $kendo-table-hover-border,
+    $kendo-table-focus-bg: $kendo-table-focus-bg,
+    $kendo-table-focus-text: $kendo-table-focus-text,
+    $kendo-table-focus-border: $kendo-table-focus-border,
+    $kendo-table-focus-shadow: $kendo-table-focus-shadow,
+    $kendo-table-selected-bg: $kendo-table-selected-bg,
+    $kendo-table-selected-text: $kendo-table-selected-text,
+    $kendo-table-selected-border: $kendo-table-selected-border
+);