@progress/kendo-theme-classic 4.42.1-dev.4 → 5.0.0-alpha.3

package/modules/@progress/kendo-theme-default/scss/chat/_variables.scss

@@ -1,87 +0,0 @@
-// Chat
-$chat-padding-x: 16px !default;
-$chat-padding-y: 16px !default;
-$chat-width: 500px !default;
-$chat-height: 600px !default;
-$chat-border-width: 1px !default;
-$chat-font-family: $font-family !default;
-$chat-font-size: $font-size !default;
-$chat-line-height: $line-height !default;
-
-$chat-item-spacing-x: 8px !default;
-$chat-item-spacing-y: 16px !default;
-
-$chat-message-list-padding-x: $chat-padding-x !default;
-$chat-message-list-padding-y: $chat-padding-y !default;
-$chat-message-list-spacing: $chat-item-spacing-y !default;
-
-$chat-timestamp-font-size: smaller !default;
-$chat-timestamp-line-height: null !default;
-$chat-timestamp-transform: uppercase !default;
-$chat-timestamp-text: $subtle-text !default;
-$chat-timestamp-bg: null !default;
-
-$chat-bubble-padding-x: 12px !default;
-$chat-bubble-padding-y: 8px !default;
-$chat-bubble-spacing: 2px !default;
-$chat-bubble-line-height: 18px !default;
-
-$chat-bubble-border-radius: 12px !default;
-$chat-bubble-border-radius-sm: 2px !default;
-
-$chat-avatar-size: 32px !default;
-$chat-avatar-spacing: $chat-item-spacing-x !default;
-
-$chat-message-box-padding-x: $input-padding-x !default;
-$chat-message-box-padding-y: $input-padding-y !default;
-
-$chat-toolbar-padding-x: $toolbar-padding-x !default;
-$chat-toolbar-padding-y: $toolbar-padding-y !default;
-$chat-toolbar-spacing: $toolbar-spacing !default;
-$chat-toolbar-bg: $toolbar-bg !default;
-$chat-toolbar-text: $toolbar-text !default;
-$chat-toolbar-border: inherit !default;
-
-$chat-quick-reply-padding-x: 12px !default;
-$chat-quick-reply-padding-y: 8px !default;
-$chat-quick-reply-spacing: 8px !default;
-$chat-quick-reply-line-height: $chat-bubble-line-height !default;
-
-
-$chat-bg: $app-bg !default;
-$chat-text: $app-text !default;
-$chat-border: $app-border !default;
-
-$chat-bubble-bg: $component-bg !default;
-$chat-bubble-text: $component-text !default;
-$chat-bubble-border: $chat-bubble-bg !default;
-$chat-bubble-shadow: 0 1px 2px rgba( 0, 0, 0, .08) !default;
-$chat-bubble-hover-shadow: 0 1px 2px rgba( 0, 0, 0, .16) !default;
-$chat-bubble-selected-shadow: 0 3px 10px rgba( 0, 0, 0, .16) !default;
-
-$chat-alt-bubble-bg: $primary !default;
-$chat-alt-bubble-text: contrast-wcag( $chat-alt-bubble-bg ) !default;
-$chat-alt-bubble-border: $chat-alt-bubble-bg !default;
-$chat-alt-bubble-shadow: 0 1px 2px rgba( $chat-alt-bubble-bg, .2 ) !default;
-$chat-alt-bubble-hover-shadow: 0 1px 2px rgba( $chat-alt-bubble-bg, .2 ) !default;
-$chat-alt-bubble-selected-shadow: 0 3px 10px rgba( $chat-alt-bubble-bg, .4 ) !default;
-
-$chat-quick-reply-bg: transparent !default;
-$chat-quick-reply-text: $primary !default;
-$chat-quick-reply-border: $primary !default;
-
-$chat-quick-reply-hover-bg: $primary !default;
-$chat-quick-reply-hover-text: $primary-contrast !default;
-$chat-quick-reply-hover-border: $primary !default;
-
-$chat-message-box-bg: $input-bg !default;
-$chat-message-box-text: $input-text !default;
-$chat-message-box-border: inherit !default;
-$chat-message-box-focus-shadow: 0 0 40px rgba( $input-text, .1 ) !default;
-
-$chat-message-box-button-hover-text: $primary !default;
-
-$chat-toolbar-box-button-hover-text: $primary !default;
-$chat-toolbar-box-button-hover-bg: transparent !default;
-
-$chat-toolbar-box-scroll-button-shadow: 0 0 20px 5px $chat-bg !default;

package/modules/@progress/kendo-theme-default/scss/checkbox/_index.scss

@@ -1,10 +0,0 @@
-@import "../core/_index.scss";
-
-
-// Dependencies
-
-
-// Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";

package/modules/@progress/kendo-theme-default/scss/checkbox/_layout.scss

@@ -1,272 +0,0 @@
-@include exports( "checkbox/layout" ) {
-
-    // Checkbox
-    .k-checkbox {
-        @include border-radius( $checkbox-radius );
-        margin: 0;
-        padding: 0;
-        width: $checkbox-size;
-        height: $checkbox-size;
-        line-height: initial;
-        border-width: $checkbox-border-width;
-        border-style: solid;
-        outline: 0;
-        box-sizing: border-box;
-        background-position: center;
-        background-repeat: no-repeat;
-        background-size: contain;
-        display: inline-block;
-        vertical-align: middle;
-        position: relative;
-        cursor: pointer;
-        -webkit-appearance: none;
-    }
-
-    // Checkbox indicator
-    .k-checkbox::before {
-        @if $checkbox-icon-type == "glyph" {
-            content: $checkbox-checked-glyph;
-            width: $checkbox-glyph-size;
-            height: $checkbox-glyph-size;
-            font-size: $checkbox-glyph-size;
-            font-family: $checkbox-glyph-font-family;
-            line-height: 1;
-            transform: scale(0) translate(-50%, -50%);
-            overflow: hidden;
-            position: absolute;
-            top: 50%;
-            left: 50%;
-        }
-
-        @if $checkbox-icon-type == "marker" {
-            content: "";
-            width: $checkbox-marker-checked-width;
-            height: $checkbox-marker-checked-height;
-            background-color: currentColor;
-            transform: scale(0) translate(-50%, -50%);
-            overflow: hidden;
-            position: absolute;
-            top: 50%;
-            left: 50%;
-        }
-    }
-
-
-    // Checked state
-    .k-checkbox:checked,
-    .k-checkbox.k-checked {
-        @if $checkbox-icon-type == "image" {
-            background-image: $checkbox-checked-image;
-        }
-
-        @if $checkbox-icon-type == "glyph" {
-            &::before {
-                transform: scale(1) translate(-50%, -50%);
-            }
-        }
-
-        @if $checkbox-icon-type == "marker" {
-            &::before {
-                transform: scale(1) translate(-50%, -50%);
-            }
-        }
-    }
-
-
-    // Indeterminate state
-    .k-checkbox:indeterminate,
-    .k-checkbox.k-indeterminate,
-    .k-checkbox.k-state-indeterminate {
-        @if $checkbox-icon-type == "image" {
-            background-image: $checkbox-indeterminate-image;
-        }
-
-        @if $checkbox-icon-type == "glyph" {
-            &::before {
-                content: $checkbox-indeterminate-glyph;
-                transform: scale(1) translate(-50%, -50%);
-            }
-        }
-
-        @if $checkbox-icon-type == "marker" {
-            &::before {
-                width: $checkbox-maker-indeterminate-width;
-                height: $checkbox-marker-indeterminate-height;
-                transform: scale(1) translate(-50%, -50%);
-            }
-        }
-    }
-
-
-    // Disabled state
-    .k-checkbox:disabled,
-    .k-checkbox.k-disabled,
-    .k-checkbox:disabled + .k-checkbox-label,
-    .k-checkbox.k-disabled + .k-checkbox-label {
-        @include disabled( $disabled-styling );
-    }
-
-    // Checkbox label
-    .k-checkbox-label {
-        margin: 0;
-        padding: 0;
-        line-height: $checkbox-line-height;
-        display: inline-flex;
-        align-items: flex-start;
-        vertical-align: middle;
-        position: relative;
-        cursor: pointer;
-
-        .k-label {
-            cursor: pointer;
-        }
-
-        .k-ripple {
-            top: $checkbox-size / 2;
-            left: $checkbox-size / 2;
-            right: auto;
-            bottom: auto;
-            width: $checkbox-size * 5 / 2;
-            height: $checkbox-size * 5 / 2;
-            transform: translate(-50%, -50%);
-            border-radius: 50%;
-
-            // Hide ripple temporarily
-            visibility: hidden !important; // sass-lint:disable-line no-important
-        }
-
-        .k-ripple-blob {
-            // sass-lint:disable-block no-important
-            // use !important until ripple can apply these styles from the script
-            top: 50% !important;
-            left: 50% !important;
-            width: 200% !important;
-            height: 200% !important;
-        }
-    }
-    .k-checkbox + .k-checkbox-label {
-        display: inline;
-    }
-    .k-checkbox + .k-checkbox-label,
-    .k-checkbox-label + .k-checkbox {
-        margin-left: $checkbox-label-margin-x;
-    }
-    .k-checkbox-label > .k-checkbox {
-        margin-right: $checkbox-label-margin-x;
-        flex-shrink: 0;
-    }
-    kendo-label.k-checkbox-label > .k-checkbox:last-child {
-        margin-right: 0;
-    }
-    kendo-label.k-checkbox-label > .k-label:first-child {
-        margin-right: $checkbox-label-margin-x;
-    }
-    kendo-label.k-checkbox-label > .k-label {
-        display: inline;
-    }
-
-
-    // Empty label
-    .k-checkbox-label:empty {
-        display: none;
-    }
-
-
-    // Label with no text
-    .k-checkbox-label.k-no-text {
-        min-width: 1px;
-    }
-
-
-    // Checkbox list
-    .k-checkbox-list {
-        margin: $checkbox-list-margin;
-        padding: $checkbox-list-padding;
-        list-style: none;
-
-        .k-checkbox-item {
-            padding: $checkbox-list-item-padding-y $checkbox-list-item-padding-x;
-        }
-    }
-
-    .k-list-horizontal {
-        .k-checkbox-item {
-            display: inline-block;
-            margin: 0 $checkbox-list-horizontal-item-margin-x 0 0;
-
-            &:last-child {
-                margin-right: 0;
-            }
-        }
-    }
-
-
-    // RTL
-    .k-rtl,
-    [dir="rtl"] {
-        .k-checkbox + .k-checkbox-label,
-        .k-checkbox-label + .k-checkbox {
-            margin-left: 0;
-            margin-right: $checkbox-label-margin-x;
-        }
-        .k-checkbox-label > .k-checkbox {
-            margin-right: 0;
-            margin-left: $checkbox-label-margin-x;
-        }
-        kendo-label.k-checkbox-label > .k-checkbox:last-child {
-            margin-left: 0;
-        }
-        kendo-label.k-checkbox-label > .k-label:first-child {
-            margin-right: 0;
-            margin-left: $checkbox-label-margin-x;
-        }
-
-        .k-list-horizontal {
-            .k-checkbox-item {
-                margin-right: 0;
-                margin-left: $checkbox-list-horizontal-item-margin-x;
-
-                &:last-child {
-                    margin-left: 0;
-                }
-            }
-        }
-    }
-
-    .k-ripple-container {
-        .k-checkbox::after {
-            content: "";
-            display: block;
-            position: absolute;
-            left: 0;
-            top: 0;
-            width: $checkbox-ripple-size;
-            height: $checkbox-ripple-size;
-            margin-left: $checkbox-ripple-margin;
-            margin-top: $checkbox-ripple-margin;
-            border-radius: 100%;
-            z-index: 1;
-            transform: scale(0);
-        }
-
-        .k-checkbox:disabled::after,
-        .k-checkbox.k-disabled::after {
-            display: none;
-        }
-    }
-
-}
-
-
-
-
-@include exports( "checkbox/layout/edge" ) {
-
-    .k-checkbox::-ms-check {
-        border-width: 1px;
-        border-color: inherit;
-        color: inherit;
-        background-color: inherit;
-    }
-
-}

package/modules/@progress/kendo-theme-default/scss/checkbox/_theme.scss

@@ -1,105 +0,0 @@
-@include exports("checkbox/theme") {
-
-    // Checkbox
-    .k-checkbox {
-        @include fill(
-            $checkbox-text,
-            $checkbox-bg,
-            $checkbox-border
-        );
-    }
-
-
-    // Hover state
-    .k-checkbox:hover,
-    .k-checkbox.k-state-hover {
-        @include fill(
-            $checkbox-hovered-text,
-            $checkbox-hovered-bg,
-            $checkbox-hovered-border
-        );
-    }
-
-
-    // Focus state
-    .k-checkbox:focus,
-    .k-checkbox.k-state-focus {
-        @include fill( $border: $checkbox-focused-border );
-        @include box-shadow( $checkbox-focused-shadow );
-    }
-
-
-    // Indeterminate
-    .k-checkbox:indeterminate,
-    .k-checkbox.k-state-indeterminate,
-    .k-checkbox.k-indeterminate {
-        @include fill(
-            $checkbox-indeterminate-text,
-            $checkbox-indeterminate-bg,
-            $checkbox-indeterminate-border
-        );
-    }
-
-
-    // Checked
-    .k-checkbox:checked,
-    .k-checkbox.k-checked {
-        @include fill(
-            $checkbox-checked-text,
-            $checkbox-checked-bg,
-            $checkbox-checked-border
-        );
-    }
-    .k-checkbox:checked:focus,
-    .k-checkbox.k-checked.k-state-focus {
-        @include fill( $border: $checkbox-focused-checked-border );
-        @include box-shadow( $checkbox-focused-checked-shadow );
-    }
-
-
-    // Disabled
-    .k-checkbox:disabled,
-    .k-checkbox.k-disabled {
-        @include fill(
-            $checkbox-disabled-text,
-            $checkbox-disabled-bg,
-            $checkbox-disabled-border
-        );
-    }
-    .k-checkbox:checked:disabled,
-    .k-checkbox:indeterminate:disabled,
-    .k-checkbox.k-state-indeterminate:disabled,
-    .k-checkbox.k-checked.k-disabled,
-    .k-checkbox.k-indeterminate.k-disabled {
-        @include fill(
-            $checkbox-disabled-checked-text,
-            $checkbox-disabled-checked-bg,
-            $checkbox-disabled-checked-border
-        );
-    }
-
-
-    // Invalid
-    .k-checkbox.k-invalid,
-    .k-checkbox.k-state-invalid,
-    .k-checkbox.ng-invalid.ng-touched,
-    .k-checkbox.ng-invalid.ng-dirty {
-        @include fill( $border: $checkbox-invalid-border );
-    }
-    .k-checkbox.k-invalid + .k-checkbox-label,
-    .k-checkbox.k-state-invalid + .k-checkbox-label,
-    .k-checkbox.ng-invalid.ng-touched + .k-checkbox-label,
-    .k-checkbox.ng-invalid.ng-dirty + .k-checkbox-label {
-        @include fill( $color: $checkbox-invalid-text );
-    }
-
-
-    // Ripple
-    .k-ripple-container {
-        .k-checkbox::after {
-            background: $checkbox-checked-bg;
-            opacity: $checkbox-ripple-opacity;
-        }
-    }
-
-}

package/modules/@progress/kendo-theme-default/scss/checkbox/_variables.scss

@@ -1,73 +0,0 @@
-// Checkbox
-$checkbox-size: map-get( $spacing, 4 ) !default;
-$checkbox-radius: map-get( $spacing, thin ) !default;
-$checkbox-border-width: 1px !default;
-$checkbox-line-height: calc( #{$checkbox-size} + #{$checkbox-border-width} ) !default;
-
-$checkbox-bg: $white !default;
-$checkbox-text: transparent !default;
-$checkbox-border: $base-border !default;
-
-$checkbox-hovered-bg: null !default;
-$checkbox-hovered-text: null !default;
-$checkbox-hovered-border: null !default;
-
-$checkbox-checked-bg: $primary !default;
-$checkbox-checked-text: contrast-wcag( $checkbox-checked-bg ) !default;
-$checkbox-checked-border: $checkbox-checked-bg !default;
-
-$checkbox-indeterminate-bg: $checkbox-bg !default;
-$checkbox-indeterminate-text: $checkbox-checked-bg !default;
-$checkbox-indeterminate-border: $checkbox-border !default;
-
-$checkbox-focused-border: null !default;
-$checkbox-focused-shadow: 0 0 0 2px rgba(0, 0, 0, .06) !default;
-$checkbox-focused-checked-border: null !default;
-$checkbox-focused-checked-shadow: 0 0 0 2px rgba( $primary, .3 ) !default;
-
-$checkbox-disabled-bg: null !default;
-$checkbox-disabled-text: null !default;
-$checkbox-disabled-border: null !default;
-
-$checkbox-disabled-checked-bg: null !default;
-$checkbox-disabled-checked-text: null !default;
-$checkbox-disabled-checked-border: null !default;
-
-$checkbox-invalid-bg: null !default;
-$checkbox-invalid-text: $invalid-text !default;
-$checkbox-invalid-border: $invalid-border !default;
-
-
-// Checkbox indicator
-$checkbox-icon-type: glyph !default;
-
-$checkbox-glyph-font-family: "WebComponentsIcons", monospace !default;
-$checkbox-glyph-size: 12px !default;
-$checkbox-checked-glyph: "\e118" !default;
-$checkbox-indeterminate-glyph: "\e121" !default;
-
-$checkbox-checked-image: null !default;
-$checkbox-indeterminate-image: null !default;
-
-$checkbox-marker-checked-width: ( $checkbox-size / 2 ) !default;
-$checkbox-marker-checked-height: ( $checkbox-size / 2 ) !default;
-$checkbox-marker-indeterminate-width: ( $checkbox-size / 2 ) !default;
-$checkbox-marker-indeterminate-height: ( $checkbox-size / 2 ) !default;
-
-
-// Checkbox label
-$checkbox-label-margin-x: map-get( $spacing, 1 ) !default;
-
-
-// Checkbox list
-$checkbox-list-margin: 0px !default;
-$checkbox-list-padding: 0px !default;
-$checkbox-list-item-padding-x: 0px !default;
-$checkbox-list-item-padding-y: $list-item-padding-y !default;
-$checkbox-list-horizontal-item-margin-x: 32px !default;
-
-
-// Checkbox ripple
-$checkbox-ripple-size: $checkbox-size * 3 !default;
-$checkbox-ripple-margin: calc(-1 * (#{$checkbox-size} + 2 * #{$checkbox-border-width})) !default;
-$checkbox-ripple-opacity: .3 !default;

package/modules/@progress/kendo-theme-default/scss/chip/_index.scss

@@ -1,11 +0,0 @@
-@import "../core/_index.scss";
-
-
-// Dependencies
-@import "../icons/_index.scss";
-
-
-// Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";