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

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

@@ -1,82 +0,0 @@
-@include exports("colorgradient/theme") {
-
-    // ColorGradient
-    .k-colorgradient {
-        @include fill(
-            $colorgradient-text,
-            $colorgradient-bg,
-            $colorgradient-border
-        );
-    }
-
-    .k-colorgradient:focus,
-    .k-colorgradient.k-state-focus,
-    .k-colorgradient.k-focus {
-        @include fill( $border: $colorgradient-focus-border );
-        @include box-shadow( $colorgradient-focus-shadow );
-    }
-
-    // Canvas
-    .k-colorgradient-canvas .k-hsv-gradient {
-        background: linear-gradient( to bottom, $gradient-transparent-to-black ), linear-gradient( to right, $gradient-white-to-transparent );
-    }
-
-    // DragHandle
-    .k-colorgradient .k-draghandle {
-        @include fill(
-            $colorgradient-draghandle-text,
-            $colorgradient-draghandle-bg,
-            $colorgradient-draghandle-border
-        );
-        @include box-shadow( $colorgradient-draghandle-shadow );
-
-        &:focus,
-        &.k-state-focus,
-        &.k-focus {
-            @include fill( $bg: transparent, $border: $white );
-            @include box-shadow( $colorgradient-draghandle-focus-shadow );
-        }
-
-        &:active,
-        &:hover,
-        &.k-state-hover,
-        &.k-hover {
-            @include fill( $bg: transparent, $border: $white );
-            @include box-shadow( $colorgradient-draghandle-hover-shadow );
-        }
-    }
-
-    // Slider
-    .k-colorgradient-slider.k-hue-slider {
-        &.k-slider-horizontal .k-slider-track {
-            background: linear-gradient( to right, $gradient-rainbow );
-        }
-
-        &.k-slider-vertical .k-slider-track {
-            background: linear-gradient( to top, $gradient-rainbow );
-        }
-    }
-
-    .k-colorgradient-slider.k-alpha-slider .k-slider-track::before {
-        background: url(map-get($data-uris, "alpha-slider-bgr.png")) center repeat;
-    }
-
-    // Inputs
-    .k-colorgradient-input-label {
-        @include fill( $color: $colorgradient-input-label-text );
-    }
-
-}
-
-@include exports("colorgradient/theme/rtl") {
-    .k-rtl,
-    [dir="rtl"] {
-        .k-colorgradient {
-
-            .k-hue-slider.k-slider-horizontal .k-slider-track {
-                background: linear-gradient( to left, $gradient-rainbow );
-            }
-
-        }
-    }
-}

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

@@ -1,51 +0,0 @@
-// ColorGradient
-$colorgradient-spacer: map-get( $spacing, 3 ) !default;
-
-$colorgradient-width: 272px !default;
-$colorgradient-border-width: 1px !default;
-$colorgradient-border-radius: $border-radius !default;
-$colorgradient-padding-y: $colorgradient-spacer !default;
-$colorgradient-padding-x: $colorgradient-padding-y !default;
-$colorgradient-gap: $colorgradient-spacer !default;
-$colorgradient-font-family: $font-family !default;
-$colorgradient-font-size: $font-size !default;
-$colorgradient-line-height: $line-height !default;
-$colorgradient-bg: $component-bg !default;
-$colorgradient-text: $component-text !default;
-$colorgradient-border: $component-border !default;
-
-$colorgradient-focus-border: null !default;
-$colorgradient-focus-shadow: 1px 1px 7px 1px rgba(0, 0, 0, .3) !default;
-
-$colorgradient-canvas-border-radius: $border-radius !default;
-$colorgradient-canvas-gap: $colorgradient-spacer !default;
-$colorgradient-canvas-rectangle-height: 180px !default;
-
-$colorgradient-slider-track-size: 10px !default;
-$colorgradient-slider-border-radius: 10px !default;
-$colorgradient-slider-draghandle-border-width: 3px !default;
-
-$colorgradient-slider-vertical-size: 180px !default;
-$colorgradient-slider-horizontal-size: 100% !default;
-
-$colorgradient-draghandle-width: 14px !default;
-$colorgradient-draghandle-height: 14px !default;
-$colorgradient-draghandle-border-width: 1px !default;
-$colorgradient-draghandle-border-radius: 50% !default;
-$colorgradient-draghandle-bg: transparent !default;
-$colorgradient-draghandle-text: null !default;
-$colorgradient-draghandle-border: rgba( $white, .8) !default;
-$colorgradient-draghandle-shadow: 0 1px 4px rgba(0, 0, 0, .5) !default;
-$colorgradient-draghandle-focus-shadow: 0 1px 4px black !default;
-$colorgradient-draghandle-hover-shadow: $colorgradient-draghandle-focus-shadow !default;
-
-$colorgradient-canvas-draghandle-margin-y: -( $colorgradient-draghandle-height / 2 ) !default;
-$colorgradient-canvas-draghandle-margin-x: -( $colorgradient-draghandle-width / 2 ) !default;
-
-$colorgradient-input-width: 46px !default;
-$colorgradient-input-gap: ( $colorgradient-spacer / 1.5 ) !default;
-$colorgradient-input-label-gap: ( $colorgradient-spacer / 3 ) !default;
-$colorgradient-input-label-text: $disabled-text !default;
-
-$colorgradient-contrast-ratio-font-weight: $font-weight-bold !default;
-$colorgradient-contrast-spacer: ( $colorgradient-spacer / 1.5 ) !default;

package/modules/@progress/kendo-theme-default/scss/colorgradient/images/alpha-slider-bgr.scss

@@ -1,3 +0,0 @@
-@include exports("alpha-slider-bgr.png") {
-    @include register-data-uri("alpha-slider-bgr.png", "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBxYyxDQAwDMJIL+YT+DjtzFRliUfLcklqBCRT4eCTxbD6kdL2/LgYXqpvCbs3kBv/AAAAAElFTkSuQmCC");
-}

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

@@ -1,12 +0,0 @@
-@import "../core/_index.scss";
-
-
-// Dependencies
-@import "../common/_index.scss";
-@import "../utils/_flex.scss";
-
-
-// Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";

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

@@ -1,50 +0,0 @@
-@include exports("colorpalette/layout") {
-
-    // ColorPalette
-    .k-colorpalette {
-        border-width: 0;
-        box-sizing: border-box;
-        outline: 0;
-        font-size: $colorpalette-font-size;
-        font-family: $colorpalette-font-family;
-        line-height: $colorpalette-line-height;
-        display: inline-flex;
-        position: relative;
-        -webkit-touch-callout: none;
-        -webkit-tap-highlight-color: $rgba-transparent;
-    }
-
-    // Table
-    .k-colorpalette-table {
-        width: 100%;
-        height: 100%;
-        border-collapse: collapse;
-        position: relative;
-    }
-
-    // Tile
-    .k-colorpalette-tile {
-        width: $colorpalette-tile-width;
-        height: $colorpalette-tile-height;
-        box-sizing: border-box;
-        overflow: hidden;
-        cursor: pointer;
-        -ms-high-contrast-adjust: none;
-
-        &:hover,
-        &.k-state-hover,
-        &.k-hover {
-            position: relative;
-            z-index: 101;
-        }
-
-        &:focus,
-        &.k-state-focus,
-        &.k-state-selected,
-        &.k-state-selected:hover {
-            position: relative;
-            z-index: 100;
-        }
-    }
-
-}

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

@@ -1,25 +0,0 @@
-@include exports("colorpalette/theme") {
-
-    // Tile
-    .k-colorpalette-tile {
-
-        &:focus,
-        &.k-state-focus,
-        &.k-focus {
-            @include box-shadow( $colorpalette-tile-focus-shadow );
-        }
-
-        &:hover,
-        &.k-state-hover,
-        &.k-hover {
-            @include box-shadow( $colorpalette-tile-hover-shadow );
-        }
-
-        &.k-state-selected,
-        &.k-state-selected:hover {
-            @include box-shadow( $colorpalette-tile-selected-shadow );
-        }
-
-    }
-
-}

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

@@ -1,10 +0,0 @@
-// Colorpalette
-$colorpalette-font-family: $font-family !default;
-$colorpalette-font-size: $font-size !default;
-$colorpalette-line-height: 0 !default;
-
-$colorpalette-tile-width: map-get( $spacing, 6 ) !default;
-$colorpalette-tile-height: $colorpalette-tile-width !default;
-$colorpalette-tile-focus-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .5 ) !default;
-$colorpalette-tile-hover-shadow: 0 0 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, .8 ) !default;
-$colorpalette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inset 0 0 0 1px rgba( white, 1 ) !default;

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

@@ -1,17 +0,0 @@
-@import "../core/_index.scss";
-
-
-// Dependencies
-@import "../common/_index.scss";
-@import "../utils/_flex.scss";
-@import "../button/_index.scss";
-@import "../colorpalette/_index.scss";
-@import "../colorgradient/_index.scss";
-@import "../popup/_index.scss";
-@import "../icons/_index.scss";
-
-
-// Component
-@import "_variables.scss";
-@import "_layout.scss";
-@import "_theme.scss";

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

@@ -1,136 +0,0 @@
-@include exports("colorpicker/layout") {
-
-    .k-colorpicker {
-        width: auto;
-        border-width: 0;
-        box-sizing: border-box;
-        outline: 0;
-        font-family: $colorpicker-font-family;
-        font-size: $colorpicker-font-size;
-        line-height: $colorpicker-line-height;
-        background: none;
-        text-align: left;
-        display: inline-flex;
-        vertical-align: middle;
-        position: relative;
-        overflow: visible;
-        -webkit-touch-callout: none;
-        -webkit-tap-highlight-color: $rgba-transparent;
-
-        .k-selected-color {
-            padding: $button-padding-y;
-            width: $button-inner-calc-size;
-            height: $button-inner-calc-size;
-            border-width: 0;
-            border-style: solid;
-            border-color: inherit;
-            box-sizing: border-box;
-            line-height: 0;
-            position: relative;
-            overflow: hidden;
-
-            .k-i-line {
-                border-top: 1px solid $error;
-                width: 200%;
-                height: 200%;
-                position: absolute;
-                top: 50%;
-                left: 50%;
-                transform: translate(-33%, -33%) rotateZ(45deg);
-                transform-origin: 0 0;
-            }
-            .k-i-line::before {
-                display: none;
-            }
-        }
-
-        .k-tool-icon {
-            padding: $button-padding-y;
-            width: $button-inner-calc-size;
-            height: $button-inner-calc-size;
-            border-width: 0;
-            border-style: solid;
-            border-color: inherit;
-            box-sizing: border-box;
-            font-size: inherit;
-            text-align: center;
-            flex-direction: column;
-            cursor: pointer;
-
-            &::before {
-                font-size: $icon-size;
-                line-height: 1;
-            }
-
-            .k-selected-color {
-                margin: 1px 0 0;
-                padding: 0;
-                width: 14px;
-                height: 3px;
-                border-width: 0;
-                line-height: 0;
-                display: inline-block;
-            }
-        }
-
-        .k-picker-wrap {
-            @include border-radius( $input-border-radius );
-            padding: 0;
-            width: 100%;
-            border-width: 1px;
-            border-style: solid;
-            box-sizing: border-box;
-            position: relative;
-            display: flex;
-            flex-direction: row;
-            transition: all .1s ease; // sass-lint:disable-block no-transition-all
-            overflow: hidden;
-            cursor: default;
-            outline: 0;
-        }
-
-
-        // Input
-        .k-input {}
-
-
-        // Select
-        .k-select {
-            @include border-right-radius-only( $input-border-radius );
-            padding: $picker-select-padding-y $picker-select-padding-x;
-            width: if( $use-picker-select-width, $button-inner-calc-size, null );
-            border-width: 0 0 0 $colorpicker-select-border-width;
-            border-style: solid;
-            border-color: inherit;
-            box-sizing: border-box;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            flex: 0 0 auto;
-            text-align: center;
-            cursor: pointer;
-
-            .k-icon {}
-        }
-
-        .k-rtl &,
-        &[dir="rtl"] {
-            .k-picker-wrap {
-                .k-select {
-                    @include border-left-radius-only( $input-border-radius );
-                    border-width: 0 $colorpicker-select-border-width 0 0;
-                }
-            }
-        }
-
-    }
-
-    .k-colorpicker-popup .k-coloreditor {
-        border-color: transparent;
-    }
-
-    .k-colorpicker-popup {
-        padding: 0;
-    }
-
-}

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

@@ -1,68 +0,0 @@
-@include exports( "colorpicker/theme" ) {
-
-    .k-colorpicker {
-
-        // Normal state
-        .k-picker-wrap {
-            @include fill(
-                $colorpicker-text,
-                $colorpicker-bg,
-                $colorpicker-border,
-                $colorpicker-gradient
-            );
-
-            // Invalid state
-            &.k-invalid,
-            &.k-invalid:hover,
-            &.k-state-invalid {
-                border-color: $invalid-border;
-
-                &:focus,
-                &.k-state-focused {
-                    @include box-shadow($invalid-shadow);
-                }
-            }
-        }
-
-        // Hover state
-        > :hover,
-        > .k-state-hover {
-            @include fill(
-                $colorpicker-hovered-text,
-                $colorpicker-hovered-bg,
-                $colorpicker-hovered-border,
-                $colorpicker-hovered-gradient
-            );
-        }
-
-        &.k-state-active {}
-
-        // Focus state
-        .k-state-focused,
-        .k-state-focus,
-        .k-focus {
-            @include fill(
-                $colorpicker-focused-text,
-                $colorpicker-focused-bg,
-                $colorpicker-focused-border,
-                $colorpicker-focused-gradient
-            );
-            @include box-shadow($colorpicker-focused-shadow);
-        }
-
-        // Invalid state
-        &.k-state-invalid,
-        &.ng-invalid.ng-touched,
-        &.ng-invalid.ng-dirty {
-            .k-picker-wrap {
-                border-color: $invalid-border;
-
-                &.k-state-focused {
-                    @include box-shadow($invalid-shadow);
-                }
-            }
-        }
-
-    }
-
-}

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

@@ -1,22 +0,0 @@
-// Colorpicker
-$colorpicker-font-family: $font-family !default;
-$colorpicker-font-size: $font-size !default;
-$colorpicker-line-height: $line-height !default;
-
-$colorpicker-select-border-width: 1px !default;
-
-$colorpicker-bg: $button-bg !default;
-$colorpicker-text: $button-text !default;
-$colorpicker-border: $button-border !default;
-$colorpicker-gradient: $button-gradient !default;
-
-$colorpicker-hovered-bg: $button-hovered-bg !default;
-$colorpicker-hovered-text: $button-hovered-text !default;
-$colorpicker-hovered-border: $button-hovered-border !default;
-$colorpicker-hovered-gradient: $button-hovered-gradient !default;
-
-$colorpicker-focused-bg: null !default;
-$colorpicker-focused-text: null !default;
-$colorpicker-focused-border: null !default;
-$colorpicker-focused-gradient: null !default;
-$colorpicker-focused-shadow: $button-focused-shadow !default;

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

@@ -1,65 +0,0 @@
-@include exports("combobox/layout") {
-
-    .k-combobox {
-        width: $input-default-width;
-        border-width: 0;
-        box-sizing: border-box;
-        outline: 0;
-        background: none;
-        font-family: $input-font-family;
-        font-size: $input-font-size;
-        line-height: $input-line-height;
-        text-align: left;
-        white-space: nowrap;
-        display: inline-flex;
-        vertical-align: middle;
-        position: relative;
-        -webkit-touch-callout: none;
-        -webkit-tap-highlight-color: $rgba-transparent;
-
-        .k-dropdown-wrap {
-            @include border-radius( $input-border-radius );
-            padding: 0;
-            width: 100%;
-            border-width: 1px;
-            border-style: solid;
-            box-sizing: border-box;
-            position: relative;
-            display: flex;
-            flex-flow: row nowrap;
-            transition: all .1s ease; // sass-lint:disable-line no-transition-all
-            outline: 0;
-            cursor: initial;
-        }
-
-
-        // Input
-        .k-input {}
-
-        // Select
-        .k-select {
-            @include border-right-radius-only( $input-border-radius );
-            padding: $combobox-select-padding-y $combobox-select-padding-x;
-            width: if( $use-picker-select-width, $combobox-select-width, null );
-            border-width: 0 0 0 $combobox-select-border-width;
-            box-sizing: border-box;
-            border-style: solid;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            flex: 0 0 auto;
-            text-align: center;
-            cursor: pointer;
-        }
-
-        &[dir="rtl"],
-        .k-rtl & {
-            text-align: right;
-
-            .k-select {
-                @include border-left-radius-only( $input-border-radius );
-                border-width: 0 $combobox-select-border-width 0 0;
-            }
-        }
-    }
-}

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

@@ -1,127 +0,0 @@
-@include exports("combobox/theme") {
-
-    .k-combobox {
-
-        // Normal state
-        .k-dropdown-wrap {
-            @include fill(
-                $combobox-text,
-                $combobox-bg,
-                $combobox-border
-            );
-
-            // Invalid state
-            &.k-invalid,
-            &.k-invalid:hover,
-            &.k-state-invalid {
-                border-color: $invalid-border;
-
-                &:focus,
-                &.k-state-focused {
-                    @include box-shadow($invalid-shadow);
-                }
-            }
-        }
-
-        .k-select {
-            @include fill(
-                $combobox-select-text,
-                $combobox-select-bg,
-                $combobox-select-border,
-                $combobox-select-gradient
-            );
-        }
-
-        // Hover state
-        > :hover,
-        .k-state-hover {
-            @include fill(
-                $combobox-hovered-text,
-                $combobox-hovered-bg,
-                $combobox-hovered-border
-            );
-
-            .k-select {
-                @include fill(
-                    $combobox-select-hovered-text,
-                    $combobox-select-hovered-bg,
-                    $combobox-select-hovered-border,
-                    $combobox-select-hovered-gradient
-                );
-            }
-        }
-
-        // Focus state
-        > .k-state-focused {
-            @include fill(
-                $combobox-focused-text,
-                $combobox-focused-bg,
-                $combobox-focused-border
-            );
-            @include box-shadow($combobox-focused-shadow);
-        }
-
-        // Active state
-        .k-state-active {
-            .k-select {
-                @include fill(
-                    $combobox-select-pressed-text,
-                    $combobox-select-pressed-bg,
-                    $combobox-select-pressed-border,
-                    $combobox-select-pressed-gradient
-                );
-            }
-        }
-
-        // Invalid
-        &.k-state-invalid,
-        &.ng-invalid.ng-touched,
-        &.ng-invalid.ng-dirty {
-            .k-dropdown-wrap {
-                border-color: $invalid-border;
-
-                &:focus,
-                &.k-state-focused {
-                    @include box-shadow($invalid-shadow);
-                }
-            }
-        }
-    }
-
-    // Universal rendering
-    .k-combobox {
-        &.k-state-hover {
-            .k-dropdown-wrap {
-                @include fill(
-                    $combobox-hovered-text,
-                    $combobox-hovered-bg,
-                    $combobox-hovered-border
-                );
-            }
-        }
-
-        &.k-state-focus {
-            .k-dropdown-wrap {
-                @include fill(
-                    $combobox-focused-text,
-                    $combobox-focused-bg,
-                    $combobox-focused-border
-                );
-                @include box-shadow($combobox-focused-shadow);
-            }
-        }
-
-        &.k-invalid {
-            .k-dropdown-wrap {
-                border-color: $invalid-border;
-            }
-        }
-
-        &.k-invalid.k-state-focus {
-            .k-dropdown-wrap {
-                @include box-shadow($invalid-shadow);
-            }
-        }
-    }
-
-}