@progress/kendo-theme-material 5.0.0-alpha.1 → 5.0.0-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/all.scss CHANGED
@@ -7882,6 +7882,7 @@ $chip-error-focus-shadow: null !default;
7882
7882
  font-size: $chip-selected-icon-font-size;
7883
7883
  }
7884
7884
 
7885
+ .k-chip.k-state-selected .k-selected-icon-wrapper,
7885
7886
  .k-chip.k-selected .k-selected-icon-wrapper {
7886
7887
  width: $chip-selected-icon-size;
7887
7888
  visibility: visible;
@@ -7901,6 +7902,7 @@ $chip-error-focus-shadow: null !default;
7901
7902
  transition: width .2s, opacity .2s;
7902
7903
  }
7903
7904
 
7905
+ &.k-state-selected .k-selected-icon-wrapper,
7904
7906
  &.k-selected .k-selected-icon-wrapper {
7905
7907
  opacity: 1;
7906
7908
  }
@@ -8024,6 +8026,7 @@ $chip-error-focus-shadow: null !default;
8024
8026
  // #region @import "~@progress/kendo-theme-default/scss/chip/_theme.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/chip/_theme.scss
8025
8027
  @include exports("chip/theme") {
8026
8028
 
8029
+ .k-selection-multiple .k-chip-has-icon.k-state-selected .k-selected-icon-wrapper,
8027
8030
  .k-selection-multiple .k-chip-has-icon.k-selected .k-selected-icon-wrapper {
8028
8031
  @include fill(
8029
8032
  $color: $chip-multiple-selected-icon-text,
@@ -11380,11 +11383,6 @@ $window-sizes: (
11380
11383
 
11381
11384
 
11382
11385
  .k-multiselect,
11383
- .k-dateinput,
11384
- .k-datepicker,
11385
- .k-datetimepicker,
11386
- .k-daterangepicker-wrap,
11387
- .k-timepicker,
11388
11386
  .k-floating-label-container {
11389
11387
  display: inline-flex;
11390
11388
  width: 100%;
@@ -18209,6 +18207,275 @@ $combobox-select-pressed-gradient: null !default;
18209
18207
 
18210
18208
  // #endregion
18211
18209
 
18210
+ // #endregion
18211
+ // #region @import "dateinput/_index.scss"; -> packages/material/scss/dateinput/_index.scss
18212
+ // #region @import "../core/_index.scss"; -> packages/material/scss/core/_index.scss
18213
+ // File already imported_once. Skipping output.
18214
+ // #endregion
18215
+
18216
+
18217
+ // Dependencies
18218
+ // #region @import "../common/_index.scss"; -> packages/material/scss/common/_index.scss
18219
+ // File already imported_once. Skipping output.
18220
+ // #endregion
18221
+ // #region @import "../input/_index.scss"; -> packages/material/scss/input/_index.scss
18222
+ // File already imported_once. Skipping output.
18223
+ // #endregion
18224
+ // #region @import "../floating-label/_index.scss"; -> packages/material/scss/floating-label/_index.scss
18225
+ // File already imported_once. Skipping output.
18226
+ // #endregion
18227
+ // #region @import "../popup/_index.scss"; -> packages/material/scss/popup/_index.scss
18228
+ // File already imported_once. Skipping output.
18229
+ // #endregion
18230
+ // #region @import "../icons/_index.scss"; -> packages/material/scss/icons/_index.scss
18231
+ // File already imported_once. Skipping output.
18232
+ // #endregion
18233
+
18234
+
18235
+ // Component
18236
+ // #region @import "_variables.scss"; -> packages/material/scss/dateinput/_variables.scss
18237
+ // Dateinput
18238
+
18239
+ // #endregion
18240
+ // #region @import "_layout.scss"; -> packages/material/scss/dateinput/_layout.scss
18241
+ // #region @import "~@progress/kendo-theme-default/scss/dateinput/_layout.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/dateinput/_layout.scss
18242
+ @include exports("dateinput/layout") {
18243
+
18244
+ // Date input
18245
+ .k-dateinput {}
18246
+
18247
+ }
18248
+
18249
+ // #endregion
18250
+
18251
+ // #endregion
18252
+ // #region @import "_theme.scss"; -> packages/material/scss/dateinput/_theme.scss
18253
+ // #region @import "~@progress/kendo-theme-default/scss/dateinput/_theme.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/dateinput/_theme.scss
18254
+ @include exports("dateinput/theme") {
18255
+
18256
+ // Date input
18257
+ .k-dateinput {}
18258
+
18259
+ }
18260
+
18261
+ // #endregion
18262
+
18263
+ // #endregion
18264
+
18265
+ // #endregion
18266
+ // #region @import "datepicker/_index.scss"; -> packages/material/scss/datepicker/_index.scss
18267
+ // #region @import "../core/_index.scss"; -> packages/material/scss/core/_index.scss
18268
+ // File already imported_once. Skipping output.
18269
+ // #endregion
18270
+
18271
+
18272
+ // Dependencies
18273
+ // #region @import "../common/_index.scss"; -> packages/material/scss/common/_index.scss
18274
+ // File already imported_once. Skipping output.
18275
+ // #endregion
18276
+ // #region @import "../input/_index.scss"; -> packages/material/scss/input/_index.scss
18277
+ // File already imported_once. Skipping output.
18278
+ // #endregion
18279
+ // #region @import "../floating-label/_index.scss"; -> packages/material/scss/floating-label/_index.scss
18280
+ // File already imported_once. Skipping output.
18281
+ // #endregion
18282
+ // #region @import "../popup/_index.scss"; -> packages/material/scss/popup/_index.scss
18283
+ // File already imported_once. Skipping output.
18284
+ // #endregion
18285
+ // #region @import "../icons/_index.scss"; -> packages/material/scss/icons/_index.scss
18286
+ // File already imported_once. Skipping output.
18287
+ // #endregion
18288
+
18289
+
18290
+ // Component
18291
+ // #region @import "_variables.scss"; -> packages/material/scss/datepicker/_variables.scss
18292
+ // Datepicker
18293
+
18294
+ // #endregion
18295
+ // #region @import "_layout.scss"; -> packages/material/scss/datepicker/_layout.scss
18296
+ // #region @import "~@progress/kendo-theme-default/scss/datepicker/_layout.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/datepicker/_layout.scss
18297
+ @include exports("datepicker/layout") {
18298
+
18299
+ // Date picker
18300
+ .k-datepicker {}
18301
+
18302
+ }
18303
+
18304
+ // #endregion
18305
+
18306
+ // #endregion
18307
+ // #region @import "_theme.scss"; -> packages/material/scss/datepicker/_theme.scss
18308
+ // #region @import "~@progress/kendo-theme-default/scss/datepicker/_theme.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/datepicker/_theme.scss
18309
+ @include exports("datepicker/theme") {
18310
+
18311
+ // Date picker
18312
+ .k-datepicker {}
18313
+
18314
+ }
18315
+
18316
+ // #endregion
18317
+
18318
+ // #endregion
18319
+
18320
+ // #endregion
18321
+ // #region @import "timepicker/_index.scss"; -> packages/material/scss/timepicker/_index.scss
18322
+ // #region @import "../core/_index.scss"; -> packages/material/scss/core/_index.scss
18323
+ // File already imported_once. Skipping output.
18324
+ // #endregion
18325
+
18326
+
18327
+ // Dependencies
18328
+ // #region @import "../common/_index.scss"; -> packages/material/scss/common/_index.scss
18329
+ // File already imported_once. Skipping output.
18330
+ // #endregion
18331
+ // #region @import "../input/_index.scss"; -> packages/material/scss/input/_index.scss
18332
+ // File already imported_once. Skipping output.
18333
+ // #endregion
18334
+ // #region @import "../floating-label/_index.scss"; -> packages/material/scss/floating-label/_index.scss
18335
+ // File already imported_once. Skipping output.
18336
+ // #endregion
18337
+ // #region @import "../popup/_index.scss"; -> packages/material/scss/popup/_index.scss
18338
+ // File already imported_once. Skipping output.
18339
+ // #endregion
18340
+ // #region @import "../icons/_index.scss"; -> packages/material/scss/icons/_index.scss
18341
+ // File already imported_once. Skipping output.
18342
+ // #endregion
18343
+
18344
+
18345
+ // Component
18346
+ // #region @import "_variables.scss"; -> packages/material/scss/timepicker/_variables.scss
18347
+ // Timepicker
18348
+
18349
+ // #endregion
18350
+ // #region @import "_layout.scss"; -> packages/material/scss/timepicker/_layout.scss
18351
+ // #region @import "~@progress/kendo-theme-default/scss/timepicker/_layout.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/timepicker/_layout.scss
18352
+ @include exports("timepicker/layout") {
18353
+
18354
+ // Time picker
18355
+ .k-timepicker {}
18356
+
18357
+ }
18358
+
18359
+ // #endregion
18360
+
18361
+ // #endregion
18362
+ // #region @import "_theme.scss"; -> packages/material/scss/timepicker/_theme.scss
18363
+ // #region @import "~@progress/kendo-theme-default/scss/timepicker/_theme.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/timepicker/_theme.scss
18364
+ @include exports("timepicker/theme") {
18365
+
18366
+ // Time picker
18367
+ .k-timepicker {}
18368
+
18369
+ }
18370
+
18371
+ // #endregion
18372
+
18373
+ // #endregion
18374
+
18375
+ // #endregion
18376
+ // #region @import "datetimepicker/_index.scss"; -> packages/material/scss/datetimepicker/_index.scss
18377
+ // #region @import "../core/_index.scss"; -> packages/material/scss/core/_index.scss
18378
+ // File already imported_once. Skipping output.
18379
+ // #endregion
18380
+
18381
+
18382
+ // Dependencies
18383
+ // #region @import "../common/_index.scss"; -> packages/material/scss/common/_index.scss
18384
+ // File already imported_once. Skipping output.
18385
+ // #endregion
18386
+ // #region @import "../input/_index.scss"; -> packages/material/scss/input/_index.scss
18387
+ // File already imported_once. Skipping output.
18388
+ // #endregion
18389
+ // #region @import "../floating-label/_index.scss"; -> packages/material/scss/floating-label/_index.scss
18390
+ // File already imported_once. Skipping output.
18391
+ // #endregion
18392
+ // #region @import "../popup/_index.scss"; -> packages/material/scss/popup/_index.scss
18393
+ // File already imported_once. Skipping output.
18394
+ // #endregion
18395
+ // #region @import "../icons/_index.scss"; -> packages/material/scss/icons/_index.scss
18396
+ // File already imported_once. Skipping output.
18397
+ // #endregion
18398
+
18399
+
18400
+ // Component
18401
+ // #region @import "_variables.scss"; -> packages/material/scss/datetimepicker/_variables.scss
18402
+ // Datetimepicker
18403
+
18404
+ // #endregion
18405
+ // #region @import "_layout.scss"; -> packages/material/scss/datetimepicker/_layout.scss
18406
+ // #region @import "~@progress/kendo-theme-default/scss/datetimepicker/_layout.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/datetimepicker/_layout.scss
18407
+ @include exports("datetimepicker/layout") {
18408
+
18409
+ // Date time picker
18410
+ .k-datetimepicker {}
18411
+
18412
+ }
18413
+
18414
+ // #endregion
18415
+
18416
+ // #endregion
18417
+ // #region @import "_theme.scss"; -> packages/material/scss/datetimepicker/_theme.scss
18418
+ // #region @import "~@progress/kendo-theme-default/scss/datetimepicker/_theme.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/datetimepicker/_theme.scss
18419
+ @include exports("datetimepicker/theme") {
18420
+
18421
+ // Date time picker
18422
+ .k-datetimepicker {}
18423
+
18424
+ }
18425
+
18426
+ // #endregion
18427
+
18428
+ // #endregion
18429
+
18430
+ // #endregion
18431
+ // #region @import "daterangepicker/_index.scss"; -> packages/material/scss/daterangepicker/_index.scss
18432
+ // #region @import "../core/_index.scss"; -> packages/material/scss/core/_index.scss
18433
+ // File already imported_once. Skipping output.
18434
+ // #endregion
18435
+
18436
+
18437
+ // Dependencies
18438
+ // #region @import "../common/_index.scss"; -> packages/material/scss/common/_index.scss
18439
+ // File already imported_once. Skipping output.
18440
+ // #endregion
18441
+ // #region @import "../input/_index.scss"; -> packages/material/scss/input/_index.scss
18442
+ // File already imported_once. Skipping output.
18443
+ // #endregion
18444
+ // #region @import "../floating-label/_index.scss"; -> packages/material/scss/floating-label/_index.scss
18445
+ // File already imported_once. Skipping output.
18446
+ // #endregion
18447
+ // #region @import "../popup/_index.scss"; -> packages/material/scss/popup/_index.scss
18448
+ // File already imported_once. Skipping output.
18449
+ // #endregion
18450
+ // #region @import "../icons/_index.scss"; -> packages/material/scss/icons/_index.scss
18451
+ // File already imported_once. Skipping output.
18452
+ // #endregion
18453
+
18454
+
18455
+ // Component
18456
+ // #region @import "_variables.scss"; -> packages/material/scss/daterangepicker/_variables.scss
18457
+ // Daterangepicker
18458
+
18459
+ // #endregion
18460
+ // #region @import "_layout.scss"; -> packages/material/scss/daterangepicker/_layout.scss
18461
+ // #region @import "~@progress/kendo-theme-default/scss/daterangepicker/_layout.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/daterangepicker/_layout.scss
18462
+ @include exports("daterangepicker/layout") {
18463
+
18464
+ }
18465
+
18466
+ // #endregion
18467
+
18468
+ // #endregion
18469
+ // #region @import "_theme.scss"; -> packages/material/scss/daterangepicker/_theme.scss
18470
+ // #region @import "~@progress/kendo-theme-default/scss/daterangepicker/_theme.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/daterangepicker/_theme.scss
18471
+ @include exports("daterangepicker/theme") {
18472
+
18473
+ }
18474
+
18475
+ // #endregion
18476
+
18477
+ // #endregion
18478
+
18212
18479
  // #endregion
18213
18480
  // #region @import "datetime/_index.scss"; -> packages/material/scss/datetime/_index.scss
18214
18481
  // #region @import "../core/_index.scss"; -> packages/material/scss/core/_index.scss
@@ -18797,18 +19064,6 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
18797
19064
 
18798
19065
 
18799
19066
 
18800
-
18801
- @include exports("daterangepicker/layout") {
18802
-
18803
- // jQuery DateRangePicker
18804
- .k-widget.k-daterangepicker {
18805
- border: 0;
18806
- }
18807
-
18808
- }
18809
-
18810
-
18811
-
18812
19067
  @include exports("calendar/layout/rtl") {
18813
19068
 
18814
19069
  .k-rtl .k-calendar,
@@ -19128,23 +19383,6 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19128
19383
 
19129
19384
  }
19130
19385
 
19131
-
19132
-
19133
-
19134
- @include exports( "daterangepicker/theme" ) {
19135
-
19136
- // jQuery DateRangePicker
19137
- .k-daterangepicker {
19138
- // Invalid
19139
- &.k-state-invalid {
19140
- .k-dateinput-wrap {
19141
- border-color: $invalid-border;
19142
- }
19143
- }
19144
- }
19145
-
19146
- }
19147
-
19148
19386
  // #endregion
19149
19387
 
19150
19388
  @include exports("calendar/theme/material") {
@@ -19194,301 +19432,49 @@ $time-header-padding: null !default;
19194
19432
  $timepicker-header-height: 2em !default;
19195
19433
 
19196
19434
  $time-list-padding: $padding-y * 5 !default;
19197
- $time-list-focus-size: 2px !default;
19198
- $time-list-width: 4em !default;
19199
- $time-list-height: 200px !default;
19200
-
19201
- $time-list-item-padding-x: $padding-x !default;
19202
- $time-list-item-padding-y: $padding-y !default;
19203
-
19204
- $dateinput-text: $component-text !default;
19205
-
19206
- $datetime-width: calc( #{$calendar-cell-size * 8} + #{$infinite-calendar-view-padding-x * 2}) !default;
19207
-
19208
- $datetime-bg: $kendo-input-bg !default;
19209
- $datetime-text: $kendo-input-text !default;
19210
- $datetime-border: $kendo-input-border !default;
19211
-
19212
- $datetime-hovered-bg: $kendo-input-hover-bg !default;
19213
- $datetime-hovered-text: $kendo-input-hover-text !default;
19214
- $datetime-hovered-border: $kendo-input-hover-border !default;
19215
-
19216
- $datetime-focused-bg: $kendo-input-focus-bg !default;
19217
- $datetime-focused-text: $kendo-input-focus-text !default;
19218
- $datetime-focused-border: $kendo-input-focus-border !default;
19219
- $datetime-focused-shadow: $kendo-input-focus-shadow !default;
19220
-
19221
- $datetime-select-bg: null !default;
19222
- $datetime-select-text: $subtle-text !default;
19223
- $datetime-select-border: null !default;
19224
- $datetime-select-gradient: null !default;
19225
-
19226
- $datetime-select-hovered-bg: null !default;
19227
- $datetime-select-hovered-text: $kendo-input-text !default;
19228
- $datetime-select-hovered-border: null !default;
19229
- $datetime-select-hovered-gradient: null !default;
19230
-
19231
- $datetime-select-pressed-bg: null !default;
19232
- $datetime-select-pressed-text: $primary !default;
19233
- $datetime-select-pressed-border: null !default;
19234
- $datetime-select-pressed-gradient: null !default;
19235
-
19236
- // #endregion
19237
- // #region @import "_layout.scss"; -> packages/material/scss/datetime/_layout.scss
19238
- // #region @import "~@progress/kendo-theme-default/scss/datetime/_layout.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/datetime/_layout.scss
19239
- @include exports("datetime/layout") {
19240
-
19241
- // Dateinput
19242
- .k-dateinput {
19243
- border-width: 0;
19244
- box-sizing: border-box;
19245
- outline: 0;
19246
- background: none;
19247
- font-family: $kendo-input-font-family;
19248
- font-size: $kendo-input-font-size;
19249
- line-height: $kendo-input-line-height;
19250
- text-align: left;
19251
- white-space: nowrap;
19252
- display: inline-flex;
19253
- vertical-align: middle;
19254
- position: relative;
19255
- -webkit-touch-callout: none;
19256
- -webkit-tap-highlight-color: $rgba-transparent;
19257
-
19258
- .k-dateinput-wrap {
19259
- @include border-radius( $kendo-input-border-radius );
19260
- padding: 0;
19261
- width: 100%;
19262
- border-width: 1px;
19263
- border-style: solid;
19264
- box-sizing: border-box;
19265
- position: relative;
19266
- transition: all .1s ease; // sass-lint:disable-line no-transition-all
19267
- cursor: default;
19268
- outline: 0;
19269
- display: flex;
19270
- flex-flow: row nowrap;
19271
- }
19272
-
19273
-
19274
- // Input
19275
- .k-input {}
19276
-
19277
-
19278
- // Select
19279
- .k-select {
19280
- @include border-right-radius-only( $kendo-input-border-radius );
19281
- padding: 0;
19282
- width: $kendo-input-spinner-width;
19283
- border-width: 0 0 0 $picker-select-border-width;
19284
- border-style: solid;
19285
- box-sizing: border-box;
19286
- outline: 0;
19287
- display: flex;
19288
- flex-direction: column;
19289
- align-items: stretch;
19290
- justify-content: center;
19291
- flex: 0 0 auto;
19292
- text-align: center;
19293
- cursor: pointer;
19294
- }
19295
- .k-link {
19296
- padding: 0 $picker-select-padding-x;
19297
- min-width: $icon-size;
19298
- flex: 1 1 auto;
19299
- display: block;
19300
- overflow: hidden;
19301
- position: relative;
19302
-
19303
- .k-icon {
19304
- position: absolute;
19305
- right: 50%;
19306
- transform: translateX(50%);
19307
- }
19308
- }
19309
-
19310
-
19311
- // RTL
19312
- .k-rtl &,
19313
- &[dir="rtl"] {
19314
- text-align: right;
19315
-
19316
- .k-select {
19317
- @include border-left-radius-only( $kendo-input-border-radius );
19318
- border-width: 0 $picker-select-border-width 0 0;
19319
- }
19320
- }
19321
-
19322
-
19323
- // Nested dateinput
19324
- .k-picker-wrap & {
19325
- margin: 0 !important; // sass-lint:disable-line no-important
19326
- width: 100%;
19327
- flex: 1 1 auto;
19328
-
19329
- .k-dateinput-wrap {
19330
- @include border-left-radius-only( $kendo-input-border-radius );
19331
- border-width: 0;
19332
- box-shadow: none !important; // sass-lint:disable-line no-important
19333
- }
19334
-
19335
- [dir="rtl"] &,
19336
- .k-rtl & {
19337
- .k-dateinput-wrap {
19338
- @include border-right-radius-only( $kendo-input-border-radius );
19339
- }
19340
- }
19341
-
19342
- }
19343
- }
19344
-
19345
-
19346
- // Datepicker / timepicker
19347
- .k-datepicker,
19348
- .k-timepicker {
19349
- border-width: 0;
19350
- box-sizing: border-box;
19351
- outline: 0;
19352
- font-family: $kendo-input-font-family;
19353
- font-size: $kendo-input-font-size;
19354
- line-height: $kendo-input-line-height;
19355
- white-space: nowrap;
19356
- background: none;
19357
- display: inline-flex;
19358
- vertical-align: middle;
19359
- position: relative;
19360
- -webkit-touch-callout: none;
19361
- -webkit-tap-highlight-color: $rgba-transparent;
19362
-
19363
- // Wrapper
19364
- .k-picker-wrap {
19365
- @include border-radius( $kendo-input-border-radius );
19366
- padding: 0;
19367
- width: 100%;
19368
- border-width: $kendo-input-border-width;
19369
- border-style: solid;
19370
- box-sizing: border-box;
19371
- display: flex;
19372
- flex-direction: row;
19373
- position: relative;
19374
- transition: all .1s ease; // sass-lint:disable-block no-transition-all
19375
- cursor: default;
19376
- outline: 0;
19377
- }
19378
-
19379
-
19380
- // Input
19381
- .k-input {}
19382
-
19383
-
19384
- // Select
19385
- .k-select {
19386
- @include border-right-radius-only( $kendo-input-border-radius );
19387
- padding: $picker-select-padding-y $picker-select-padding-x;
19388
- width: if( $use-picker-select-width, $picker-select-calc-size, null );
19389
- border-width: 0 0 0 $picker-select-border-width;
19390
- border-style: solid;
19391
- box-sizing: border-box;
19392
- outline: 0;
19393
- display: flex;
19394
- align-items: center;
19395
- justify-content: center;
19396
- flex: 0 0 auto;
19397
- text-align: center;
19398
- cursor: pointer;
19399
- }
19400
-
19401
-
19402
- // RTL
19403
- .k-rtl &,
19404
- &[dir="rtl"] {
19405
- text-align: right;
19406
-
19407
- .k-select {
19408
- @include border-left-radius-only( $kendo-input-border-radius );
19409
- border-width: 0 $picker-select-border-width 0 0;
19410
- }
19411
- }
19412
- }
19413
-
19414
-
19415
- // Datetimepicker
19416
- .k-datetimepicker {
19417
- border-width: 0;
19418
- box-sizing: border-box;
19419
- outline: 0;
19420
- font-family: $kendo-input-font-family;
19421
- font-size: $kendo-input-font-size;
19422
- line-height: $kendo-input-line-height;
19423
- text-align: left;
19424
- white-space: nowrap;
19425
- background: none;
19426
- display: inline-flex;
19427
- vertical-align: middle;
19428
- position: relative;
19429
- -webkit-touch-callout: none;
19430
- -webkit-tap-highlight-color: $rgba-transparent;
19431
-
19432
- // Wrappers
19433
- .k-picker-wrap {
19434
- @include border-radius( $kendo-input-border-radius );
19435
- padding: 0;
19436
- width: 100%;
19437
- border-width: 1px;
19438
- border-style: solid;
19439
- box-sizing: border-box;
19440
- display: flex;
19441
- flex-direction: row;
19442
- position: relative;
19443
- transition: all .1s ease; // sass-lint:disable-block no-transition-all
19444
- cursor: default;
19445
- outline: 0;
19446
- }
19435
+ $time-list-focus-size: 2px !default;
19436
+ $time-list-width: 4em !default;
19437
+ $time-list-height: 200px !default;
19447
19438
 
19439
+ $time-list-item-padding-x: $padding-x !default;
19440
+ $time-list-item-padding-y: $padding-y !default;
19448
19441
 
19449
- // Input
19450
- .k-input {}
19442
+ $dateinput-text: $component-text !default;
19451
19443
 
19444
+ $datetime-width: calc( #{$calendar-cell-size * 8} + #{$infinite-calendar-view-padding-x * 2}) !default;
19452
19445
 
19453
- // Select
19454
- .k-select {
19455
- @include border-right-radius-only( $kendo-input-border-radius );
19456
- border-width: 0 0 0 $picker-select-border-width;
19457
- border-style: solid;
19458
- box-sizing: border-box;
19459
- outline: 0;
19460
- display: flex;
19461
- align-items: stretch;
19462
- justify-content: center;
19463
- flex: 0 0 auto;
19464
- text-align: center;
19465
- cursor: pointer;
19466
- }
19467
- .k-link {
19468
- padding: $picker-select-padding-y $picker-select-padding-x;
19469
- width: if( $use-picker-select-width, $kendo-button-inner-calc-size, null );
19470
- height: 100%;
19471
- border-width: 0;
19472
- border-style: solid;
19473
- border-color: inherit;
19474
- display: flex;
19475
- align-items: center;
19476
- justify-content: center;
19477
- box-sizing: border-box;
19478
- }
19446
+ $datetime-bg: $kendo-input-bg !default;
19447
+ $datetime-text: $kendo-input-text !default;
19448
+ $datetime-border: $kendo-input-border !default;
19449
+
19450
+ $datetime-hovered-bg: $kendo-input-hover-bg !default;
19451
+ $datetime-hovered-text: $kendo-input-hover-text !default;
19452
+ $datetime-hovered-border: $kendo-input-hover-border !default;
19479
19453
 
19454
+ $datetime-focused-bg: $kendo-input-focus-bg !default;
19455
+ $datetime-focused-text: $kendo-input-focus-text !default;
19456
+ $datetime-focused-border: $kendo-input-focus-border !default;
19457
+ $datetime-focused-shadow: $kendo-input-focus-shadow !default;
19480
19458
 
19481
- // RTL
19482
- .k-rtl &,
19483
- &[dir="rtl"] {
19484
- text-align: right;
19459
+ $datetime-select-bg: null !default;
19460
+ $datetime-select-text: $subtle-text !default;
19461
+ $datetime-select-border: null !default;
19462
+ $datetime-select-gradient: null !default;
19485
19463
 
19486
- .k-select {
19487
- @include border-left-radius-only( $kendo-input-border-radius );
19488
- border-width: 0 $picker-select-border-width 0 0;
19489
- }
19490
- }
19491
- }
19464
+ $datetime-select-hovered-bg: null !default;
19465
+ $datetime-select-hovered-text: $kendo-input-text !default;
19466
+ $datetime-select-hovered-border: null !default;
19467
+ $datetime-select-hovered-gradient: null !default;
19468
+
19469
+ $datetime-select-pressed-bg: null !default;
19470
+ $datetime-select-pressed-text: $primary !default;
19471
+ $datetime-select-pressed-border: null !default;
19472
+ $datetime-select-pressed-gradient: null !default;
19473
+
19474
+ // #endregion
19475
+ // #region @import "_layout.scss"; -> packages/material/scss/datetime/_layout.scss
19476
+ // #region @import "~@progress/kendo-theme-default/scss/datetime/_layout.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/datetime/_layout.scss
19477
+ @include exports("datetime/layout") {
19492
19478
 
19493
19479
  .k-datetime-container {
19494
19480
 
@@ -19715,42 +19701,6 @@ $datetime-select-pressed-gradient: null !default;
19715
19701
 
19716
19702
  @include exports("datetime/layout/material") {
19717
19703
 
19718
- // Common
19719
- .k-datepicker,
19720
- .k-datetimepicker,
19721
- .k-timepicker {
19722
-
19723
- // Wrapper
19724
- .k-picker-wrap {
19725
- border-width: $kendo-input-border-width 0;
19726
- border-top-color: transparent !important; // sass-lint:disable-line no-important
19727
-
19728
- // Disabled state
19729
- .k-state-disabled > &,
19730
- &.k-state-disabled {
19731
- border-bottom-style: dashed;
19732
- }
19733
- }
19734
- }
19735
-
19736
-
19737
- // Dateinput
19738
- .k-dateinput {
19739
-
19740
- // Wrapper
19741
- .k-dateinput-wrap {
19742
- border-width: $kendo-input-border-width 0;
19743
- border-top-color: transparent !important; // sass-lint:disable-line no-important
19744
-
19745
-
19746
- // Disabled state
19747
- .k-state-disabled > &,
19748
- &.k-state-disabled {
19749
- border-bottom-style: dashed;
19750
- }
19751
- }
19752
- }
19753
-
19754
19704
  .k-timeselector,
19755
19705
  .k-datetime-wrap {
19756
19706
  .k-time-header {
@@ -19791,104 +19741,6 @@ $datetime-select-pressed-gradient: null !default;
19791
19741
  // #region @import "~@progress/kendo-theme-default/scss/datetime/_theme.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/datetime/_theme.scss
19792
19742
  @include exports("datetime/theme") {
19793
19743
 
19794
- // Common
19795
- .k-datepicker,
19796
- .k-timepicker,
19797
- .k-datetimepicker,
19798
- .k-dateinput {
19799
-
19800
- .k-select {
19801
- @include fill(
19802
- $datetime-select-text,
19803
- $datetime-select-bg,
19804
- $datetime-select-border,
19805
- $datetime-select-gradient
19806
- );
19807
- }
19808
-
19809
- .k-i-warning {
19810
- color: $error;
19811
- }
19812
- }
19813
-
19814
-
19815
- .k-datepicker .k-picker-wrap,
19816
- .k-timepicker .k-picker-wrap,
19817
- .k-datetimepicker .k-picker-wrap,
19818
- .k-dateinput .k-dateinput-wrap {
19819
- @include fill(
19820
- $datetime-text,
19821
- $datetime-bg,
19822
- $datetime-border
19823
- );
19824
-
19825
- // Hovered state
19826
- &:hover,
19827
- &.k-state-hover {
19828
- @include fill(
19829
- $datetime-hovered-text,
19830
- $datetime-hovered-bg,
19831
- $datetime-hovered-border
19832
- );
19833
- }
19834
-
19835
- // Selected state
19836
- &.k-state-focused,
19837
- &.k-state-active {
19838
- @include fill(
19839
- $datetime-focused-text,
19840
- $datetime-focused-bg,
19841
- $datetime-focused-border
19842
- );
19843
- @include box-shadow($datetime-focused-shadow);
19844
- }
19845
- }
19846
-
19847
- .k-datepicker,
19848
- .k-timepicker {
19849
-
19850
- .k-select:hover,
19851
- .k-select.k-state-hover {
19852
- @include fill(
19853
- $datetime-select-hovered-text,
19854
- $datetime-select-hovered-bg,
19855
- $datetime-select-hovered-border,
19856
- $datetime-select-hovered-gradient
19857
- );
19858
- }
19859
- }
19860
-
19861
-
19862
- .k-dateinput,
19863
- .k-datetimepicker {
19864
-
19865
- .k-link:hover,
19866
- .k-link.k-state-hover {
19867
- @include fill(
19868
- $datetime-select-hovered-text,
19869
- $datetime-select-hovered-bg,
19870
- $datetime-select-hovered-border,
19871
- $datetime-select-hovered-gradient
19872
- );
19873
- }
19874
-
19875
- .k-link:active,
19876
- .k-link.k-state-active,
19877
- .k-link.k-state-selected {
19878
- @include fill(
19879
- $datetime-select-pressed-text,
19880
- $datetime-select-pressed-bg,
19881
- $datetime-select-pressed-border,
19882
- $datetime-select-pressed-gradient
19883
- );
19884
- }
19885
- }
19886
-
19887
-
19888
- // Timepicker
19889
- .k-timepicker {}
19890
-
19891
-
19892
19744
  // Timepicker header
19893
19745
  .k-time-header {
19894
19746
 
@@ -19956,144 +19808,12 @@ $datetime-select-pressed-gradient: null !default;
19956
19808
  }
19957
19809
  }
19958
19810
 
19959
- .k-datepicker,
19960
- .k-datetimepicker,
19961
- .k-timepicker {
19962
- .k-picker-wrap {
19963
- // Invalid
19964
- &.k-invalid,
19965
- &.k-state-invalid {
19966
- border-color: $invalid-border;
19967
-
19968
- &:focus,
19969
- &.k-state-focused {
19970
- @include box-shadow($invalid-shadow);
19971
- }
19972
- }
19973
- }
19974
- // Invalid
19975
- &.k-state-invalid,
19976
- &.ng-invalid.ng-touched,
19977
- &.ng-invalid.ng-dirty {
19978
- .k-picker-wrap {
19979
- border-color: $invalid-border;
19980
-
19981
- &:focus,
19982
- &.k-state-focused {
19983
- @include box-shadow($invalid-shadow);
19984
- }
19985
- }
19986
- }
19987
- }
19988
- .k-dateinput {
19989
- .k-dateinput-wrap {
19990
- // Invalid
19991
- &.k-invalid,
19992
- &.k-state-invalid {
19993
- border-color: $invalid-border;
19994
-
19995
- &:focus,
19996
- &.k-state-focused {
19997
- @include box-shadow($invalid-shadow);
19998
- }
19999
- }
20000
- }
20001
- // Invalid
20002
- &.k-state-invalid,
20003
- &.ng-invalid.ng-touched,
20004
- &.ng-invalid.ng-dirty {
20005
- .k-dateinput-wrap {
20006
- border-color: $invalid-border;
20007
-
20008
- &:focus,
20009
- &.k-state-focused {
20010
- @include box-shadow($invalid-shadow);
20011
- }
20012
- }
20013
- }
20014
- }
20015
-
20016
- // Universal rendering
20017
- .k-datepicker {
20018
- &.k-state-hover {
20019
- .k-picker-wrap {
20020
- @include fill(
20021
- $datetime-hovered-text,
20022
- $datetime-hovered-bg,
20023
- $datetime-hovered-border
20024
- );
20025
- }
20026
- }
20027
-
20028
- &.k-state-focus {
20029
- .k-picker-wrap {
20030
- @include fill(
20031
- $datetime-focused-text,
20032
- $datetime-focused-bg,
20033
- $datetime-focused-border
20034
- );
20035
- @include box-shadow($datetime-focused-shadow);
20036
- }
20037
- }
20038
-
20039
- &.k-invalid {
20040
- .k-picker-wrap {
20041
- border-color: $invalid-border;
20042
- }
20043
- }
20044
-
20045
- &.k-invalid.k-state-focus {
20046
- .k-picker-wrap {
20047
- @include box-shadow($invalid-shadow);
20048
- }
20049
- }
20050
- }
20051
-
20052
- .k-dateinput,
20053
- .k-daterangepicker {
20054
- &.k-state-hover {
20055
- .k-dateinput-wrap {
20056
- @include fill(
20057
- $datetime-hovered-text,
20058
- $datetime-hovered-bg,
20059
- $datetime-hovered-border
20060
- );
20061
- }
20062
- }
20063
-
20064
- &.k-state-focus {
20065
- .k-dateinput-wrap {
20066
- @include fill(
20067
- $datetime-focused-text,
20068
- $datetime-focused-bg,
20069
- $datetime-focused-border
20070
- );
20071
- @include box-shadow($datetime-focused-shadow);
20072
- }
20073
- }
20074
-
20075
- &.k-invalid {
20076
- .k-dateinput-wrap {
20077
- border-color: $invalid-border;
20078
- }
20079
- }
20080
-
20081
- &.k-invalid.k-state-focus {
20082
- .k-dateinput-wrap {
20083
- @include box-shadow($invalid-shadow);
20084
- }
20085
- }
20086
- }
20087
-
20088
19811
  }
20089
19812
 
20090
19813
  // #endregion
20091
19814
 
20092
19815
  @include exports( "datetime/theme/material" ) {
20093
19816
 
20094
- // Timepicker
20095
- .k-timepicker {}
20096
-
20097
19817
  .k-timeselector,
20098
19818
  .k-datetime-wrap {
20099
19819
  border-color: inherit;
@@ -35644,27 +35364,6 @@ $filter-preview-operator-text: $subtle-text !default;
35644
35364
 
35645
35365
  // #endregion
35646
35366
 
35647
- @include exports("filter/layout/material") {
35648
-
35649
- .k-filter {
35650
- .k-filter-toolbar {
35651
- .k-picker-wrap,
35652
- .k-dateinput-wrap {
35653
- border-width: 0 0 1px;
35654
-
35655
- .k-input {
35656
- padding: $kendo-input-padding-y $kendo-input-padding-x;
35657
- height: calc( #{$kendo-input-padding-y * 2} + #{$kendo-input-line-height * 1em} );
35658
- }
35659
-
35660
- .k-select {
35661
- padding: 0;
35662
- }
35663
- }
35664
- }
35665
- }
35666
- }
35667
-
35668
35367
  // #endregion
35669
35368
  // #region @import "_theme.scss"; -> packages/material/scss/filter/_theme.scss
35670
35369
  // #region @import "~@progress/kendo-theme-default/scss/filter/_theme.scss"; -> packages/material/node_modules/@progress/kendo-theme-default/scss/filter/_theme.scss
@@ -40556,15 +40255,6 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
40556
40255
  align-items: center;
40557
40256
  }
40558
40257
 
40559
- kendo-scheduler-datetime-picker {
40560
- display: inline-flex;
40561
- width: 100%;
40562
-
40563
- .k-picker-wrap {
40564
- flex: 1;
40565
- }
40566
- }
40567
-
40568
40258
  }
40569
40259
 
40570
40260
  .k-edit-field .k-reset {