@progress/kendo-theme-bootstrap 5.0.0-beta.3 → 5.0.0-beta.4
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.css +914 -1178
- package/dist/all.scss +1104 -1329
- package/dist/bootstrap-dataviz-v4.scss +8 -0
- package/dist/bootstrap-main.scss +6 -6
- package/lib/swatches/bootstrap-dataviz-v4.json +51 -0
- package/lib/swatches/bootstrap-main.json +6 -6
- package/package.json +3 -3
- package/scss/appbar/_variables.scss +1 -1
- package/scss/autocomplete/_variables.scss +0 -19
- package/scss/button/_layout.scss +0 -8
- package/scss/button/_theme.scss +0 -81
- package/scss/button/_variables.scss +48 -20
- package/scss/chat/_variables.scss +0 -5
- package/scss/checkbox/_index.scss +1 -0
- package/scss/checkbox/_variables.scss +58 -61
- package/scss/chip/_variables.scss +1 -1
- package/scss/grid/_theme.scss +0 -6
- package/scss/grid/_variables.scss +2 -2
- package/scss/list/_variables.scss +18 -18
- package/scss/menu/_variables.scss +44 -46
- package/scss/radio/_variables.scss +68 -81
- package/scss/table/_variables.scss +8 -8
- package/scss/treeview/_variables.scss +45 -45
package/dist/all.scss
CHANGED
|
@@ -4772,18 +4772,6 @@ $display4-letter-spacing: null !default;
|
|
|
4772
4772
|
// #region @import "~@progress/kendo-theme-default/scss/common/_loading.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/common/_loading.scss
|
|
4773
4773
|
@include exports( "common/loading" ) {
|
|
4774
4774
|
|
|
4775
|
-
// Loading indicator
|
|
4776
|
-
.k-loading {
|
|
4777
|
-
width: 64px;
|
|
4778
|
-
height: 64px;
|
|
4779
|
-
display: block;
|
|
4780
|
-
|
|
4781
|
-
.animate {
|
|
4782
|
-
animation: loading 2s infinite linear;
|
|
4783
|
-
}
|
|
4784
|
-
}
|
|
4785
|
-
|
|
4786
|
-
|
|
4787
4775
|
// Loading mask
|
|
4788
4776
|
.k-loading-mask,
|
|
4789
4777
|
.k-loading-image,
|
|
@@ -4872,7 +4860,7 @@ $display4-letter-spacing: null !default;
|
|
|
4872
4860
|
content: "";
|
|
4873
4861
|
// See https://github.com/telerik/kendo-themes/issues/1925
|
|
4874
4862
|
border-width: 1px; // TODO: Remove once we drop IE support
|
|
4875
|
-
border-width:
|
|
4863
|
+
border-width: clamp( .015em, 1px, 1px ); // sass-lint:disable-line no-duplicate-properties
|
|
4876
4864
|
font-size: 4em;
|
|
4877
4865
|
}
|
|
4878
4866
|
}
|
|
@@ -8111,17 +8099,17 @@ $kendo-list-line-height-lg: null !default;
|
|
|
8111
8099
|
/// @group list
|
|
8112
8100
|
$kendo-list-header-padding-x: null !default;
|
|
8113
8101
|
$kendo-list-header-padding-x-base: map-get( $spacing, 4 ) !default;
|
|
8114
|
-
$kendo-list-header-padding-x-sm: ( $
|
|
8115
|
-
$kendo-list-header-padding-x-md: ( $
|
|
8116
|
-
$kendo-list-header-padding-x-lg: ( $
|
|
8102
|
+
$kendo-list-header-padding-x-sm: map-get( $spacing, 4 ) !default;
|
|
8103
|
+
$kendo-list-header-padding-x-md: map-get( $spacing, 4 ) !default;
|
|
8104
|
+
$kendo-list-header-padding-x-lg: map-get( $spacing, 4 ) !default;
|
|
8117
8105
|
|
|
8118
8106
|
/// Vertical padding of list header, if no size is set.
|
|
8119
8107
|
/// @group list
|
|
8120
8108
|
$kendo-list-header-padding-y: null !default;
|
|
8121
8109
|
$kendo-list-header-padding-y-base: map-get( $spacing, 1 ) !default;
|
|
8122
|
-
$kendo-list-header-padding-y-sm: ( $
|
|
8123
|
-
$kendo-list-header-padding-y-md: ( $
|
|
8124
|
-
$kendo-list-header-padding-y-lg: ( $
|
|
8110
|
+
$kendo-list-header-padding-y-sm: map-get( $spacing, 1 ) - map-get( $spacing, thin ) !default;
|
|
8111
|
+
$kendo-list-header-padding-y-md: map-get( $spacing, 1 ) !default;
|
|
8112
|
+
$kendo-list-header-padding-y-lg: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !default;
|
|
8125
8113
|
|
|
8126
8114
|
/// Border width of list header.
|
|
8127
8115
|
/// @group list
|
|
@@ -8149,17 +8137,17 @@ $kendo-list-header-font-weight: bold !default;
|
|
|
8149
8137
|
/// @group list
|
|
8150
8138
|
$kendo-list-item-padding-x: null !default;
|
|
8151
8139
|
$kendo-list-item-padding-x-base: map-get( $spacing, 4 ) !default;
|
|
8152
|
-
$kendo-list-item-padding-x-sm: ( $
|
|
8153
|
-
$kendo-list-item-padding-x-md: ( $
|
|
8154
|
-
$kendo-list-item-padding-x-lg: ( $
|
|
8140
|
+
$kendo-list-item-padding-x-sm: map-get( $spacing, 4 ) !default;
|
|
8141
|
+
$kendo-list-item-padding-x-md: map-get( $spacing, 4 ) !default;
|
|
8142
|
+
$kendo-list-item-padding-x-lg: map-get( $spacing, 4 ) !default;
|
|
8155
8143
|
|
|
8156
8144
|
/// Vertical padding of list items, when no size is set.
|
|
8157
8145
|
/// @group list
|
|
8158
8146
|
$kendo-list-item-padding-y: null !default;
|
|
8159
8147
|
$kendo-list-item-padding-y-base: map-get( $spacing, 1 ) !default;
|
|
8160
|
-
$kendo-list-item-padding-y-sm: ( $
|
|
8161
|
-
$kendo-list-item-padding-y-md: ( $
|
|
8162
|
-
$kendo-list-item-padding-y-lg: ( $
|
|
8148
|
+
$kendo-list-item-padding-y-sm: map-get( $spacing, 1 ) - map-get( $spacing, thin ) !default;
|
|
8149
|
+
$kendo-list-item-padding-y-md: map-get( $spacing, 1 ) !default;
|
|
8150
|
+
$kendo-list-item-padding-y-lg: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !default;
|
|
8163
8151
|
|
|
8164
8152
|
/// Font size of list items, if no size is set.
|
|
8165
8153
|
/// @group list
|
|
@@ -8179,17 +8167,17 @@ $kendo-list-item-line-height-lg: null !default;
|
|
|
8179
8167
|
/// @group list
|
|
8180
8168
|
$kendo-list-group-item-padding-x: null !default;
|
|
8181
8169
|
$kendo-list-group-item-padding-x-base: map-get( $spacing, 4 ) !default;
|
|
8182
|
-
$kendo-list-group-item-padding-x-sm: ( $
|
|
8183
|
-
$kendo-list-group-item-padding-x-md: ( $
|
|
8184
|
-
$kendo-list-group-item-padding-x-lg: ( $
|
|
8170
|
+
$kendo-list-group-item-padding-x-sm: map-get( $spacing, 4 ) !default;
|
|
8171
|
+
$kendo-list-group-item-padding-x-md: map-get( $spacing, 4 ) !default;
|
|
8172
|
+
$kendo-list-group-item-padding-x-lg: map-get( $spacing, 4 ) !default;
|
|
8185
8173
|
|
|
8186
8174
|
/// Vertical padding of list group items, when no size is set.
|
|
8187
8175
|
/// @group list
|
|
8188
8176
|
$kendo-list-group-item-padding-y: null !default;
|
|
8189
8177
|
$kendo-list-group-item-padding-y-base: map-get( $spacing, 1 ) !default;
|
|
8190
|
-
$kendo-list-group-item-padding-y-sm: ( $
|
|
8191
|
-
$kendo-list-group-item-padding-y-md: ( $
|
|
8192
|
-
$kendo-list-group-item-padding-y-lg: ( $
|
|
8178
|
+
$kendo-list-group-item-padding-y-sm: map-get( $spacing, 1 ) - map-get( $spacing, thin ) !default;
|
|
8179
|
+
$kendo-list-group-item-padding-y-md: map-get( $spacing, 1 ) !default;
|
|
8180
|
+
$kendo-list-group-item-padding-y-lg: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !default;
|
|
8193
8181
|
|
|
8194
8182
|
/// Border width of list group items.
|
|
8195
8183
|
/// @group list
|
|
@@ -8342,129 +8330,138 @@ $kendo-list-no-data-text: $subtle-text !default;
|
|
|
8342
8330
|
|
|
8343
8331
|
// #endregion
|
|
8344
8332
|
|
|
8333
|
+
|
|
8345
8334
|
// Component
|
|
8346
8335
|
// #region @import "_variables.scss"; -> packages/bootstrap/scss/checkbox/_variables.scss
|
|
8347
8336
|
// Checkbox
|
|
8348
8337
|
|
|
8349
|
-
///
|
|
8338
|
+
/// Border width of checkbox.
|
|
8350
8339
|
/// @group checkbox
|
|
8340
|
+
$kendo-checkbox-border-width: 1px !default;
|
|
8341
|
+
|
|
8342
|
+
// Checkbox sizes
|
|
8351
8343
|
$kendo-checkbox-sizes: (
|
|
8352
|
-
sm:
|
|
8353
|
-
|
|
8354
|
-
|
|
8344
|
+
sm: (
|
|
8345
|
+
size: map-get( $spacing, 3 ),
|
|
8346
|
+
glyph-size: ( map-get( $spacing, 3 ) - map-get( $spacing, thin ) ),
|
|
8347
|
+
ripple-size: map-get( $spacing, 3 ) * 3
|
|
8348
|
+
),
|
|
8349
|
+
md: (
|
|
8350
|
+
size: map-get( $spacing, 4 ),
|
|
8351
|
+
glyph-size: ( map-get( $spacing, 4 ) - map-get( $spacing, thin ) ),
|
|
8352
|
+
ripple-size: map-get( $spacing, 4 ) * 3
|
|
8353
|
+
),
|
|
8354
|
+
lg: (
|
|
8355
|
+
size: map-get( $spacing, 5 ),
|
|
8356
|
+
glyph-size: ( map-get( $spacing, 5 ) - map-get( $spacing, thin ) ),
|
|
8357
|
+
ripple-size: map-get( $spacing, 5 ) * 3
|
|
8358
|
+
)
|
|
8355
8359
|
) !default;
|
|
8356
8360
|
|
|
8357
|
-
///
|
|
8358
|
-
/// @group checkbox
|
|
8359
|
-
$kendo-checkbox-border-width: 1px !default;
|
|
8360
|
-
/// The line height of checkbox.
|
|
8361
|
-
/// @group checkbox
|
|
8362
|
-
$kendo-checkbox-line-height: calc( #{map-get( $kendo-checkbox-sizes, "md" )} + #{$kendo-checkbox-border-width} ) !default;
|
|
8363
|
-
|
|
8364
|
-
/// The background of checkbox.
|
|
8361
|
+
/// Background color of checkbox.
|
|
8365
8362
|
/// @group checkbox
|
|
8366
8363
|
$kendo-checkbox-bg: $component-bg !default;
|
|
8367
|
-
///
|
|
8364
|
+
/// Color of checkbox.
|
|
8368
8365
|
/// @group checkbox
|
|
8369
8366
|
$kendo-checkbox-text: null !default;
|
|
8370
|
-
///
|
|
8367
|
+
/// Border color of checkbox.
|
|
8371
8368
|
/// @group checkbox
|
|
8372
8369
|
$kendo-checkbox-border: contrast-wcag( $kendo-checkbox-bg, $gray-400, $gray-600 ) !default;
|
|
8373
8370
|
|
|
8374
|
-
///
|
|
8371
|
+
/// Background color of hovered checkbox.
|
|
8375
8372
|
/// @group checkbox
|
|
8376
8373
|
$kendo-checkbox-hover-bg: null !default;
|
|
8377
|
-
///
|
|
8374
|
+
/// Color of hovered checkbox.
|
|
8378
8375
|
/// @group checkbox
|
|
8379
8376
|
$kendo-checkbox-hover-text: null !default;
|
|
8380
|
-
///
|
|
8377
|
+
/// Border color of hovered checkbox.
|
|
8381
8378
|
/// @group checkbox
|
|
8382
8379
|
$kendo-checkbox-hover-border: null !default;
|
|
8383
8380
|
|
|
8384
|
-
///
|
|
8381
|
+
/// Background color of checked checkbox.
|
|
8385
8382
|
/// @group checkbox
|
|
8386
8383
|
$kendo-checkbox-checked-bg: $primary !default;
|
|
8387
|
-
///
|
|
8384
|
+
/// Color of checked checkbox.
|
|
8388
8385
|
/// @group checkbox
|
|
8389
8386
|
$kendo-checkbox-checked-text: contrast-wcag( $kendo-checkbox-checked-bg ) !default;
|
|
8390
|
-
///
|
|
8387
|
+
/// Border color of checked checkbox.
|
|
8391
8388
|
/// @group checkbox
|
|
8392
8389
|
$kendo-checkbox-checked-border: $kendo-checkbox-checked-bg !default;
|
|
8393
8390
|
|
|
8394
|
-
///
|
|
8391
|
+
/// Background color of indeterminate checkbox.
|
|
8395
8392
|
/// @group checkbox
|
|
8396
8393
|
$kendo-checkbox-indeterminate-bg: $kendo-checkbox-checked-bg !default;
|
|
8397
|
-
///
|
|
8394
|
+
/// Color of indeterminate checkbox.
|
|
8398
8395
|
/// @group checkbox
|
|
8399
8396
|
$kendo-checkbox-indeterminate-text: $kendo-checkbox-checked-text !default;
|
|
8400
|
-
///
|
|
8397
|
+
/// Border color of indeterminate checkbox.
|
|
8401
8398
|
/// @group checkbox
|
|
8402
8399
|
$kendo-checkbox-indeterminate-border: $kendo-checkbox-checked-border !default;
|
|
8403
8400
|
|
|
8404
|
-
///
|
|
8401
|
+
/// Border color of focused checkbox.
|
|
8405
8402
|
/// @group checkbox
|
|
8406
8403
|
$kendo-checkbox-focus-border: try-tint( $primary, 50% ) !default;
|
|
8407
|
-
///
|
|
8404
|
+
/// Box shadow of focused checkbox.
|
|
8408
8405
|
/// @group checkbox
|
|
8409
8406
|
$kendo-checkbox-focus-shadow: 0 0 0 .25rem rgba( $primary, .25 ) !default;
|
|
8410
|
-
///
|
|
8407
|
+
/// Border color of focused and checked checkbox.
|
|
8411
8408
|
/// @group checkbox
|
|
8412
8409
|
$kendo-checkbox-focus-checked-border: $kendo-checkbox-checked-border !default;
|
|
8413
|
-
///
|
|
8410
|
+
/// Box shadow of focused and checked checkbox.
|
|
8414
8411
|
/// @group checkbox
|
|
8415
8412
|
$kendo-checkbox-focus-checked-shadow: $kendo-checkbox-focus-shadow !default;
|
|
8416
8413
|
|
|
8417
|
-
///
|
|
8414
|
+
/// Background color of disabled checkbox.
|
|
8418
8415
|
/// @group checkbox
|
|
8419
8416
|
$kendo-checkbox-disabled-bg: null !default;
|
|
8420
|
-
///
|
|
8417
|
+
/// Color of disabled checkbox.
|
|
8421
8418
|
/// @group checkbox
|
|
8422
8419
|
$kendo-checkbox-disabled-text: null !default;
|
|
8423
|
-
///
|
|
8420
|
+
/// Border color of disabled checkbox.
|
|
8424
8421
|
/// @group checkbox
|
|
8425
8422
|
$kendo-checkbox-disabled-border: null !default;
|
|
8426
8423
|
|
|
8427
|
-
///
|
|
8424
|
+
/// Background color of disabled and checked checkbox.
|
|
8428
8425
|
/// @group checkbox
|
|
8429
8426
|
$kendo-checkbox-disabled-checked-bg: null !default;
|
|
8430
|
-
///
|
|
8427
|
+
/// Color of disabled and checked checkbox.
|
|
8431
8428
|
/// @group checkbox
|
|
8432
8429
|
$kendo-checkbox-disabled-checked-text: null !default;
|
|
8433
|
-
///
|
|
8430
|
+
/// Color of disabled and checked checkbox.
|
|
8434
8431
|
/// @group checkbox
|
|
8435
8432
|
$kendo-checkbox-disabled-checked-border: null !default;
|
|
8436
8433
|
|
|
8437
|
-
///
|
|
8434
|
+
/// Background color of invalid checkbox.
|
|
8438
8435
|
/// @group checkbox
|
|
8439
8436
|
$kendo-checkbox-invalid-bg: null !default;
|
|
8440
|
-
///
|
|
8437
|
+
/// Color of invalid checkbox.
|
|
8441
8438
|
/// @group checkbox
|
|
8442
8439
|
$kendo-checkbox-invalid-text: $invalid-text !default;
|
|
8443
|
-
///
|
|
8440
|
+
/// Border color of invalid checkbox.
|
|
8444
8441
|
/// @group checkbox
|
|
8445
8442
|
$kendo-checkbox-invalid-border: $invalid-border !default;
|
|
8446
8443
|
|
|
8447
8444
|
|
|
8448
8445
|
// Checkbox indicator
|
|
8449
8446
|
|
|
8450
|
-
///
|
|
8447
|
+
/// Type of checkbox indicator.
|
|
8451
8448
|
/// @group checkbox
|
|
8452
|
-
$kendo-checkbox-
|
|
8449
|
+
$kendo-checkbox-indicator-type: image !default;
|
|
8453
8450
|
|
|
8454
|
-
///
|
|
8451
|
+
/// Glyph font family of checkbox indicator.
|
|
8455
8452
|
/// @group checkbox
|
|
8456
8453
|
$kendo-checkbox-glyph-font-family: "WebComponentsIcons", monospace !default;
|
|
8457
|
-
///
|
|
8454
|
+
/// Glyph of checkbox indicator.
|
|
8458
8455
|
/// @group checkbox
|
|
8459
8456
|
$kendo-checkbox-checked-glyph: "\e118" !default;
|
|
8460
|
-
///
|
|
8457
|
+
/// Glyph of indeterminate checkbox indicator.
|
|
8461
8458
|
/// @group checkbox
|
|
8462
8459
|
$kendo-checkbox-indeterminate-glyph: "\e121" !default;
|
|
8463
8460
|
|
|
8464
|
-
///
|
|
8461
|
+
/// Image of checked checkbox indicator.
|
|
8465
8462
|
/// @group checkbox
|
|
8466
8463
|
$kendo-checkbox-checked-image: escape-svg( url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$kendo-checkbox-checked-text}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/></svg>") ) !default;
|
|
8467
|
-
///
|
|
8464
|
+
/// Image of checked checkbox indicator.
|
|
8468
8465
|
/// @group checkbox
|
|
8469
8466
|
$kendo-checkbox-indeterminate-image: escape-svg( url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$kendo-checkbox-indeterminate-text}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/></svg>") ) !default;
|
|
8470
8467
|
|
|
@@ -8478,36 +8475,25 @@ $kendo-checkbox-label-margin-x: map-get( $spacing, 1 ) !default;
|
|
|
8478
8475
|
|
|
8479
8476
|
// Checkbox list
|
|
8480
8477
|
|
|
8481
|
-
///
|
|
8478
|
+
/// Spacing between items of horizontal checkbox list.
|
|
8482
8479
|
/// @group checkbox
|
|
8483
8480
|
$kendo-checkbox-list-spacing: map-get( $spacing, 4 ) !default;
|
|
8484
|
-
///
|
|
8481
|
+
/// Horizontal padding of checkbox list items.
|
|
8485
8482
|
/// @group checkbox
|
|
8486
8483
|
$kendo-checkbox-list-item-padding-x: 0px !default;
|
|
8487
|
-
///
|
|
8484
|
+
/// Vertical padding of checkbox list items.
|
|
8488
8485
|
/// @group checkbox
|
|
8489
8486
|
$kendo-checkbox-list-item-padding-y: $kendo-list-item-padding-y-md !default;
|
|
8490
8487
|
|
|
8491
8488
|
|
|
8492
8489
|
// Checkbox ripple
|
|
8493
8490
|
|
|
8494
|
-
///
|
|
8491
|
+
/// Background color of checkbox ripple.
|
|
8495
8492
|
/// @group checkbox
|
|
8496
|
-
$kendo-checkbox-ripple-
|
|
8497
|
-
|
|
8498
|
-
md: (map-get( $kendo-checkbox-sizes, "md" ) * 3),
|
|
8499
|
-
lg: (map-get( $kendo-checkbox-sizes, "lg" ) * 3)
|
|
8500
|
-
) !default;
|
|
8501
|
-
/// The ripple margin of checkbox.
|
|
8502
|
-
/// @group checkbox
|
|
8503
|
-
$kendo-checkbox-ripple-margin: (
|
|
8504
|
-
sm: calc(-1 * (#{map-get( $kendo-checkbox-sizes, "sm" )} + #{$kendo-checkbox-border-width})),
|
|
8505
|
-
md: calc(-1 * (#{map-get( $kendo-checkbox-sizes, "md" )} + #{$kendo-checkbox-border-width})),
|
|
8506
|
-
lg: calc(-1 * (#{map-get( $kendo-checkbox-sizes, "lg" )} + #{$kendo-checkbox-border-width}))
|
|
8507
|
-
) !default;
|
|
8508
|
-
/// The ripple opacity of checkbox.
|
|
8493
|
+
$kendo-checkbox-ripple-bg: $kendo-checkbox-checked-bg !default;
|
|
8494
|
+
/// Opacity of checkbox ripple.
|
|
8509
8495
|
/// @group checkbox
|
|
8510
|
-
$kendo-checkbox-ripple-opacity: .
|
|
8496
|
+
$kendo-checkbox-ripple-opacity: .25 !default;
|
|
8511
8497
|
|
|
8512
8498
|
// #endregion
|
|
8513
8499
|
// #region @import "_layout.scss"; -> packages/bootstrap/scss/checkbox/_layout.scss
|
|
@@ -8533,51 +8519,20 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8533
8519
|
-webkit-appearance: none;
|
|
8534
8520
|
}
|
|
8535
8521
|
|
|
8536
|
-
@each $name, $size in $kendo-checkbox-sizes {
|
|
8537
|
-
// Checkbox sizes
|
|
8538
|
-
.k-checkbox-#{$name} {
|
|
8539
|
-
width: $size;
|
|
8540
|
-
height: $size;
|
|
8541
8522
|
|
|
8542
|
-
|
|
8543
|
-
|
|
8544
|
-
|
|
8545
|
-
|
|
8546
|
-
|
|
8547
|
-
|
|
8548
|
-
|
|
8549
|
-
|
|
8550
|
-
|
|
8551
|
-
|
|
8552
|
-
|
|
8553
|
-
|
|
8554
|
-
|
|
8555
|
-
.k-checkbox-#{$name}::before {
|
|
8556
|
-
@if $kendo-checkbox-icon-type == "glyph" {
|
|
8557
|
-
content: $kendo-checkbox-checked-glyph;
|
|
8558
|
-
width: ($size - map-get( $spacing, thin ));
|
|
8559
|
-
height: ($size - map-get( $spacing, thin ));
|
|
8560
|
-
font-size: ($size - map-get( $spacing, thin ));
|
|
8561
|
-
font-family: $kendo-checkbox-glyph-font-family;
|
|
8562
|
-
line-height: 1;
|
|
8563
|
-
transform: scale(0) translate(-50%, -50%);
|
|
8564
|
-
overflow: hidden;
|
|
8565
|
-
position: absolute;
|
|
8566
|
-
top: 50%;
|
|
8567
|
-
left: 50%;
|
|
8568
|
-
}
|
|
8569
|
-
|
|
8570
|
-
@if $kendo-checkbox-icon-type == "marker" {
|
|
8571
|
-
content: "";
|
|
8572
|
-
width: ($size - map-get( $spacing, 1 ));
|
|
8573
|
-
height: ($size - map-get( $spacing, 1 ));
|
|
8574
|
-
background-color: currentColor;
|
|
8575
|
-
transform: scale(0) translate(-50%, -50%);
|
|
8576
|
-
overflow: hidden;
|
|
8577
|
-
position: absolute;
|
|
8578
|
-
top: 50%;
|
|
8579
|
-
left: 50%;
|
|
8580
|
-
}
|
|
8523
|
+
// Checkbox indicator
|
|
8524
|
+
.k-checkbox::before {
|
|
8525
|
+
@if $kendo-checkbox-indicator-type == "glyph" {
|
|
8526
|
+
content: $kendo-checkbox-checked-glyph;
|
|
8527
|
+
width: 1em;
|
|
8528
|
+
height: 1em;
|
|
8529
|
+
font-family: $kendo-checkbox-glyph-font-family;
|
|
8530
|
+
line-height: 1;
|
|
8531
|
+
transform: translate(-50%, -50%) scale(0);
|
|
8532
|
+
overflow: hidden;
|
|
8533
|
+
position: absolute;
|
|
8534
|
+
top: 50%;
|
|
8535
|
+
left: 50%;
|
|
8581
8536
|
}
|
|
8582
8537
|
}
|
|
8583
8538
|
|
|
@@ -8585,52 +8540,37 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8585
8540
|
// Checked state
|
|
8586
8541
|
.k-checkbox:checked,
|
|
8587
8542
|
.k-checkbox.k-checked {
|
|
8588
|
-
@if $kendo-checkbox-
|
|
8543
|
+
@if $kendo-checkbox-indicator-type == "image" {
|
|
8589
8544
|
background-image: $kendo-checkbox-checked-image;
|
|
8590
8545
|
}
|
|
8591
8546
|
|
|
8592
|
-
@if $kendo-checkbox-
|
|
8593
|
-
&::before {
|
|
8594
|
-
transform: scale(1) translate(-50%, -50%);
|
|
8595
|
-
}
|
|
8596
|
-
}
|
|
8597
|
-
|
|
8598
|
-
@if $kendo-checkbox-icon-type == "marker" {
|
|
8547
|
+
@if $kendo-checkbox-indicator-type == "glyph" {
|
|
8599
8548
|
&::before {
|
|
8600
|
-
transform:
|
|
8549
|
+
transform: translate(-50%, -50%) scale(1);
|
|
8601
8550
|
}
|
|
8602
8551
|
}
|
|
8603
8552
|
}
|
|
8604
8553
|
|
|
8554
|
+
|
|
8605
8555
|
// Indeterminate state
|
|
8606
8556
|
.k-checkbox:indeterminate,
|
|
8607
8557
|
.k-checkbox.k-indeterminate {
|
|
8608
|
-
@if $kendo-checkbox-
|
|
8558
|
+
@if $kendo-checkbox-indicator-type == "image" {
|
|
8609
8559
|
background-image: $kendo-checkbox-indeterminate-image;
|
|
8610
8560
|
}
|
|
8611
8561
|
|
|
8612
|
-
@if $kendo-checkbox-
|
|
8562
|
+
@if $kendo-checkbox-indicator-type == "glyph" {
|
|
8613
8563
|
&::before {
|
|
8614
8564
|
content: $kendo-checkbox-indeterminate-glyph;
|
|
8615
8565
|
transform: scale(1) translate(-50%, -50%);
|
|
8616
8566
|
}
|
|
8617
8567
|
}
|
|
8618
|
-
|
|
8619
|
-
@if $kendo-checkbox-icon-type == "marker" {
|
|
8620
|
-
&::before {
|
|
8621
|
-
width: $kendo-checkbox-maker-indeterminate-width;
|
|
8622
|
-
height: $kendo-checkbox-marker-indeterminate-height;
|
|
8623
|
-
transform: scale(1) translate(-50%, -50%);
|
|
8624
|
-
}
|
|
8625
|
-
}
|
|
8626
8568
|
}
|
|
8627
8569
|
|
|
8628
8570
|
|
|
8629
8571
|
// Disabled state
|
|
8630
8572
|
.k-checkbox:disabled,
|
|
8631
|
-
.k-checkbox.k-disabled
|
|
8632
|
-
.k-checkbox:disabled + .k-checkbox-label,
|
|
8633
|
-
.k-checkbox.k-disabled + .k-checkbox-label {
|
|
8573
|
+
.k-checkbox.k-disabled {
|
|
8634
8574
|
@include disabled( $disabled-styling );
|
|
8635
8575
|
}
|
|
8636
8576
|
|
|
@@ -8642,6 +8582,9 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8642
8582
|
flex-flow: row nowrap;
|
|
8643
8583
|
gap: 0;
|
|
8644
8584
|
align-items: center;
|
|
8585
|
+
align-self: flex-start;
|
|
8586
|
+
vertical-align: middle;
|
|
8587
|
+
position: relative;
|
|
8645
8588
|
|
|
8646
8589
|
&::before {
|
|
8647
8590
|
content: "\200b";
|
|
@@ -8658,55 +8601,24 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8658
8601
|
.k-checkbox-label {
|
|
8659
8602
|
margin: 0;
|
|
8660
8603
|
padding: 0;
|
|
8661
|
-
line-height: $kendo-checkbox-line-height;
|
|
8662
8604
|
display: inline-flex;
|
|
8663
8605
|
align-items: flex-start;
|
|
8606
|
+
gap: $kendo-checkbox-label-margin-x;
|
|
8664
8607
|
vertical-align: middle;
|
|
8665
8608
|
position: relative;
|
|
8666
8609
|
cursor: pointer;
|
|
8667
8610
|
|
|
8668
|
-
.k-label {
|
|
8669
|
-
cursor: pointer;
|
|
8670
|
-
}
|
|
8671
|
-
|
|
8672
8611
|
.k-ripple {
|
|
8673
|
-
right: auto;
|
|
8674
|
-
bottom: auto;
|
|
8675
|
-
transform: translate(-50%, -50%);
|
|
8676
|
-
border-radius: 50%;
|
|
8677
|
-
|
|
8678
8612
|
// Hide ripple temporarily
|
|
8679
8613
|
visibility: hidden !important; // sass-lint:disable-line no-important
|
|
8680
8614
|
}
|
|
8681
|
-
|
|
8682
|
-
.k-ripple-blob {
|
|
8683
|
-
// sass-lint:disable-block no-important
|
|
8684
|
-
// use !important until ripple can apply these styles from the script
|
|
8685
|
-
top: 50% !important;
|
|
8686
|
-
left: 50% !important;
|
|
8687
|
-
width: 200% !important;
|
|
8688
|
-
height: 200% !important;
|
|
8689
|
-
}
|
|
8690
|
-
}
|
|
8691
|
-
.k-checkbox + .k-checkbox-label {
|
|
8692
|
-
display: inline;
|
|
8693
8615
|
}
|
|
8616
|
+
.k-checkbox + .k-label,
|
|
8617
|
+
.k-checkbox-wrap + .k-label,
|
|
8694
8618
|
.k-checkbox + .k-checkbox-label,
|
|
8695
|
-
.k-checkbox-
|
|
8696
|
-
margin-left: $kendo-checkbox-label-margin-x;
|
|
8697
|
-
}
|
|
8698
|
-
.k-checkbox-label > .k-checkbox {
|
|
8699
|
-
margin-right: $kendo-checkbox-label-margin-x;
|
|
8700
|
-
flex-shrink: 0;
|
|
8701
|
-
}
|
|
8702
|
-
kendo-label.k-checkbox-label > .k-checkbox:last-child {
|
|
8703
|
-
margin-right: 0;
|
|
8704
|
-
}
|
|
8705
|
-
kendo-label.k-checkbox-label > .k-label:first-child {
|
|
8706
|
-
margin-right: $kendo-checkbox-label-margin-x;
|
|
8707
|
-
}
|
|
8708
|
-
kendo-label.k-checkbox-label > .k-label {
|
|
8619
|
+
.k-checkbox-wrap + .k-checkbox-label {
|
|
8709
8620
|
display: inline;
|
|
8621
|
+
margin-inline-start: $kendo-checkbox-label-margin-x;
|
|
8710
8622
|
}
|
|
8711
8623
|
|
|
8712
8624
|
|
|
@@ -8714,9 +8626,6 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8714
8626
|
.k-checkbox-label:empty {
|
|
8715
8627
|
display: none !important; // sass-lint:disable-line no-important
|
|
8716
8628
|
}
|
|
8717
|
-
|
|
8718
|
-
|
|
8719
|
-
// Label with no text
|
|
8720
8629
|
.k-checkbox-label.k-no-text {
|
|
8721
8630
|
min-width: 1px;
|
|
8722
8631
|
}
|
|
@@ -8741,7 +8650,7 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8741
8650
|
gap: map-get( $spacing, 1 );
|
|
8742
8651
|
|
|
8743
8652
|
.k-checkbox-label {
|
|
8744
|
-
|
|
8653
|
+
margin: 0;
|
|
8745
8654
|
}
|
|
8746
8655
|
}
|
|
8747
8656
|
.k-checkbox-list-horizontal,
|
|
@@ -8752,46 +8661,55 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8752
8661
|
}
|
|
8753
8662
|
|
|
8754
8663
|
|
|
8755
|
-
//
|
|
8756
|
-
|
|
8757
|
-
.k-checkbox
|
|
8758
|
-
|
|
8759
|
-
|
|
8760
|
-
|
|
8761
|
-
|
|
8762
|
-
|
|
8763
|
-
|
|
8764
|
-
|
|
8664
|
+
// Ripple
|
|
8665
|
+
.k-ripple-container {
|
|
8666
|
+
.k-checkbox::after {
|
|
8667
|
+
content: "";
|
|
8668
|
+
display: block;
|
|
8669
|
+
position: absolute;
|
|
8670
|
+
left: 50%;
|
|
8671
|
+
top: 50%;
|
|
8672
|
+
border-radius: 100%;
|
|
8673
|
+
z-index: -1;
|
|
8674
|
+
transition: opacity 100ms linear, transform 150ms cubic-bezier(.4, 0, .2, 1);
|
|
8675
|
+
transform: translate(-50%, -50%) scale(0);
|
|
8676
|
+
transform-origin: center center;
|
|
8765
8677
|
}
|
|
8766
|
-
|
|
8767
|
-
|
|
8678
|
+
|
|
8679
|
+
.k-checkbox:focus,
|
|
8680
|
+
.k-checkbox.k-focus {
|
|
8681
|
+
box-shadow: none !important; // sass-lint:disable-line no-important
|
|
8682
|
+
|
|
8683
|
+
&::after {
|
|
8684
|
+
transform: translate(-50%, -50%) scale(1);
|
|
8685
|
+
}
|
|
8768
8686
|
}
|
|
8769
|
-
|
|
8770
|
-
|
|
8771
|
-
|
|
8687
|
+
|
|
8688
|
+
.k-checkbox:disabled::after,
|
|
8689
|
+
.k-checkbox.k-disabled::after {
|
|
8690
|
+
display: none;
|
|
8772
8691
|
}
|
|
8773
8692
|
}
|
|
8774
8693
|
|
|
8775
|
-
.k-ripple-container {
|
|
8776
|
-
@each $name, $size in $kendo-checkbox-sizes {
|
|
8777
|
-
.k-checkbox-#{$name}::after {
|
|
8778
|
-
content: "";
|
|
8779
|
-
display: block;
|
|
8780
|
-
position: absolute;
|
|
8781
|
-
left: 0;
|
|
8782
|
-
top: 0;
|
|
8783
|
-
width: map-get( $kendo-checkbox-ripple-size, $name );
|
|
8784
|
-
height: map-get( $kendo-checkbox-ripple-size, $name );
|
|
8785
|
-
margin-left: map-get( $kendo-checkbox-ripple-margin, $name );
|
|
8786
|
-
margin-top: map-get( $kendo-checkbox-ripple-margin, $name );
|
|
8787
|
-
border-radius: 100%;
|
|
8788
|
-
z-index: 1;
|
|
8789
|
-
transform: scale(0);
|
|
8790
|
-
}
|
|
8791
8694
|
|
|
8792
|
-
|
|
8793
|
-
|
|
8794
|
-
|
|
8695
|
+
// Checkbox size
|
|
8696
|
+
@each $size, $size-props in $kendo-checkbox-sizes {
|
|
8697
|
+
$_size: map-get( $size-props, size );
|
|
8698
|
+
$_glyph-size: map-get( $size-props, glyph-size );
|
|
8699
|
+
$_ripple-size: map-get( $size-props, ripple-size );
|
|
8700
|
+
|
|
8701
|
+
.k-checkbox-#{$size} {
|
|
8702
|
+
width: $_size;
|
|
8703
|
+
height: $_size;
|
|
8704
|
+
|
|
8705
|
+
&::before {
|
|
8706
|
+
font-size: $_glyph-size;
|
|
8707
|
+
}
|
|
8708
|
+
}
|
|
8709
|
+
.k-ripple-container {
|
|
8710
|
+
.k-checkbox-#{size}::after {
|
|
8711
|
+
width: $_ripple-size;
|
|
8712
|
+
height: $_ripple-size;
|
|
8795
8713
|
}
|
|
8796
8714
|
}
|
|
8797
8715
|
}
|
|
@@ -8803,7 +8721,7 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8803
8721
|
// #endregion
|
|
8804
8722
|
// #region @import "_theme.scss"; -> packages/bootstrap/scss/checkbox/_theme.scss
|
|
8805
8723
|
// #region @import "~@progress/kendo-theme-default/scss/checkbox/_theme.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/checkbox/_theme.scss
|
|
8806
|
-
@include exports("checkbox/theme") {
|
|
8724
|
+
@include exports( "checkbox/theme" ) {
|
|
8807
8725
|
|
|
8808
8726
|
// Checkbox
|
|
8809
8727
|
.k-checkbox {
|
|
@@ -8883,20 +8801,22 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8883
8801
|
|
|
8884
8802
|
|
|
8885
8803
|
// Invalid
|
|
8886
|
-
.k-checkbox:invalid,
|
|
8887
8804
|
.k-checkbox.k-invalid {
|
|
8888
8805
|
@include fill( $border: $kendo-checkbox-invalid-border );
|
|
8889
8806
|
}
|
|
8890
|
-
.k-checkbox:invalid + .k-checkbox-label,
|
|
8891
8807
|
.k-checkbox.k-invalid + .k-checkbox-label {
|
|
8892
8808
|
@include fill( $color: $kendo-checkbox-invalid-text );
|
|
8893
8809
|
}
|
|
8894
8810
|
|
|
8895
8811
|
|
|
8896
8812
|
// Ripple
|
|
8813
|
+
.k-checkbox-wrap .k-ripple-blob {
|
|
8814
|
+
color: $kendo-checkbox-ripple-bg;
|
|
8815
|
+
opacity: $kendo-checkbox-ripple-opacity;
|
|
8816
|
+
}
|
|
8897
8817
|
.k-ripple-container {
|
|
8898
8818
|
.k-checkbox::after {
|
|
8899
|
-
background: $kendo-checkbox-
|
|
8819
|
+
background: $kendo-checkbox-ripple-bg;
|
|
8900
8820
|
opacity: $kendo-checkbox-ripple-opacity;
|
|
8901
8821
|
}
|
|
8902
8822
|
}
|
|
@@ -8956,6 +8876,10 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8956
8876
|
flex: none;
|
|
8957
8877
|
overflow: hidden;
|
|
8958
8878
|
text-overflow: ellipsis;
|
|
8879
|
+
cursor: pointer;
|
|
8880
|
+
}
|
|
8881
|
+
.k-list-optionlabel {
|
|
8882
|
+
@extend .k-list-group-sticky-header;
|
|
8959
8883
|
}
|
|
8960
8884
|
|
|
8961
8885
|
|
|
@@ -8999,10 +8923,6 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
8999
8923
|
transition-duration: 200ms;
|
|
9000
8924
|
transition-timing-function: ease;
|
|
9001
8925
|
|
|
9002
|
-
.k-checkbox-wrap {
|
|
9003
|
-
align-self: flex-start;
|
|
9004
|
-
}
|
|
9005
|
-
|
|
9006
8926
|
&.k-first::before {
|
|
9007
8927
|
content: "";
|
|
9008
8928
|
border-width: 1px 0 0;
|
|
@@ -9013,9 +8933,6 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
9013
8933
|
right: 0;
|
|
9014
8934
|
}
|
|
9015
8935
|
}
|
|
9016
|
-
.k-list-optionlabel {
|
|
9017
|
-
@extend .k-list-item;
|
|
9018
|
-
}
|
|
9019
8936
|
|
|
9020
8937
|
|
|
9021
8938
|
// List group item
|
|
@@ -9142,6 +9059,12 @@ $kendo-checkbox-ripple-opacity: .3 !default;
|
|
|
9142
9059
|
white-space: normal;
|
|
9143
9060
|
}
|
|
9144
9061
|
|
|
9062
|
+
|
|
9063
|
+
// Alias
|
|
9064
|
+
.k-nodata {
|
|
9065
|
+
@extend .k-no-data !optional;
|
|
9066
|
+
}
|
|
9067
|
+
|
|
9145
9068
|
}
|
|
9146
9069
|
|
|
9147
9070
|
// #endregion
|
|
@@ -10113,10 +10036,7 @@ $kendo-button-border-width: $btn-border-width !default;
|
|
|
10113
10036
|
|
|
10114
10037
|
/// Border radius of the button.
|
|
10115
10038
|
/// @group button
|
|
10116
|
-
$kendo-button-border-radius:
|
|
10117
|
-
$kendo-button-border-radius-sm: $btn-border-radius-sm !default;
|
|
10118
|
-
$kendo-button-border-radius-md: $btn-border-radius !default;
|
|
10119
|
-
$kendo-button-border-radius-lg: $btn-border-radius-lg !default;
|
|
10039
|
+
$kendo-button-border-radius: null !default;
|
|
10120
10040
|
|
|
10121
10041
|
/// Horizontal padding of the button.
|
|
10122
10042
|
/// @group button
|
|
@@ -10134,7 +10054,7 @@ $kendo-button-padding-y-lg: $btn-padding-y-lg !default;
|
|
|
10134
10054
|
|
|
10135
10055
|
/// Font family of the button.
|
|
10136
10056
|
/// @group button
|
|
10137
|
-
$kendo-button-font-family: $
|
|
10057
|
+
$kendo-button-font-family: $font-family !default;
|
|
10138
10058
|
|
|
10139
10059
|
/// Font sizes of the button.
|
|
10140
10060
|
/// @group button
|
|
@@ -10158,9 +10078,15 @@ $kendo-button-calc-size: calc( #{$kendo-button-line-height * 1em} + #{$kendo-but
|
|
|
10158
10078
|
/// @group button
|
|
10159
10079
|
$kendo-button-inner-calc-size: calc( #{$kendo-button-line-height * 1em} + #{$kendo-button-padding-y * 2} ) !default;
|
|
10160
10080
|
|
|
10081
|
+
$kendo-button-arrow-padding-x: $kendo-button-padding-y !default;
|
|
10082
|
+
$kendo-button-arrow-padding-y: $kendo-button-padding-y !default;
|
|
10083
|
+
|
|
10161
10084
|
/// Theme colors map for the button.
|
|
10162
10085
|
/// @group button
|
|
10163
|
-
$kendo-button-theme-colors: map-merge(
|
|
10086
|
+
$kendo-button-theme-colors: map-merge(
|
|
10087
|
+
$theme-colors,
|
|
10088
|
+
( "base": #e4e7eb )
|
|
10089
|
+
) !default;
|
|
10164
10090
|
|
|
10165
10091
|
/// The base background of the button.
|
|
10166
10092
|
/// @group button
|
|
@@ -10186,7 +10112,7 @@ $kendo-button-hover-bg: try-darken( $kendo-button-bg, 7.5% ) !default;
|
|
|
10186
10112
|
$kendo-button-hover-text: null !default;
|
|
10187
10113
|
/// The base border color of hovered button.
|
|
10188
10114
|
/// @group button
|
|
10189
|
-
$kendo-button-hover-border: try-darken( $kendo-button-
|
|
10115
|
+
$kendo-button-hover-border: try-darken( $kendo-button-bg, 10% ) !default;
|
|
10190
10116
|
/// The base background gradient of hovered button.
|
|
10191
10117
|
/// @group button
|
|
10192
10118
|
$kendo-button-hover-gradient: null !default;
|
|
@@ -10202,7 +10128,7 @@ $kendo-button-active-bg: try-darken( $kendo-button-bg, 10% ) !default;
|
|
|
10202
10128
|
$kendo-button-active-text: null !default;
|
|
10203
10129
|
/// The base border color of active button.
|
|
10204
10130
|
/// @group button
|
|
10205
|
-
$kendo-button-active-border: try-darken( $kendo-button-
|
|
10131
|
+
$kendo-button-active-border: try-darken( $kendo-button-bg, 12.5% ) !default;
|
|
10206
10132
|
/// The base background gradient of active button.
|
|
10207
10133
|
/// @group button
|
|
10208
10134
|
$kendo-button-active-gradient: null !default;
|
|
@@ -10212,14 +10138,14 @@ $kendo-button-active-shadow: null !default;
|
|
|
10212
10138
|
|
|
10213
10139
|
/// The base background color of selected button.
|
|
10214
10140
|
/// @group button
|
|
10215
|
-
$kendo-button-selected-bg:
|
|
10216
|
-
/// The
|
|
10141
|
+
$kendo-button-selected-bg: try-darken( $primary, 10% ) !default;
|
|
10142
|
+
/// The text color of selected buttons.
|
|
10217
10143
|
/// @group button
|
|
10218
|
-
$kendo-button-selected-text: $kendo-button-
|
|
10219
|
-
/// The
|
|
10144
|
+
$kendo-button-selected-text: contrast-wcag( $kendo-button-selected-bg ) !default;
|
|
10145
|
+
/// The border color of selected buttons.
|
|
10220
10146
|
/// @group button
|
|
10221
|
-
$kendo-button-selected-border:
|
|
10222
|
-
/// The
|
|
10147
|
+
$kendo-button-selected-border: try-darken( $primary, 12.5% ) !default;
|
|
10148
|
+
/// The background gradient of selected buttons.
|
|
10223
10149
|
/// @group button
|
|
10224
10150
|
$kendo-button-selected-gradient: $kendo-button-active-gradient !default;
|
|
10225
10151
|
/// The base shadow of selected button.
|
|
@@ -10240,7 +10166,7 @@ $kendo-button-focus-border: null !default;
|
|
|
10240
10166
|
$kendo-button-focus-gradient: null !default;
|
|
10241
10167
|
/// The base shadow of focused button.
|
|
10242
10168
|
/// @group button
|
|
10243
|
-
$kendo-button-focus-shadow: 0 0 0
|
|
10169
|
+
$kendo-button-focus-shadow: 0 0 0 .25rem rgba( $kendo-button-border, .5 ) !default;
|
|
10244
10170
|
|
|
10245
10171
|
/// The base background of disabled button.
|
|
10246
10172
|
/// @group button
|
|
@@ -10258,6 +10184,35 @@ $kendo-button-disabled-gradient: null !default;
|
|
|
10258
10184
|
/// @group button
|
|
10259
10185
|
$kendo-button-disabled-shadow: null !default;
|
|
10260
10186
|
|
|
10187
|
+
// Solid button
|
|
10188
|
+
$kendo-solid-button-gradient: null !default;
|
|
10189
|
+
$kendo-solid-button-shade-function: "try-darken";
|
|
10190
|
+
$kendo-solid-button-shade-text-amount: 0 !default;
|
|
10191
|
+
$kendo-solid-button-shade-bg-amount: 0 !default;
|
|
10192
|
+
$kendo-solid-button-shade-border-amount: 0 !default;
|
|
10193
|
+
$kendo-solid-button-hover-shade-text-amount: null !default;
|
|
10194
|
+
$kendo-solid-button-hover-shade-bg-amount: 7.5% !default;
|
|
10195
|
+
$kendo-solid-button-hover-shade-border-amount: 10% !default;
|
|
10196
|
+
$kendo-solid-button-active-shade-text-amount: null !default;
|
|
10197
|
+
$kendo-solid-button-active-shade-bg-amount: 10% !default;
|
|
10198
|
+
$kendo-solid-button-active-shade-border-amount: 12.5% !default;
|
|
10199
|
+
$kendo-solid-button-shadow: true !default;
|
|
10200
|
+
$kendo-solid-button-shadow-blur: 0px !default;
|
|
10201
|
+
$kendo-solid-button-shadow-spread: .25rem !default;
|
|
10202
|
+
$kendo-solid-button-shadow-opacity: .5 !default;
|
|
10203
|
+
|
|
10204
|
+
// Outline button
|
|
10205
|
+
$kendo-outline-button-shadow: true !default;
|
|
10206
|
+
$kendo-outline-button-shadow-blur: 0px !default;
|
|
10207
|
+
$kendo-outline-button-shadow-spread: .25rem !default;
|
|
10208
|
+
$kendo-outline-button-shadow-opacity: .5 !default;
|
|
10209
|
+
|
|
10210
|
+
// Link button
|
|
10211
|
+
$kendo-link-button-shadow: true !default;
|
|
10212
|
+
$kendo-link-button-shadow-blur: 0px !default;
|
|
10213
|
+
$kendo-link-button-shadow-spread: .25rem !default;
|
|
10214
|
+
$kendo-link-button-shadow-opacity: .5 !default;
|
|
10215
|
+
|
|
10261
10216
|
/// The overlay opacity of hovered flat button. Used to create background for the flat button.
|
|
10262
10217
|
/// @group button
|
|
10263
10218
|
$kendo-flat-button-hover-opacity: .08 !default;
|
|
@@ -10273,11 +10228,7 @@ $kendo-flat-button-selected-opacity: .2 !default;
|
|
|
10273
10228
|
|
|
10274
10229
|
/// The color transition of the button.
|
|
10275
10230
|
/// @group button
|
|
10276
|
-
$kendo-button-
|
|
10277
|
-
|
|
10278
|
-
/// The base shadow of focused button group.
|
|
10279
|
-
/// @group button
|
|
10280
|
-
$kendo-button-group-focus-shadow: null !default;
|
|
10231
|
+
$kendo-button-transition: $transition !default;
|
|
10281
10232
|
|
|
10282
10233
|
// #endregion
|
|
10283
10234
|
// #region @import "_layout.scss"; -> packages/bootstrap/scss/button/_layout.scss
|
|
@@ -10303,6 +10254,7 @@ $kendo-button-group-focus-shadow: null !default;
|
|
|
10303
10254
|
outline: none;
|
|
10304
10255
|
-webkit-appearance: none;
|
|
10305
10256
|
position: relative;
|
|
10257
|
+
transition: $kendo-button-transition;
|
|
10306
10258
|
|
|
10307
10259
|
&:disabled,
|
|
10308
10260
|
&.k-disabled {
|
|
@@ -10339,7 +10291,24 @@ $kendo-button-group-focus-shadow: null !default;
|
|
|
10339
10291
|
|
|
10340
10292
|
.k-button-text {}
|
|
10341
10293
|
|
|
10342
|
-
|
|
10294
|
+
|
|
10295
|
+
// Button arrow
|
|
10296
|
+
.k-button-arrow {
|
|
10297
|
+
padding-left: $kendo-button-arrow-padding-x;
|
|
10298
|
+
padding-right: $kendo-button-arrow-padding-x;
|
|
10299
|
+
flex: none;
|
|
10300
|
+
display: inline-flex;
|
|
10301
|
+
align-items: center;
|
|
10302
|
+
justify-content: center;
|
|
10303
|
+
}
|
|
10304
|
+
.k-button > .k-button-arrow {
|
|
10305
|
+
margin-inline-start: -$kendo-button-arrow-padding-x;
|
|
10306
|
+
margin-inline-end: -$kendo-button-padding-x;
|
|
10307
|
+
}
|
|
10308
|
+
.k-icon-button > .k-button-arrow {
|
|
10309
|
+
margin-inline-start: 0;
|
|
10310
|
+
margin-inline-end: -$kendo-button-padding-y;
|
|
10311
|
+
}
|
|
10343
10312
|
|
|
10344
10313
|
|
|
10345
10314
|
// Sizes
|
|
@@ -10385,15 +10354,13 @@ $kendo-button-group-focus-shadow: null !default;
|
|
|
10385
10354
|
}
|
|
10386
10355
|
|
|
10387
10356
|
|
|
10388
|
-
//
|
|
10389
|
-
.k-button-rectangle { }
|
|
10390
|
-
|
|
10357
|
+
// Button shape
|
|
10391
10358
|
.k-button-square {
|
|
10392
10359
|
aspect-ratio: 1;
|
|
10393
10360
|
}
|
|
10394
10361
|
|
|
10395
10362
|
|
|
10396
|
-
// Menu
|
|
10363
|
+
// Menu button
|
|
10397
10364
|
.k-menu-button,
|
|
10398
10365
|
.k-dropdown-button {
|
|
10399
10366
|
outline: 0;
|
|
@@ -10418,67 +10385,74 @@ $kendo-button-group-focus-shadow: null !default;
|
|
|
10418
10385
|
-webkit-touch-callout: none;
|
|
10419
10386
|
-webkit-tap-highlight-color: $rgba-transparent;
|
|
10420
10387
|
|
|
10421
|
-
.k-button
|
|
10422
|
-
@include border-radius( 0 );
|
|
10423
|
-
}
|
|
10424
|
-
|
|
10425
|
-
.k-button ~ .k-button {
|
|
10388
|
+
> .k-button + .k-button {
|
|
10426
10389
|
margin-inline-start: if( $kendo-button-border-width == 0, null, -$kendo-button-border-width );
|
|
10427
10390
|
}
|
|
10428
10391
|
|
|
10429
|
-
.k-button:hover,
|
|
10430
|
-
.k-button.k-hover,
|
|
10431
|
-
.k-button:
|
|
10432
|
-
.k-button.k-
|
|
10433
|
-
.k-button
|
|
10434
|
-
.k-button
|
|
10435
|
-
.k-button.k-
|
|
10392
|
+
> .k-button:hover,
|
|
10393
|
+
> .k-button.k-hover,
|
|
10394
|
+
> .k-button:focus,
|
|
10395
|
+
> .k-button.k-focus,
|
|
10396
|
+
> .k-button:active,
|
|
10397
|
+
> .k-button.k-active,
|
|
10398
|
+
> .k-button.k-selected {
|
|
10436
10399
|
z-index: 2;
|
|
10437
10400
|
}
|
|
10438
10401
|
|
|
10439
|
-
.k-
|
|
10440
|
-
|
|
10441
|
-
|
|
10402
|
+
.k-button:not(:first-child):not(:last-child) {
|
|
10403
|
+
border-start-end-radius: 0;
|
|
10404
|
+
border-end-end-radius: 0;
|
|
10405
|
+
border-start-start-radius: 0;
|
|
10406
|
+
border-end-start-radius: 0;
|
|
10407
|
+
}
|
|
10408
|
+
> .k-button:first-child:not(:only-child) {
|
|
10409
|
+
border-start-end-radius: 0;
|
|
10410
|
+
border-end-end-radius: 0;
|
|
10442
10411
|
}
|
|
10443
|
-
.k-
|
|
10444
|
-
|
|
10445
|
-
|
|
10412
|
+
> .k-button:last-child:not(:only-child) {
|
|
10413
|
+
border-start-start-radius: 0;
|
|
10414
|
+
border-end-start-radius: 0;
|
|
10415
|
+
}
|
|
10416
|
+
|
|
10417
|
+
&:disabled,
|
|
10418
|
+
&[disabled],
|
|
10419
|
+
&.k-disabled {
|
|
10420
|
+
opacity: 1;
|
|
10421
|
+
filter: none;
|
|
10446
10422
|
}
|
|
10447
10423
|
}
|
|
10448
10424
|
|
|
10449
10425
|
.k-button-group-stretched {
|
|
10450
|
-
|
|
10426
|
+
width: 100%;
|
|
10451
10427
|
|
|
10452
|
-
|
|
10453
|
-
display: inline-block;
|
|
10428
|
+
> * {
|
|
10454
10429
|
flex: 1 0 0%;
|
|
10455
10430
|
overflow: hidden;
|
|
10456
|
-
text-overflow: ellipsis;
|
|
10457
|
-
|
|
10458
|
-
> .k-icon {
|
|
10459
|
-
vertical-align: text-bottom;
|
|
10460
|
-
}
|
|
10461
10431
|
}
|
|
10462
10432
|
}
|
|
10463
10433
|
|
|
10464
10434
|
|
|
10465
10435
|
// Split button
|
|
10466
10436
|
.k-split-button {
|
|
10467
|
-
@include border-radius( 0 );
|
|
10468
10437
|
|
|
10469
|
-
|
|
10470
|
-
|
|
10471
|
-
|
|
10438
|
+
.k-split-button-arrow {
|
|
10439
|
+
padding: $kendo-button-arrow-padding-y $kendo-button-arrow-padding-x;
|
|
10440
|
+
width: auto;
|
|
10441
|
+
flex: none;
|
|
10472
10442
|
|
|
10473
|
-
|
|
10474
|
-
|
|
10443
|
+
.k-button-icon {
|
|
10444
|
+
min-width: 0;
|
|
10445
|
+
}
|
|
10475
10446
|
}
|
|
10476
10447
|
}
|
|
10477
10448
|
|
|
10478
10449
|
|
|
10479
|
-
// Flat
|
|
10450
|
+
// Flat button
|
|
10480
10451
|
.k-button-flat {
|
|
10481
|
-
|
|
10452
|
+
border-color: transparent !important; // sass-lint:disable-line no-important
|
|
10453
|
+
color: inherit;
|
|
10454
|
+
background: none !important; // sass-lint:disable-line no-important
|
|
10455
|
+
box-shadow: none !important; // sass-lint:disable-line no-important
|
|
10482
10456
|
|
|
10483
10457
|
// Overlay background
|
|
10484
10458
|
&::before {
|
|
@@ -10487,81 +10461,44 @@ $kendo-button-group-focus-shadow: null !default;
|
|
|
10487
10461
|
|
|
10488
10462
|
// Focus ring
|
|
10489
10463
|
&::after {
|
|
10464
|
+
box-shadow: inset 0 0 0 2px currentColor;
|
|
10490
10465
|
display: block !important; // sass-lint:disable-line no-important
|
|
10491
10466
|
}
|
|
10492
10467
|
|
|
10493
|
-
&:focus::after
|
|
10468
|
+
&:focus::after,
|
|
10494
10469
|
&.k-focus::after {
|
|
10495
10470
|
opacity: .12;
|
|
10496
10471
|
}
|
|
10497
10472
|
}
|
|
10498
10473
|
|
|
10499
10474
|
|
|
10500
|
-
//
|
|
10501
|
-
.k-button-
|
|
10502
|
-
|
|
10503
|
-
|
|
10504
|
-
|
|
10505
|
-
&:focus,
|
|
10506
|
-
&.k-focus {
|
|
10507
|
-
text-decoration: underline;
|
|
10508
|
-
}
|
|
10509
|
-
|
|
10510
|
-
// Focus ring
|
|
10511
|
-
&::after {
|
|
10512
|
-
display: block !important; // sass-lint:disable-line no-important
|
|
10513
|
-
}
|
|
10514
|
-
|
|
10515
|
-
&:focus::after ,
|
|
10516
|
-
&.k-focus::after {
|
|
10517
|
-
opacity: .12;
|
|
10518
|
-
}
|
|
10475
|
+
// Outline button
|
|
10476
|
+
.k-button-outline {
|
|
10477
|
+
border-color: currentColor;
|
|
10478
|
+
color: inherit;
|
|
10479
|
+
background: none;
|
|
10519
10480
|
}
|
|
10520
10481
|
|
|
10521
|
-
// RTL
|
|
10522
|
-
.k-rtl,
|
|
10523
|
-
[dir="rtl"] {
|
|
10524
|
-
|
|
10525
|
-
// Button group
|
|
10526
|
-
.k-button-group {
|
|
10527
|
-
|
|
10528
|
-
.k-button {
|
|
10529
|
-
@include border-radius( 0 );
|
|
10530
|
-
}
|
|
10531
10482
|
|
|
10532
|
-
|
|
10533
|
-
|
|
10534
|
-
|
|
10535
|
-
|
|
10536
|
-
|
|
10537
|
-
|
|
10538
|
-
.k-button:last-child {
|
|
10539
|
-
@include border-left-radius( $kendo-button-border-radius );
|
|
10540
|
-
}
|
|
10541
|
-
|
|
10542
|
-
.k-group-start.k-group-end,
|
|
10543
|
-
.k-button:first-child:last-child {
|
|
10544
|
-
@include border-radius( $kendo-button-border-radius );
|
|
10545
|
-
}
|
|
10483
|
+
// Link button
|
|
10484
|
+
.k-button-link {
|
|
10485
|
+
border-color: transparent;
|
|
10486
|
+
color: inherit;
|
|
10487
|
+
text-decoration: none;
|
|
10488
|
+
background: none;
|
|
10546
10489
|
|
|
10490
|
+
&:hover,
|
|
10491
|
+
&.k-hover {
|
|
10492
|
+
text-decoration: underline;
|
|
10547
10493
|
}
|
|
10494
|
+
}
|
|
10548
10495
|
|
|
10549
|
-
// Split button
|
|
10550
|
-
.k-split-button {
|
|
10551
|
-
|
|
10552
|
-
.k-button {
|
|
10553
|
-
@include border-radius( 0 );
|
|
10554
|
-
}
|
|
10555
|
-
|
|
10556
|
-
// k-button
|
|
10557
|
-
> .k-button:first-child {
|
|
10558
|
-
@include border-right-radius( $kendo-button-border-radius );
|
|
10559
|
-
}
|
|
10560
10496
|
|
|
10561
|
-
|
|
10562
|
-
|
|
10563
|
-
|
|
10564
|
-
|
|
10497
|
+
// IE
|
|
10498
|
+
.k-ie .k-button-group,
|
|
10499
|
+
.k-ie .k-split-button {
|
|
10500
|
+
.k-button {
|
|
10501
|
+
@include border-radius( 0 );
|
|
10565
10502
|
}
|
|
10566
10503
|
}
|
|
10567
10504
|
|
|
@@ -10663,365 +10600,254 @@ $kendo-button-group-focus-shadow: null !default;
|
|
|
10663
10600
|
|
|
10664
10601
|
// #endregion
|
|
10665
10602
|
|
|
10666
|
-
@include exports("button/layout/bootstrap") {
|
|
10667
|
-
|
|
10668
|
-
// Default button
|
|
10669
|
-
.k-button {
|
|
10670
|
-
transition: $kendo-button-color-transition;
|
|
10671
|
-
}
|
|
10672
|
-
}
|
|
10673
|
-
|
|
10674
10603
|
// #endregion
|
|
10675
10604
|
// #region @import "_theme.scss"; -> packages/bootstrap/scss/button/_theme.scss
|
|
10676
10605
|
// #region @import "~@progress/kendo-theme-default/scss/button/_theme.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/button/_theme.scss
|
|
10677
10606
|
@include exports( "button/theme" ) {
|
|
10678
10607
|
|
|
10679
|
-
// Solid
|
|
10680
|
-
|
|
10681
|
-
|
|
10682
|
-
|
|
10683
|
-
|
|
10684
|
-
|
|
10685
|
-
|
|
10686
|
-
|
|
10687
|
-
|
|
10688
|
-
);
|
|
10689
|
-
@include box-shadow( $kendo-button-shadow );
|
|
10608
|
+
// Solid button
|
|
10609
|
+
.k-button-solid-base {
|
|
10610
|
+
@include fill(
|
|
10611
|
+
$kendo-button-text,
|
|
10612
|
+
$kendo-button-bg,
|
|
10613
|
+
$kendo-button-border,
|
|
10614
|
+
$kendo-button-gradient
|
|
10615
|
+
);
|
|
10616
|
+
@include box-shadow( $kendo-button-shadow );
|
|
10690
10617
|
|
|
10691
|
-
|
|
10692
|
-
|
|
10693
|
-
|
|
10694
|
-
|
|
10695
|
-
|
|
10696
|
-
|
|
10697
|
-
|
|
10698
|
-
|
|
10699
|
-
|
|
10700
|
-
|
|
10701
|
-
|
|
10618
|
+
// Hover state
|
|
10619
|
+
&:hover,
|
|
10620
|
+
&.k-hover {
|
|
10621
|
+
@include fill(
|
|
10622
|
+
$kendo-button-hover-text,
|
|
10623
|
+
$kendo-button-hover-bg,
|
|
10624
|
+
$kendo-button-hover-border,
|
|
10625
|
+
$kendo-button-hover-gradient
|
|
10626
|
+
);
|
|
10627
|
+
@include box-shadow( $kendo-button-hover-shadow );
|
|
10628
|
+
}
|
|
10702
10629
|
|
|
10703
|
-
|
|
10704
|
-
|
|
10705
|
-
|
|
10706
|
-
|
|
10707
|
-
|
|
10630
|
+
// Focus state
|
|
10631
|
+
&:focus,
|
|
10632
|
+
&.k-focus {
|
|
10633
|
+
@include box-shadow( $kendo-button-focus-shadow );
|
|
10634
|
+
}
|
|
10708
10635
|
|
|
10709
|
-
|
|
10710
|
-
|
|
10711
|
-
|
|
10712
|
-
|
|
10713
|
-
|
|
10714
|
-
|
|
10715
|
-
|
|
10716
|
-
|
|
10717
|
-
|
|
10718
|
-
|
|
10719
|
-
|
|
10636
|
+
// Active state
|
|
10637
|
+
&:active,
|
|
10638
|
+
&.k-active {
|
|
10639
|
+
@include fill(
|
|
10640
|
+
$kendo-button-active-text,
|
|
10641
|
+
$kendo-button-active-bg,
|
|
10642
|
+
$kendo-button-active-border,
|
|
10643
|
+
$kendo-button-active-gradient
|
|
10644
|
+
);
|
|
10645
|
+
@include box-shadow( $kendo-button-active-shadow );
|
|
10646
|
+
}
|
|
10720
10647
|
|
|
10721
|
-
|
|
10722
|
-
|
|
10723
|
-
|
|
10724
|
-
|
|
10725
|
-
|
|
10726
|
-
|
|
10727
|
-
|
|
10728
|
-
|
|
10729
|
-
|
|
10730
|
-
|
|
10731
|
-
} @else {
|
|
10732
|
-
color: contrast-wcag( $color );
|
|
10733
|
-
background-color: $color;
|
|
10734
|
-
border-color: $color;
|
|
10735
|
-
background-image: linear-gradient( rgba( black, 0 ), rgba( black, .04 ) );
|
|
10648
|
+
// Selected state
|
|
10649
|
+
&.k-selected {
|
|
10650
|
+
@include fill(
|
|
10651
|
+
$kendo-button-selected-text,
|
|
10652
|
+
$kendo-button-selected-bg,
|
|
10653
|
+
$kendo-button-selected-border,
|
|
10654
|
+
$kendo-button-selected-gradient
|
|
10655
|
+
);
|
|
10656
|
+
@include box-shadow( $kendo-button-selected-shadow );
|
|
10657
|
+
}
|
|
10736
10658
|
|
|
10737
|
-
|
|
10738
|
-
|
|
10739
|
-
|
|
10740
|
-
|
|
10741
|
-
|
|
10742
|
-
|
|
10659
|
+
// Disabled state
|
|
10660
|
+
&:disabled,
|
|
10661
|
+
&.k-disabled {
|
|
10662
|
+
@include fill(
|
|
10663
|
+
$kendo-button-disabled-text,
|
|
10664
|
+
$kendo-button-disabled-bg,
|
|
10665
|
+
$kendo-button-disabled-border,
|
|
10666
|
+
$kendo-button-disabled-gradient
|
|
10667
|
+
);
|
|
10668
|
+
@include box-shadow( $kendo-button-disabled-shadow );
|
|
10669
|
+
}
|
|
10670
|
+
}
|
|
10743
10671
|
|
|
10744
|
-
|
|
10745
|
-
&:focus,
|
|
10746
|
-
&.k-focus {
|
|
10747
|
-
box-shadow: 0 0 0 2px rgba( $color, .3 );
|
|
10748
|
-
}
|
|
10672
|
+
$_shade-fn: get-function( $kendo-solid-button-shade-function );
|
|
10749
10673
|
|
|
10750
|
-
|
|
10751
|
-
|
|
10752
|
-
|
|
10753
|
-
|
|
10754
|
-
|
|
10755
|
-
}
|
|
10674
|
+
@each $name, $color in $kendo-button-theme-colors {
|
|
10675
|
+
@if ($name != "base") {
|
|
10676
|
+
$_button-text: contrast-wcag( $color );
|
|
10677
|
+
$_button-bg: if( $kendo-solid-button-shade-bg-amount, call( $_shade-fn, $color, $kendo-solid-button-shade-bg-amount ), null );
|
|
10678
|
+
$_button-border: if( $kendo-solid-button-shade-border-amount, call( $_shade-fn, $color, $kendo-solid-button-shade-border-amount ), null );
|
|
10756
10679
|
|
|
10757
|
-
|
|
10758
|
-
|
|
10759
|
-
|
|
10760
|
-
border-color: try-shade( $color, 1.5 );
|
|
10761
|
-
}
|
|
10762
|
-
}
|
|
10680
|
+
$_button-hover-text: null;
|
|
10681
|
+
$_button-hover-bg: if( $kendo-solid-button-hover-shade-bg-amount, call( $_shade-fn, $color, $kendo-solid-button-hover-shade-bg-amount ), null );
|
|
10682
|
+
$_button-hover-border: if( $kendo-solid-button-hover-shade-border-amount, call( $_shade-fn, $color, $kendo-solid-button-hover-shade-border-amount ), null );
|
|
10763
10683
|
|
|
10764
|
-
|
|
10765
|
-
|
|
10766
|
-
|
|
10684
|
+
$_button-active-text: null;
|
|
10685
|
+
$_button-active-bg: if( $kendo-solid-button-active-shade-bg-amount, call( $_shade-fn, $color, $kendo-solid-button-active-shade-bg-amount ), null );
|
|
10686
|
+
$_button-active-border: if( $kendo-solid-button-active-shade-border-amount, call( $_shade-fn, $color, $kendo-solid-button-active-shade-border-amount ), null );
|
|
10687
|
+
|
|
10688
|
+
.k-button-solid-#{$name} {
|
|
10767
10689
|
@include fill(
|
|
10768
|
-
$
|
|
10769
|
-
$
|
|
10770
|
-
$
|
|
10771
|
-
$kendo-button-
|
|
10690
|
+
$_button-text,
|
|
10691
|
+
$_button-bg,
|
|
10692
|
+
$_button-border,
|
|
10693
|
+
$kendo-solid-button-gradient
|
|
10772
10694
|
);
|
|
10773
|
-
@include box-shadow( $kendo-button-disabled-shadow );
|
|
10774
|
-
}
|
|
10775
|
-
}
|
|
10776
|
-
}
|
|
10777
|
-
|
|
10778
|
-
|
|
10779
|
-
// Outline Buttons
|
|
10780
|
-
.k-button-outline {
|
|
10781
|
-
@include box-shadow( none );
|
|
10782
|
-
border-color: currentColor;
|
|
10783
|
-
background: none;
|
|
10784
|
-
}
|
|
10785
|
-
|
|
10786
|
-
@each $name, $color in $kendo-button-theme-colors {
|
|
10787
|
-
.k-button-outline-#{$name} {
|
|
10788
|
-
@if ($name == "base") {
|
|
10789
|
-
color: $kendo-button-text;
|
|
10790
10695
|
|
|
10791
10696
|
// Hover state
|
|
10792
10697
|
&:hover,
|
|
10793
10698
|
&.k-hover {
|
|
10794
10699
|
@include fill(
|
|
10795
|
-
|
|
10796
|
-
$
|
|
10797
|
-
$
|
|
10700
|
+
$_button-hover-text,
|
|
10701
|
+
$_button-hover-bg,
|
|
10702
|
+
$_button-hover-border
|
|
10798
10703
|
);
|
|
10799
10704
|
}
|
|
10800
10705
|
|
|
10801
10706
|
// Focus state
|
|
10802
10707
|
&:focus,
|
|
10803
10708
|
&.k-focus {
|
|
10804
|
-
@
|
|
10709
|
+
@if ( $kendo-solid-button-shadow ) {
|
|
10710
|
+
box-shadow: 0 0 $kendo-solid-button-shadow-blur $kendo-solid-button-shadow-spread rgba( $_button-border, $kendo-solid-button-shadow-opacity );
|
|
10711
|
+
}
|
|
10805
10712
|
}
|
|
10806
10713
|
|
|
10807
10714
|
// Active state
|
|
10808
10715
|
&:active,
|
|
10809
10716
|
&.k-active {
|
|
10810
10717
|
@include fill(
|
|
10811
|
-
|
|
10812
|
-
$
|
|
10813
|
-
$
|
|
10718
|
+
$_button-active-text,
|
|
10719
|
+
$_button-active-bg,
|
|
10720
|
+
$_button-active-border
|
|
10814
10721
|
);
|
|
10815
10722
|
}
|
|
10816
10723
|
|
|
10817
|
-
// Selected
|
|
10724
|
+
// Selected
|
|
10818
10725
|
&.k-selected {
|
|
10819
10726
|
@include fill(
|
|
10820
|
-
|
|
10821
|
-
$
|
|
10822
|
-
$
|
|
10727
|
+
$_button-active-text,
|
|
10728
|
+
$_button-active-bg,
|
|
10729
|
+
$_button-active-border
|
|
10823
10730
|
);
|
|
10824
10731
|
}
|
|
10825
|
-
} @else {
|
|
10826
|
-
color: $color;
|
|
10827
10732
|
|
|
10828
|
-
//
|
|
10829
|
-
&:
|
|
10830
|
-
&.k-
|
|
10733
|
+
// Disabled state
|
|
10734
|
+
&:disabled,
|
|
10735
|
+
&.k-disabled {
|
|
10831
10736
|
@include fill(
|
|
10832
|
-
|
|
10833
|
-
$
|
|
10834
|
-
$
|
|
10737
|
+
$kendo-button-disabled-text,
|
|
10738
|
+
$kendo-button-disabled-bg,
|
|
10739
|
+
$kendo-button-disabled-border,
|
|
10740
|
+
$kendo-button-disabled-gradient
|
|
10835
10741
|
);
|
|
10742
|
+
@include box-shadow( $kendo-button-disabled-shadow );
|
|
10836
10743
|
}
|
|
10744
|
+
}
|
|
10745
|
+
}
|
|
10746
|
+
}
|
|
10837
10747
|
|
|
10838
|
-
// Focus state
|
|
10839
|
-
&:focus,
|
|
10840
|
-
&.k-focus {
|
|
10841
|
-
box-shadow: 0 0 0 2px rgba( $color, .3 );
|
|
10842
|
-
}
|
|
10843
10748
|
|
|
10844
|
-
|
|
10845
|
-
|
|
10846
|
-
|
|
10847
|
-
|
|
10848
|
-
|
|
10849
|
-
|
|
10850
|
-
|
|
10851
|
-
);
|
|
10852
|
-
}
|
|
10749
|
+
// Outline button
|
|
10750
|
+
@each $name, $color in map-merge( $kendo-button-theme-colors, ( "base": $base-text ) ) {
|
|
10751
|
+
.k-button-outline-#{$name} {
|
|
10752
|
+
@include box-shadow( none );
|
|
10753
|
+
border-color: currentColor;
|
|
10754
|
+
color: $color;
|
|
10755
|
+
background-color: transparent;
|
|
10853
10756
|
|
|
10854
|
-
|
|
10855
|
-
|
|
10856
|
-
|
|
10857
|
-
|
|
10858
|
-
|
|
10859
|
-
|
|
10860
|
-
|
|
10757
|
+
// Hover state
|
|
10758
|
+
&:hover,
|
|
10759
|
+
&.k-hover {
|
|
10760
|
+
@include fill(
|
|
10761
|
+
contrast-wcag( $color ),
|
|
10762
|
+
$color,
|
|
10763
|
+
$color
|
|
10764
|
+
);
|
|
10765
|
+
}
|
|
10766
|
+
|
|
10767
|
+
// Focus state
|
|
10768
|
+
&:focus,
|
|
10769
|
+
&.k-focus {
|
|
10770
|
+
@if $kendo-outline-button-shadow {
|
|
10771
|
+
box-shadow: 0 0 $kendo-outline-button-shadow-blur $kendo-outline-button-shadow-spread rgba( $color, $kendo-outline-button-shadow-opacity );
|
|
10861
10772
|
}
|
|
10862
10773
|
}
|
|
10863
10774
|
|
|
10864
|
-
//
|
|
10865
|
-
&:
|
|
10866
|
-
&.k-
|
|
10775
|
+
// Active state
|
|
10776
|
+
&:active,
|
|
10777
|
+
&.k-active {
|
|
10867
10778
|
@include fill(
|
|
10868
|
-
$
|
|
10869
|
-
$
|
|
10870
|
-
$
|
|
10871
|
-
$kendo-button-disabled-gradient
|
|
10779
|
+
contrast-wcag( $color ),
|
|
10780
|
+
$color,
|
|
10781
|
+
$color
|
|
10872
10782
|
);
|
|
10873
|
-
@include box-shadow( $kendo-button-disabled-shadow );
|
|
10874
10783
|
}
|
|
10875
|
-
}
|
|
10876
|
-
}
|
|
10877
10784
|
|
|
10878
|
-
|
|
10879
|
-
|
|
10880
|
-
|
|
10881
|
-
|
|
10882
|
-
|
|
10883
|
-
|
|
10884
|
-
|
|
10885
|
-
// Focus ring
|
|
10886
|
-
&::after {
|
|
10887
|
-
box-shadow: inset 0 0 0 2px currentColor;
|
|
10888
|
-
}
|
|
10889
|
-
}
|
|
10890
|
-
@each $name, $color in $kendo-button-theme-colors {
|
|
10891
|
-
.k-button-flat-#{$name} {
|
|
10892
|
-
@if ($name == "base") {
|
|
10893
|
-
color: inherit;
|
|
10894
|
-
} @else {
|
|
10895
|
-
color: $color;
|
|
10785
|
+
// Selected
|
|
10786
|
+
&.k-selected {
|
|
10787
|
+
@include fill(
|
|
10788
|
+
contrast-wcag( $color ),
|
|
10789
|
+
$color,
|
|
10790
|
+
$color
|
|
10791
|
+
);
|
|
10896
10792
|
}
|
|
10897
10793
|
|
|
10898
10794
|
// Disabled state
|
|
10899
10795
|
&:disabled,
|
|
10900
10796
|
&.k-disabled {
|
|
10901
|
-
|
|
10902
|
-
$kendo-button-disabled-text,
|
|
10903
|
-
$kendo-button-disabled-bg,
|
|
10904
|
-
$kendo-button-disabled-border,
|
|
10905
|
-
$kendo-button-disabled-gradient
|
|
10906
|
-
);
|
|
10907
|
-
@include box-shadow( $kendo-button-disabled-shadow );
|
|
10797
|
+
color: $kendo-button-disabled-text;
|
|
10908
10798
|
}
|
|
10909
10799
|
}
|
|
10910
10800
|
}
|
|
10911
10801
|
|
|
10912
10802
|
|
|
10913
|
-
//
|
|
10914
|
-
|
|
10915
|
-
|
|
10916
|
-
|
|
10917
|
-
background: none;
|
|
10918
|
-
|
|
10919
|
-
// Focus ring
|
|
10920
|
-
&::after {
|
|
10921
|
-
box-shadow: inset 0 0 0 2px currentColor;
|
|
10922
|
-
}
|
|
10923
|
-
}
|
|
10924
|
-
@each $name, $color in $kendo-button-theme-colors {
|
|
10925
|
-
.k-button-link-#{$name} {
|
|
10926
|
-
@if ($name == "base") {
|
|
10927
|
-
color: inherit;
|
|
10928
|
-
} @else {
|
|
10929
|
-
color: $color;
|
|
10930
|
-
}
|
|
10803
|
+
// Flat button
|
|
10804
|
+
@each $name, $color in map-merge( $kendo-button-theme-colors, ( "base": inherit ) ) {
|
|
10805
|
+
.k-button-flat-#{$name} {
|
|
10806
|
+
color: $color;
|
|
10931
10807
|
|
|
10932
10808
|
// Disabled state
|
|
10933
10809
|
&:disabled,
|
|
10934
10810
|
&.k-disabled {
|
|
10935
|
-
|
|
10936
|
-
$kendo-button-disabled-text,
|
|
10937
|
-
$kendo-button-disabled-bg,
|
|
10938
|
-
$kendo-button-disabled-border,
|
|
10939
|
-
$kendo-button-disabled-gradient
|
|
10940
|
-
);
|
|
10941
|
-
@include box-shadow( $kendo-button-disabled-shadow );
|
|
10811
|
+
color: $kendo-button-disabled-text;
|
|
10942
10812
|
}
|
|
10943
10813
|
}
|
|
10944
10814
|
}
|
|
10945
10815
|
|
|
10946
10816
|
|
|
10947
|
-
//
|
|
10948
|
-
|
|
10949
|
-
|
|
10950
|
-
|
|
10951
|
-
// Button group
|
|
10952
|
-
.k-button-group {
|
|
10953
|
-
|
|
10954
|
-
.k-button:focus,
|
|
10955
|
-
.k-button.k-focus,
|
|
10956
|
-
.k-button-outline:focus,
|
|
10957
|
-
.k-button-outline.k-focus {
|
|
10958
|
-
@include box-shadow( $kendo-button-group-focus-shadow );
|
|
10959
|
-
}
|
|
10960
|
-
|
|
10961
|
-
}
|
|
10962
|
-
|
|
10963
|
-
|
|
10964
|
-
// Split button
|
|
10965
|
-
.k-split-button:focus,
|
|
10966
|
-
.k-split-button.k-focus {
|
|
10967
|
-
@include box-shadow( $kendo-button-focus-shadow );
|
|
10968
|
-
}
|
|
10969
|
-
|
|
10970
|
-
}
|
|
10971
|
-
|
|
10972
|
-
// #endregion
|
|
10973
|
-
|
|
10974
|
-
@include exports( "button/theme/bootstrap" ) {
|
|
10975
|
-
|
|
10976
|
-
// Solid Buttons
|
|
10977
|
-
@each $name, $color in $kendo-button-theme-colors {
|
|
10978
|
-
.k-button-solid-#{$name} {
|
|
10979
|
-
@if ($name != "base") {
|
|
10980
|
-
background-image: none;
|
|
10981
|
-
|
|
10982
|
-
// Hover state
|
|
10983
|
-
&:hover,
|
|
10984
|
-
&.k-hover {
|
|
10985
|
-
color: contrast-wcag( try-darken( $color, 7.5% ) );
|
|
10986
|
-
background-color: try-darken( $color, 7.5% );
|
|
10987
|
-
border-color: try-darken( $color, 10% );
|
|
10988
|
-
}
|
|
10989
|
-
|
|
10990
|
-
// Focus state
|
|
10991
|
-
&:focus,
|
|
10992
|
-
&.k-focus {
|
|
10993
|
-
box-shadow: 0 0 0 3px rgba( $color, .5 );
|
|
10994
|
-
}
|
|
10817
|
+
// Link button
|
|
10818
|
+
@each $name, $color in map-merge( $kendo-button-theme-colors, ( "base": $base-text ) ) {
|
|
10819
|
+
.k-button-link-#{$name} {
|
|
10820
|
+
color: $color;
|
|
10995
10821
|
|
|
10996
|
-
|
|
10997
|
-
|
|
10998
|
-
|
|
10999
|
-
|
|
11000
|
-
|
|
11001
|
-
border-color: try-darken( $color, 12.5% );
|
|
11002
|
-
}
|
|
10822
|
+
// Hover
|
|
10823
|
+
&:hover,
|
|
10824
|
+
&.k-hover {
|
|
10825
|
+
color: try-shade( $color, 2 );
|
|
10826
|
+
}
|
|
11003
10827
|
|
|
11004
|
-
|
|
11005
|
-
|
|
11006
|
-
|
|
11007
|
-
|
|
11008
|
-
|
|
10828
|
+
// Focus
|
|
10829
|
+
&:focus,
|
|
10830
|
+
&.k-focus {
|
|
10831
|
+
@if ( $kendo-link-button-shadow ) {
|
|
10832
|
+
box-shadow: 0 0 $kendo-link-button-shadow-blur $kendo-link-button-shadow-spread rgba( $color, $kendo-link-button-shadow-opacity );
|
|
11009
10833
|
}
|
|
11010
10834
|
}
|
|
11011
|
-
}
|
|
11012
|
-
}
|
|
11013
10835
|
|
|
10836
|
+
// Active
|
|
10837
|
+
&:active,
|
|
10838
|
+
&.k-active {
|
|
10839
|
+
color: try-shade( $color, 2 );
|
|
10840
|
+
}
|
|
11014
10841
|
|
|
11015
|
-
|
|
11016
|
-
|
|
11017
|
-
|
|
11018
|
-
|
|
10842
|
+
// Selected
|
|
10843
|
+
&.k-selected {
|
|
10844
|
+
color: try-shade( $color, 2 );
|
|
10845
|
+
}
|
|
11019
10846
|
|
|
11020
|
-
|
|
11021
|
-
|
|
11022
|
-
|
|
11023
|
-
|
|
11024
|
-
}
|
|
10847
|
+
// Disabled state
|
|
10848
|
+
&:disabled,
|
|
10849
|
+
&.k-disabled {
|
|
10850
|
+
color: $kendo-button-disabled-text;
|
|
11025
10851
|
}
|
|
11026
10852
|
}
|
|
11027
10853
|
}
|
|
@@ -11032,16 +10858,7 @@ $kendo-button-group-focus-shadow: null !default;
|
|
|
11032
10858
|
|
|
11033
10859
|
|
|
11034
10860
|
// Button group
|
|
11035
|
-
.k-button-group {
|
|
11036
|
-
|
|
11037
|
-
.k-button:focus,
|
|
11038
|
-
.k-button.k-focus,
|
|
11039
|
-
.k-button-outline:focus,
|
|
11040
|
-
.k-button-outline.k-focus {
|
|
11041
|
-
@include box-shadow( $kendo-button-group-focus-shadow );
|
|
11042
|
-
}
|
|
11043
|
-
|
|
11044
|
-
}
|
|
10861
|
+
.k-button-group {}
|
|
11045
10862
|
|
|
11046
10863
|
|
|
11047
10864
|
// Split button
|
|
@@ -11056,6 +10873,8 @@ $kendo-button-group-focus-shadow: null !default;
|
|
|
11056
10873
|
|
|
11057
10874
|
// #endregion
|
|
11058
10875
|
|
|
10876
|
+
// #endregion
|
|
10877
|
+
|
|
11059
10878
|
|
|
11060
10879
|
// Component
|
|
11061
10880
|
// #region @import "_variables.scss"; -> packages/bootstrap/scss/input/_variables.scss
|
|
@@ -11176,10 +10995,12 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
|
|
|
11176
10995
|
font-family: $kendo-input-font-family;
|
|
11177
10996
|
font-size: $kendo-input-font-size;
|
|
11178
10997
|
line-height: $kendo-input-line-height;
|
|
10998
|
+
text-align: start;
|
|
11179
10999
|
box-shadow: none;
|
|
11180
11000
|
display: inline-flex;
|
|
11181
11001
|
flex-flow: row nowrap;
|
|
11182
11002
|
align-items: stretch;
|
|
11003
|
+
vertical-align: middle;
|
|
11183
11004
|
position: relative;
|
|
11184
11005
|
overflow: hidden;
|
|
11185
11006
|
text-overflow: ellipsis;
|
|
@@ -11194,10 +11015,25 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
|
|
|
11194
11015
|
outline: 0;
|
|
11195
11016
|
box-shadow: none;
|
|
11196
11017
|
}
|
|
11018
|
+
|
|
11019
|
+
// fix for Safari
|
|
11020
|
+
& > * {
|
|
11021
|
+
margin: 0;
|
|
11022
|
+
}
|
|
11197
11023
|
}
|
|
11024
|
+
|
|
11025
|
+
|
|
11026
|
+
// Input
|
|
11027
|
+
.k-input {}
|
|
11198
11028
|
input.k-input {
|
|
11199
11029
|
padding: $kendo-input-padding-y $kendo-input-padding-x;
|
|
11200
11030
|
}
|
|
11031
|
+
|
|
11032
|
+
|
|
11033
|
+
// Picker
|
|
11034
|
+
.k-picker {
|
|
11035
|
+
cursor: pointer;
|
|
11036
|
+
}
|
|
11201
11037
|
select.k-picker {
|
|
11202
11038
|
padding: $kendo-input-padding-y $kendo-input-padding-x;
|
|
11203
11039
|
appearance: auto;
|
|
@@ -11239,6 +11075,7 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
|
|
|
11239
11075
|
}
|
|
11240
11076
|
}
|
|
11241
11077
|
span.k-input-inner {
|
|
11078
|
+
white-space: nowrap;
|
|
11242
11079
|
display: flex;
|
|
11243
11080
|
flex-flow: row nowrap;
|
|
11244
11081
|
align-items: center;
|
|
@@ -11365,7 +11202,7 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
|
|
|
11365
11202
|
|
|
11366
11203
|
> .k-button-icon {
|
|
11367
11204
|
min-width: auto !important; // sass-lint:disable-line no-important
|
|
11368
|
-
min-height: auto !important; // sass-lint:disable-line no-important
|
|
11205
|
+
// min-height: auto !important; // sass-lint:disable-line no-important
|
|
11369
11206
|
}
|
|
11370
11207
|
|
|
11371
11208
|
&:focus {
|
|
@@ -11569,11 +11406,19 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
|
|
|
11569
11406
|
);
|
|
11570
11407
|
@include box-shadow( $kendo-input-focus-shadow );
|
|
11571
11408
|
}
|
|
11409
|
+
&:focus-within {
|
|
11410
|
+
@include fill (
|
|
11411
|
+
$kendo-input-focus-text,
|
|
11412
|
+
$kendo-input-focus-bg,
|
|
11413
|
+
$kendo-input-focus-border
|
|
11414
|
+
);
|
|
11415
|
+
@include box-shadow( $kendo-input-focus-shadow );
|
|
11416
|
+
}
|
|
11572
11417
|
|
|
11573
11418
|
// Invalid
|
|
11574
|
-
&:invalid,
|
|
11575
11419
|
&.k-invalid,
|
|
11576
|
-
&.ng-invalid
|
|
11420
|
+
&.ng-invalid.ng-touched,
|
|
11421
|
+
&.ng-invalid.ng-dirty {
|
|
11577
11422
|
@include fill( $border: $invalid-border );
|
|
11578
11423
|
|
|
11579
11424
|
.k-input-validation-icon {
|
|
@@ -11584,10 +11429,15 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
|
|
|
11584
11429
|
&.k-focus {
|
|
11585
11430
|
@include box-shadow($invalid-shadow);
|
|
11586
11431
|
}
|
|
11432
|
+
&:focus-within {
|
|
11433
|
+
@include box-shadow($invalid-shadow);
|
|
11434
|
+
}
|
|
11587
11435
|
}
|
|
11588
11436
|
|
|
11589
11437
|
}
|
|
11590
11438
|
|
|
11439
|
+
|
|
11440
|
+
// Solid picker
|
|
11591
11441
|
.k-picker {
|
|
11592
11442
|
@include fill(
|
|
11593
11443
|
$kendo-button-text,
|
|
@@ -11618,11 +11468,20 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
|
|
|
11618
11468
|
);
|
|
11619
11469
|
@include box-shadow( $kendo-button-focus-shadow );
|
|
11620
11470
|
}
|
|
11471
|
+
&:focus-within {
|
|
11472
|
+
@include fill (
|
|
11473
|
+
$kendo-button-focus-text,
|
|
11474
|
+
$kendo-button-focus-bg,
|
|
11475
|
+
$kendo-button-focus-border,
|
|
11476
|
+
$kendo-button-focus-gradient
|
|
11477
|
+
);
|
|
11478
|
+
@include box-shadow( $kendo-button-focus-shadow );
|
|
11479
|
+
}
|
|
11621
11480
|
|
|
11622
11481
|
// Invalid
|
|
11623
|
-
&:invalid,
|
|
11624
11482
|
&.k-invalid,
|
|
11625
|
-
&.ng-invalid
|
|
11483
|
+
&.ng-invalid.ng-touched,
|
|
11484
|
+
&.ng-invalid.ng-dirty {
|
|
11626
11485
|
@include fill( $border: $kendo-input-invalid-border );
|
|
11627
11486
|
|
|
11628
11487
|
.k-input-validation-icon {
|
|
@@ -11633,8 +11492,12 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
|
|
|
11633
11492
|
&.k-focus {
|
|
11634
11493
|
@include box-shadow( $kendo-input-invalid-shadow );
|
|
11635
11494
|
}
|
|
11495
|
+
&:focus-within {
|
|
11496
|
+
@include box-shadow( $kendo-input-invalid-shadow );
|
|
11497
|
+
}
|
|
11636
11498
|
}
|
|
11637
11499
|
}
|
|
11500
|
+
|
|
11638
11501
|
}
|
|
11639
11502
|
|
|
11640
11503
|
// #endregion
|
|
@@ -11943,127 +11806,125 @@ $menu-scroll-button-hover-gradient: null !default;
|
|
|
11943
11806
|
// Menu popup
|
|
11944
11807
|
|
|
11945
11808
|
/// Horizontal padding of the menu popup.
|
|
11946
|
-
/// @group menu
|
|
11809
|
+
/// @group menu
|
|
11947
11810
|
$kendo-menu-popup-padding-x: null !default;
|
|
11948
11811
|
|
|
11949
11812
|
/// Vertical padding of the menu popup.
|
|
11950
|
-
/// @group menu
|
|
11813
|
+
/// @group menu
|
|
11951
11814
|
$kendo-menu-popup-padding-y: null !default;
|
|
11952
11815
|
|
|
11953
11816
|
/// Width of the border around the menu popup.
|
|
11954
|
-
/// @group menu
|
|
11817
|
+
/// @group menu
|
|
11955
11818
|
$kendo-menu-popup-border-width: $popup-border-width !default;
|
|
11956
11819
|
|
|
11957
11820
|
/// Font sizes of the menu popup.
|
|
11958
|
-
/// @group menu
|
|
11959
|
-
$kendo-menu-popup-font-size: $font-size !default;
|
|
11960
|
-
$kendo-menu-popup-font-size-sm: $font-size-
|
|
11961
|
-
$kendo-menu-popup-font-size-md: $font-size !default;
|
|
11821
|
+
/// @group menu
|
|
11822
|
+
$kendo-menu-popup-font-size: $font-size-md !default;
|
|
11823
|
+
$kendo-menu-popup-font-size-sm: $font-size-md !default;
|
|
11824
|
+
$kendo-menu-popup-font-size-md: $font-size-md !default;
|
|
11962
11825
|
$kendo-menu-popup-font-size-lg: $font-size-lg !default;
|
|
11963
11826
|
|
|
11964
11827
|
/// Line heights used along with $font-size.
|
|
11965
|
-
/// @group menu
|
|
11966
|
-
$kendo-menu-popup-line-height: $line-height !default;
|
|
11967
|
-
$kendo-menu-popup-line-height-sm: $line-height !default;
|
|
11968
|
-
$kendo-menu-popup-line-height-md: $line-height !default;
|
|
11969
|
-
$kendo-menu-popup-line-height-lg: $line-height-
|
|
11828
|
+
/// @group menu
|
|
11829
|
+
$kendo-menu-popup-line-height: $line-height-md !default;
|
|
11830
|
+
$kendo-menu-popup-line-height-sm: $line-height-md !default;
|
|
11831
|
+
$kendo-menu-popup-line-height-md: $line-height-md !default;
|
|
11832
|
+
$kendo-menu-popup-line-height-lg: $line-height-md !default;
|
|
11970
11833
|
|
|
11971
11834
|
/// The background of the menu popup.
|
|
11972
|
-
/// @group menu
|
|
11835
|
+
/// @group menu
|
|
11973
11836
|
$kendo-menu-popup-bg: $popup-bg !default;
|
|
11974
11837
|
/// The text color of the menu popup.
|
|
11975
|
-
/// @group menu
|
|
11838
|
+
/// @group menu
|
|
11976
11839
|
$kendo-menu-popup-text: $popup-text !default;
|
|
11977
11840
|
/// The border color of the menu popup.
|
|
11978
|
-
/// @group menu
|
|
11841
|
+
/// @group menu
|
|
11979
11842
|
$kendo-menu-popup-border: $popup-border !default;
|
|
11980
11843
|
/// The background gradient of the menu popup.
|
|
11981
|
-
/// @group menu
|
|
11844
|
+
/// @group menu
|
|
11982
11845
|
$kendo-menu-popup-gradient: null !default;
|
|
11983
11846
|
|
|
11984
11847
|
|
|
11985
11848
|
// Menu popup item
|
|
11986
11849
|
|
|
11987
11850
|
/// Horizontal padding of the menu item in popup.
|
|
11988
|
-
/// @group menu
|
|
11989
|
-
$kendo-menu-popup-item-padding-x:
|
|
11990
|
-
$kendo-menu-popup-item-padding-x-
|
|
11991
|
-
$kendo-menu-popup-item-padding-x-
|
|
11992
|
-
$kendo-menu-popup-item-padding-x-
|
|
11993
|
-
$kendo-menu-popup-item-padding-x-lg: ( $kendo-menu-popup-item-padding-x-base * 1.25 ) !default;
|
|
11851
|
+
/// @group menu
|
|
11852
|
+
$kendo-menu-popup-item-padding-x: map-get( $spacing, 4 ) !default;
|
|
11853
|
+
$kendo-menu-popup-item-padding-x-sm: map-get( $spacing, 4 ) !default;
|
|
11854
|
+
$kendo-menu-popup-item-padding-x-md: map-get( $spacing, 4 ) !default;
|
|
11855
|
+
$kendo-menu-popup-item-padding-x-lg: map-get( $spacing, 4 ) !default;
|
|
11994
11856
|
|
|
11995
11857
|
/// Vertical padding of the menu item in popup.
|
|
11996
|
-
/// @group menu
|
|
11997
|
-
$kendo-menu-popup-item-padding-y:
|
|
11998
|
-
$kendo-menu-popup-item-padding-y-
|
|
11999
|
-
$kendo-menu-popup-item-padding-y-
|
|
12000
|
-
$kendo-menu-popup-item-padding-y-
|
|
12001
|
-
$kendo-menu-popup-item-padding-y-lg: ( $kendo-menu-popup-item-padding-y-base * 1.25 ) !default;
|
|
11858
|
+
/// @group menu
|
|
11859
|
+
$kendo-menu-popup-item-padding-y: map-get( $spacing, 1 ) !default;
|
|
11860
|
+
$kendo-menu-popup-item-padding-y-sm: map-get( $spacing, 1 ) - map-get( $spacing, thin ) !default;
|
|
11861
|
+
$kendo-menu-popup-item-padding-y-md: map-get( $spacing, 1 ) !default;
|
|
11862
|
+
$kendo-menu-popup-item-padding-y-lg: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !default;
|
|
12002
11863
|
|
|
12003
11864
|
/// The end padding of the menu item in popup.
|
|
12004
|
-
/// @group menu
|
|
12005
|
-
$kendo-menu-popup-item-padding-end:
|
|
11865
|
+
/// @group menu
|
|
11866
|
+
$kendo-menu-popup-item-padding-end: calc( #{$kendo-menu-popup-item-padding-x * 2} + #{$icon-size} ) !default;
|
|
12006
11867
|
$kendo-menu-popup-item-padding-end-sm: calc( #{$kendo-menu-popup-item-padding-x-sm * 2} + #{$icon-size} ) !default;
|
|
12007
11868
|
$kendo-menu-popup-item-padding-end-md: calc( #{$kendo-menu-popup-item-padding-x-md * 2} + #{$icon-size} ) !default;
|
|
12008
11869
|
$kendo-menu-popup-item-padding-end-lg: calc( #{$kendo-menu-popup-item-padding-x-lg * 2} + #{$icon-size} ) !default;
|
|
12009
11870
|
|
|
12010
11871
|
/// The start margin of the menu item expand icon.
|
|
12011
|
-
/// @group menu
|
|
11872
|
+
/// @group menu
|
|
12012
11873
|
$kendo-menu-popup-item-icon-margin-start-sm: $kendo-menu-popup-item-padding-x-sm !default;
|
|
12013
11874
|
$kendo-menu-popup-item-icon-margin-start: $kendo-menu-popup-item-padding-x-md !default;
|
|
12014
11875
|
$kendo-menu-popup-item-icon-margin-start-lg: $kendo-menu-popup-item-padding-x-lg !default;
|
|
12015
11876
|
|
|
12016
11877
|
/// The end margin of the menu item expand icon.
|
|
12017
|
-
/// @group menu
|
|
11878
|
+
/// @group menu
|
|
12018
11879
|
$kendo-menu-popup-item-icon-margin-end-sm: calc( -1 * (#{$kendo-menu-popup-item-padding-end-sm} - #{$kendo-menu-popup-item-padding-x-sm / 2}) ) !default;
|
|
12019
11880
|
$kendo-menu-popup-item-icon-margin-end: calc( -1 * (#{$kendo-menu-popup-item-padding-end-md} - #{$kendo-menu-popup-item-padding-x-md / 2}) ) !default;
|
|
12020
11881
|
$kendo-menu-popup-item-icon-margin-end-lg: calc( -1 * (#{$kendo-menu-popup-item-padding-end-lg} - #{$kendo-menu-popup-item-padding-x-lg / 2}) ) !default;
|
|
12021
11882
|
|
|
12022
11883
|
/// The spacing between the menu items in popup.
|
|
12023
|
-
/// @group menu
|
|
11884
|
+
/// @group menu
|
|
12024
11885
|
$kendo-menu-popup-item-spacing: 0px !default;
|
|
12025
11886
|
|
|
12026
11887
|
/// The background of the menu item in popup.
|
|
12027
|
-
/// @group menu
|
|
11888
|
+
/// @group menu
|
|
12028
11889
|
$kendo-menu-popup-item-bg: null !default;
|
|
12029
11890
|
/// The text color of the menu item in popup.
|
|
12030
|
-
/// @group menu
|
|
11891
|
+
/// @group menu
|
|
12031
11892
|
$kendo-menu-popup-item-text: null !default;
|
|
12032
11893
|
/// The border color of the menu item in popup.
|
|
12033
|
-
/// @group menu
|
|
11894
|
+
/// @group menu
|
|
12034
11895
|
$kendo-menu-popup-item-border: null !default;
|
|
12035
11896
|
/// The background gradient of the menu item in popup.
|
|
12036
|
-
/// @group menu
|
|
11897
|
+
/// @group menu
|
|
12037
11898
|
$kendo-menu-popup-item-gradient: null !default;
|
|
12038
11899
|
|
|
12039
11900
|
/// The background of hovered menu item in popup.
|
|
12040
|
-
/// @group menu
|
|
11901
|
+
/// @group menu
|
|
12041
11902
|
$kendo-menu-popup-item-hover-bg: $kendo-list-item-hover-bg !default;
|
|
12042
11903
|
/// The text color of hovered menu item in popup.
|
|
12043
|
-
/// @group menu
|
|
11904
|
+
/// @group menu
|
|
12044
11905
|
$kendo-menu-popup-item-hover-text: $kendo-list-item-hover-text !default;
|
|
12045
11906
|
/// The border color of hovered menu item in popup.
|
|
12046
|
-
/// @group menu
|
|
11907
|
+
/// @group menu
|
|
12047
11908
|
$kendo-menu-popup-item-hover-border: null !default;
|
|
12048
11909
|
/// The background gradient of hovered menu item in popup.
|
|
12049
|
-
/// @group menu
|
|
11910
|
+
/// @group menu
|
|
12050
11911
|
$kendo-menu-popup-item-hover-gradient: null !default;
|
|
12051
11912
|
|
|
12052
11913
|
/// The background of expanded menu item in popup.
|
|
12053
|
-
/// @group menu
|
|
11914
|
+
/// @group menu
|
|
12054
11915
|
$kendo-menu-popup-item-expanded-bg: $kendo-list-item-selected-bg !default;
|
|
12055
11916
|
/// The text color of expanded menu item in popup.
|
|
12056
|
-
/// @group menu
|
|
11917
|
+
/// @group menu
|
|
12057
11918
|
$kendo-menu-popup-item-expanded-text: $kendo-list-item-selected-text !default;
|
|
12058
11919
|
/// The border color of expanded menu item in popup.
|
|
12059
|
-
/// @group menu
|
|
11920
|
+
/// @group menu
|
|
12060
11921
|
$kendo-menu-popup-item-expanded-border: null !default;
|
|
12061
11922
|
/// The background gradient of expanded menu item in popup.
|
|
12062
|
-
/// @group menu
|
|
11923
|
+
/// @group menu
|
|
12063
11924
|
$kendo-menu-popup-item-expanded-gradient: null !default;
|
|
12064
11925
|
|
|
12065
11926
|
/// The base shadow of focused menu item in popup.
|
|
12066
|
-
/// @group menu
|
|
11927
|
+
/// @group menu
|
|
12067
11928
|
$kendo-menu-popup-item-focus-shadow: $menu-item-focus-shadow !default;
|
|
12068
11929
|
|
|
12069
11930
|
// #endregion
|
|
@@ -12212,8 +12073,8 @@ $grid-filter-menu-item-spacing-y: map-get( $spacing, 2 ) !default;
|
|
|
12212
12073
|
$grid-column-menu-popup-padding-x: null !default;
|
|
12213
12074
|
$grid-column-menu-popup-padding-y: null !default;
|
|
12214
12075
|
|
|
12215
|
-
$grid-column-menu-item-padding-x: $kendo-menu-popup-item-padding-x
|
|
12216
|
-
$grid-column-menu-item-padding-y: $kendo-menu-popup-item-padding-y
|
|
12076
|
+
$grid-column-menu-item-padding-x: $kendo-menu-popup-item-padding-x !default;
|
|
12077
|
+
$grid-column-menu-item-padding-y: $kendo-menu-popup-item-padding-y !default;
|
|
12217
12078
|
|
|
12218
12079
|
$grid-column-menu-list-item-padding-x: $kendo-list-item-padding-x-md !default;
|
|
12219
12080
|
$grid-column-menu-list-item-padding-y: $kendo-list-item-padding-y-md !default;
|
|
@@ -12275,22 +12136,22 @@ $kendo-table-cell-padding-y: null !default;
|
|
|
12275
12136
|
/// @group table
|
|
12276
12137
|
$kendo-table-sizes: (
|
|
12277
12138
|
sm: (
|
|
12278
|
-
font-size: $font-size,
|
|
12279
|
-
line-height: $line-height,
|
|
12139
|
+
font-size: $font-size-md,
|
|
12140
|
+
line-height: $line-height-md,
|
|
12280
12141
|
cell-padding-x: map-get( $spacing, 2 ),
|
|
12281
|
-
cell-padding-y: map-get( $spacing,
|
|
12142
|
+
cell-padding-y: map-get( $spacing, 2 ) - map-get( $spacing, thin )
|
|
12282
12143
|
),
|
|
12283
12144
|
md: (
|
|
12284
|
-
font-size: $font-size,
|
|
12285
|
-
line-height: $line-height,
|
|
12145
|
+
font-size: $font-size-md,
|
|
12146
|
+
line-height: $line-height-md,
|
|
12286
12147
|
cell-padding-x: map-get( $spacing, 2 ),
|
|
12287
12148
|
cell-padding-y: map-get( $spacing, 2 )
|
|
12288
12149
|
),
|
|
12289
12150
|
lg: (
|
|
12290
|
-
font-size: $font-size,
|
|
12291
|
-
line-height: $line-height,
|
|
12151
|
+
font-size: $font-size-md,
|
|
12152
|
+
line-height: $line-height-md,
|
|
12292
12153
|
cell-padding-x: map-get( $spacing, 2 ),
|
|
12293
|
-
cell-padding-y: map-get( $spacing,
|
|
12154
|
+
cell-padding-y: map-get( $spacing, 2 ) + map-get( $spacing, thin )
|
|
12294
12155
|
)
|
|
12295
12156
|
) !default;
|
|
12296
12157
|
|
|
@@ -12521,7 +12382,7 @@ $kendo-table-selected-border: $grid-selected-border !default;
|
|
|
12521
12382
|
.k-table-group-row {
|
|
12522
12383
|
|
|
12523
12384
|
&::before {
|
|
12524
|
-
content: "
|
|
12385
|
+
content: "\200b";
|
|
12525
12386
|
padding: $kendo-table-cell-padding-y 0;
|
|
12526
12387
|
width: 0;
|
|
12527
12388
|
display: block;
|
|
@@ -13120,7 +12981,7 @@ $kendo-chip-outline-selected-text: $kendo-chip-outline-hover-text !default;
|
|
|
13120
12981
|
// Chip List
|
|
13121
12982
|
|
|
13122
12983
|
/// The sizes of the chip list.
|
|
13123
|
-
/// @group chip
|
|
12984
|
+
/// @group chip
|
|
13124
12985
|
$kendo-chip-list-sizes: (
|
|
13125
12986
|
sm: map-get( $spacing, 1 ),
|
|
13126
12987
|
md: map-get( $spacing, 2 ),
|
|
@@ -14154,7 +14015,7 @@ $skeleton-wave-bg: rgba( black, .04 ) !default;
|
|
|
14154
14015
|
transform: $skeleton-text-transform;
|
|
14155
14016
|
|
|
14156
14017
|
&:empty::before {
|
|
14157
|
-
content: "\
|
|
14018
|
+
content: "\200b";
|
|
14158
14019
|
}
|
|
14159
14020
|
}
|
|
14160
14021
|
|
|
@@ -14416,9 +14277,12 @@ $tooltip-error-border: $tooltip-error-bg !default;
|
|
|
14416
14277
|
|
|
14417
14278
|
// Input
|
|
14418
14279
|
.k-input,
|
|
14419
|
-
.k-picker
|
|
14280
|
+
.k-picker {
|
|
14420
14281
|
width: $toolbar-input-width;
|
|
14421
14282
|
}
|
|
14283
|
+
.k-color-picker {
|
|
14284
|
+
width: min-content;
|
|
14285
|
+
}
|
|
14422
14286
|
|
|
14423
14287
|
// Overflow anchor
|
|
14424
14288
|
.k-overflow-anchor {
|
|
@@ -14579,6 +14443,7 @@ $tooltip-error-border: $tooltip-error-bg !default;
|
|
|
14579
14443
|
.k-toolbar {
|
|
14580
14444
|
padding: 0;
|
|
14581
14445
|
border-width: 0;
|
|
14446
|
+
flex-shrink: 1;
|
|
14582
14447
|
color: inherit;
|
|
14583
14448
|
background: none;
|
|
14584
14449
|
}
|
|
@@ -14998,10 +14863,6 @@ $fieldset-legend-border: null !default;
|
|
|
14998
14863
|
display: flex;
|
|
14999
14864
|
flex-flow: row nowrap;
|
|
15000
14865
|
}
|
|
15001
|
-
.k-checkbox-label,
|
|
15002
|
-
.k-radio-label {
|
|
15003
|
-
display: inline-flex;
|
|
15004
|
-
}
|
|
15005
14866
|
|
|
15006
14867
|
.k-label + .k-radio {
|
|
15007
14868
|
margin-left: 0;
|
|
@@ -15036,13 +14897,11 @@ $fieldset-legend-border: null !default;
|
|
|
15036
14897
|
padding: 0;
|
|
15037
14898
|
}
|
|
15038
14899
|
|
|
15039
|
-
.k-form-field
|
|
15040
|
-
.k-daterangepicker .k-textbox-container {
|
|
14900
|
+
.k-form-field {
|
|
15041
14901
|
margin-top: $form-field-margin-top;
|
|
15042
14902
|
}
|
|
15043
14903
|
|
|
15044
|
-
>
|
|
15045
|
-
.k-daterangepicker .k-textbox-container {
|
|
14904
|
+
> * {
|
|
15046
14905
|
&:not(.k-hidden):first-child,
|
|
15047
14906
|
&.k-hidden + :not(.k-hidden) {
|
|
15048
14907
|
margin-top: 0;
|
|
@@ -15081,6 +14940,11 @@ $fieldset-legend-border: null !default;
|
|
|
15081
14940
|
display: inline-flex;
|
|
15082
14941
|
width: 100%;
|
|
15083
14942
|
}
|
|
14943
|
+
.k-daterangepicker {
|
|
14944
|
+
width: 100%;
|
|
14945
|
+
flex-flow: column nowrap;
|
|
14946
|
+
gap: 0;
|
|
14947
|
+
}
|
|
15084
14948
|
}
|
|
15085
14949
|
|
|
15086
14950
|
// Form Buttons Container
|
|
@@ -15773,7 +15637,9 @@ $fieldset-legend-border: null !default;
|
|
|
15773
15637
|
@include exports( "textarea/layout" ) {
|
|
15774
15638
|
|
|
15775
15639
|
// Textarea
|
|
15776
|
-
.k-textarea {
|
|
15640
|
+
.k-textarea {
|
|
15641
|
+
display: flex;
|
|
15642
|
+
}
|
|
15777
15643
|
|
|
15778
15644
|
}
|
|
15779
15645
|
|
|
@@ -15924,9 +15790,18 @@ $listbox-drop-hint-width: 1px !default;
|
|
|
15924
15790
|
|
|
15925
15791
|
.k-list-scroller {
|
|
15926
15792
|
width: 100%;
|
|
15793
|
+
height: inherit;
|
|
15927
15794
|
border-width: $listbox-border-width;
|
|
15928
15795
|
border-style: solid;
|
|
15929
15796
|
box-sizing: border-box;
|
|
15797
|
+
|
|
15798
|
+
.k-list-scroller {
|
|
15799
|
+
border-width: 0;
|
|
15800
|
+
}
|
|
15801
|
+
|
|
15802
|
+
.k-list {
|
|
15803
|
+
height: inherit;
|
|
15804
|
+
}
|
|
15930
15805
|
}
|
|
15931
15806
|
|
|
15932
15807
|
.k-drop-hint {
|
|
@@ -16349,127 +16224,125 @@ $progressbar-chunk-border: $body-bg !default;
|
|
|
16349
16224
|
// #region @import "_variables.scss"; -> packages/bootstrap/scss/radio/_variables.scss
|
|
16350
16225
|
// Radio button
|
|
16351
16226
|
|
|
16352
|
-
///
|
|
16353
|
-
/// @group radio
|
|
16354
|
-
$kendo-radio-sizes: (
|
|
16355
|
-
sm: map-get( $spacing, 3),
|
|
16356
|
-
md: map-get( $spacing, 4),
|
|
16357
|
-
lg: map-get( $spacing, 6)
|
|
16358
|
-
) !default;
|
|
16359
|
-
|
|
16360
|
-
/// The Border radius of the radio button.
|
|
16227
|
+
/// Border radius of radio button.
|
|
16361
16228
|
/// @group radio
|
|
16362
16229
|
$kendo-radio-radius: 50% !default;
|
|
16363
|
-
///
|
|
16230
|
+
/// Border width of radio button.
|
|
16364
16231
|
/// @group radio
|
|
16365
16232
|
$kendo-radio-border-width: 1px !default;
|
|
16366
|
-
/// The Line height of the radio button.
|
|
16367
|
-
/// @group radio
|
|
16368
|
-
$kendo-radio-line-height: calc( #{map-get( $kendo-radio-sizes, "md" )} + #{$kendo-radio-border-width} ) !default;
|
|
16369
16233
|
|
|
16370
|
-
|
|
16234
|
+
// Radio button sizes
|
|
16235
|
+
$kendo-radio-sizes: (
|
|
16236
|
+
sm: (
|
|
16237
|
+
size: map-get( $spacing, 3 ),
|
|
16238
|
+
glyph-size: ( map-get( $spacing, 3 ) - map-get( $spacing, thin ) ),
|
|
16239
|
+
ripple-size: map-get( $spacing, 3 ) * 3
|
|
16240
|
+
),
|
|
16241
|
+
md: (
|
|
16242
|
+
size: map-get( $spacing, 4 ),
|
|
16243
|
+
glyph-size: ( map-get( $spacing, 4 ) - map-get( $spacing, thin ) ),
|
|
16244
|
+
ripple-size: map-get( $spacing, 4 ) * 3
|
|
16245
|
+
),
|
|
16246
|
+
lg: (
|
|
16247
|
+
size: map-get( $spacing, 5 ),
|
|
16248
|
+
glyph-size: ( map-get( $spacing, 5 ) - map-get( $spacing, thin ) ),
|
|
16249
|
+
ripple-size: map-get( $spacing, 5 ) * 3
|
|
16250
|
+
)
|
|
16251
|
+
) !default;
|
|
16252
|
+
|
|
16253
|
+
/// Background color of radio button.
|
|
16371
16254
|
/// @group radio
|
|
16372
16255
|
$kendo-radio-bg: $kendo-checkbox-bg !default;
|
|
16373
|
-
///
|
|
16256
|
+
/// Color of radio button.
|
|
16374
16257
|
/// @group radio
|
|
16375
16258
|
$kendo-radio-text: $kendo-checkbox-text !default;
|
|
16376
|
-
///
|
|
16259
|
+
/// Border color of radio button.
|
|
16377
16260
|
/// @group radio
|
|
16378
16261
|
$kendo-radio-border: $kendo-checkbox-border !default;
|
|
16379
16262
|
|
|
16380
|
-
///
|
|
16263
|
+
/// Background color of hovered radio button.
|
|
16381
16264
|
/// @group radio
|
|
16382
16265
|
$kendo-radio-hover-bg: $kendo-checkbox-hover-bg !default;
|
|
16383
|
-
///
|
|
16266
|
+
/// Color of hovered radio button.
|
|
16384
16267
|
/// @group radio
|
|
16385
16268
|
$kendo-radio-hover-text: $kendo-checkbox-hover-text !default;
|
|
16386
|
-
///
|
|
16269
|
+
/// Border color of hovered radio button.
|
|
16387
16270
|
/// @group radio
|
|
16388
16271
|
$kendo-radio-hover-border: $kendo-checkbox-hover-border !default;
|
|
16389
16272
|
|
|
16390
|
-
///
|
|
16273
|
+
/// Background color of checked radio button.
|
|
16391
16274
|
/// @group radio
|
|
16392
16275
|
$kendo-radio-checked-bg: $kendo-checkbox-checked-bg !default;
|
|
16393
|
-
///
|
|
16276
|
+
/// Color of checked radio button.
|
|
16394
16277
|
/// @group radio
|
|
16395
16278
|
$kendo-radio-checked-text: $kendo-checkbox-checked-text !default;
|
|
16396
|
-
///
|
|
16279
|
+
/// Border color of checked radio button.
|
|
16397
16280
|
/// @group radio
|
|
16398
16281
|
$kendo-radio-checked-border: $kendo-checkbox-checked-border !default;
|
|
16399
16282
|
|
|
16400
|
-
///
|
|
16401
|
-
/// @group radio
|
|
16402
|
-
$kendo-radio-indeterminate-bg: $kendo-radio-checked-bg !default;
|
|
16403
|
-
/// The text of indeterminate radio button
|
|
16404
|
-
/// @group radio
|
|
16405
|
-
$kendo-radio-indeterminate-text: $kendo-radio-checked-text !default;
|
|
16406
|
-
/// The border of indeterminate radio button.
|
|
16407
|
-
/// @group radio
|
|
16408
|
-
$kendo-radio-indeterminate-border: $kendo-radio-checked-border !default;
|
|
16409
|
-
|
|
16410
|
-
/// The border of focused radio button.
|
|
16283
|
+
/// Border color of focused radio button.
|
|
16411
16284
|
/// @group radio
|
|
16412
16285
|
$kendo-radio-focus-border: $kendo-checkbox-focus-border !default;
|
|
16413
|
-
///
|
|
16286
|
+
/// Box shadow of focused radio button.
|
|
16414
16287
|
/// @group radio
|
|
16415
16288
|
$kendo-radio-focus-shadow: $kendo-checkbox-focus-shadow !default;
|
|
16416
|
-
///
|
|
16289
|
+
/// Border color of focused and checked radio button.
|
|
16417
16290
|
/// @group radio
|
|
16418
|
-
$kendo-radio-focus-checked-border: $kendo-checkbox-checked-border !default;
|
|
16419
|
-
///
|
|
16291
|
+
$kendo-radio-focus-checked-border: $kendo-checkbox-focus-checked-border !default;
|
|
16292
|
+
/// Box shadow of focused and checked radio button.
|
|
16420
16293
|
/// @group radio
|
|
16421
16294
|
$kendo-radio-focus-checked-shadow: $kendo-checkbox-focus-checked-shadow !default;
|
|
16422
16295
|
|
|
16423
|
-
///
|
|
16296
|
+
/// Background color of disabled radio button.
|
|
16424
16297
|
/// @group radio
|
|
16425
|
-
$kendo-radio-disabled-bg:
|
|
16426
|
-
///
|
|
16298
|
+
$kendo-radio-disabled-bg: $kendo-checkbox-disabled-bg !default;
|
|
16299
|
+
/// Color of disabled radio button.
|
|
16427
16300
|
/// @group radio
|
|
16428
|
-
$kendo-radio-disabled-text:
|
|
16429
|
-
///
|
|
16301
|
+
$kendo-radio-disabled-text: $kendo-checkbox-disabled-text !default;
|
|
16302
|
+
/// Border color of disabled radio button.
|
|
16430
16303
|
/// @group radio
|
|
16431
|
-
$kendo-radio-disabled-border:
|
|
16304
|
+
$kendo-radio-disabled-border: $kendo-checkbox-disabled-border !default;
|
|
16432
16305
|
|
|
16433
|
-
///
|
|
16306
|
+
/// Background color of disabled and checked radio button.
|
|
16434
16307
|
/// @group radio
|
|
16435
|
-
$kendo-radio-disabled-checked-bg:
|
|
16436
|
-
///
|
|
16308
|
+
$kendo-radio-disabled-checked-bg: $kendo-checkbox-disabled-checked-bg !default;
|
|
16309
|
+
/// Color of disabled and checked radio button.
|
|
16437
16310
|
/// @group radio
|
|
16438
|
-
$kendo-radio-disabled-checked-text:
|
|
16439
|
-
///
|
|
16311
|
+
$kendo-radio-disabled-checked-text: $kendo-checkbox-disabled-checked-text !default;
|
|
16312
|
+
/// Border color of disabled and checked radio button.
|
|
16440
16313
|
/// @group radio
|
|
16441
|
-
$kendo-radio-disabled-checked-border:
|
|
16314
|
+
$kendo-radio-disabled-checked-border: $kendo-checkbox-disabled-checked-border !default;
|
|
16442
16315
|
|
|
16443
|
-
///
|
|
16316
|
+
/// Background color of invalid radio button.
|
|
16444
16317
|
/// @group radio
|
|
16445
|
-
$kendo-radio-invalid-bg:
|
|
16446
|
-
///
|
|
16318
|
+
$kendo-radio-invalid-bg: $kendo-checkbox-invalid-bg !default;
|
|
16319
|
+
/// Color of invalid radio button.
|
|
16447
16320
|
/// @group radio
|
|
16448
|
-
$kendo-radio-invalid-text: $invalid-text !default;
|
|
16449
|
-
///
|
|
16321
|
+
$kendo-radio-invalid-text: $kendo-checkbox-invalid-text !default;
|
|
16322
|
+
/// Border color of invalid radio button.
|
|
16450
16323
|
/// @group radio
|
|
16451
|
-
$kendo-radio-invalid-border: $invalid-border !default;
|
|
16324
|
+
$kendo-radio-invalid-border: $kendo-checkbox-invalid-border !default;
|
|
16452
16325
|
|
|
16453
16326
|
|
|
16454
16327
|
// Radio indicator
|
|
16455
16328
|
|
|
16456
|
-
///
|
|
16329
|
+
/// Type of radio button indicator.
|
|
16457
16330
|
/// @group radio
|
|
16458
|
-
$kendo-radio-
|
|
16331
|
+
$kendo-radio-indicator-type: image !default;
|
|
16459
16332
|
|
|
16460
|
-
///
|
|
16333
|
+
/// Glyph font family of radio button indicator.
|
|
16461
16334
|
/// @group radio
|
|
16462
16335
|
$kendo-radio-glyph-font-family: "WebComponentsIcons", monospace !default;
|
|
16463
|
-
///
|
|
16464
|
-
/// @group radio
|
|
16465
|
-
$kendo-radio-glyph-size: 12px !default;
|
|
16466
|
-
/// The checked glyph of radio button.
|
|
16336
|
+
/// Glyph of radio button indicator.
|
|
16467
16337
|
/// @group radio
|
|
16468
16338
|
$kendo-radio-checked-glyph: "\e308" !default;
|
|
16469
16339
|
|
|
16470
|
-
///
|
|
16340
|
+
/// Image of checked radio button indicator.
|
|
16471
16341
|
/// @group radio
|
|
16472
16342
|
$kendo-radio-checked-image: escape-svg( url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='2' fill='#{$kendo-radio-checked-text}'/></svg>") ) !default;
|
|
16343
|
+
/// Image of disabled and checked radio button indicator.
|
|
16344
|
+
/// @group radio
|
|
16345
|
+
$kendo-radio-disabled-checked-image: null !default;
|
|
16473
16346
|
|
|
16474
16347
|
|
|
16475
16348
|
// Radio label
|
|
@@ -16481,36 +16354,25 @@ $kendo-radio-label-margin-x: map-get( $spacing, 1 ) !default;
|
|
|
16481
16354
|
|
|
16482
16355
|
// Radio list
|
|
16483
16356
|
|
|
16484
|
-
///
|
|
16357
|
+
/// Spacing between items of horizontal radio button list.
|
|
16485
16358
|
/// @group radio
|
|
16486
16359
|
$kendo-radio-list-spacing: map-get( $spacing, 4 ) !default;
|
|
16487
|
-
///
|
|
16360
|
+
/// Horizontal padding of radio button list items.
|
|
16488
16361
|
/// @group radio
|
|
16489
16362
|
$kendo-radio-list-item-padding-x: 0px !default;
|
|
16490
|
-
///
|
|
16363
|
+
/// Vertical padding of radio button list items.
|
|
16491
16364
|
/// @group radio
|
|
16492
16365
|
$kendo-radio-list-item-padding-y: $kendo-list-item-padding-y-md !default;
|
|
16493
16366
|
|
|
16494
16367
|
|
|
16495
16368
|
// Radio ripple
|
|
16496
16369
|
|
|
16497
|
-
///
|
|
16370
|
+
/// Background color of radio button ripple.
|
|
16498
16371
|
/// @group radio
|
|
16499
|
-
$kendo-radio-ripple-
|
|
16500
|
-
|
|
16501
|
-
md: (map-get( $kendo-radio-sizes, "md" ) * 3),
|
|
16502
|
-
lg: (map-get( $kendo-radio-sizes, "lg" ) * 3)
|
|
16503
|
-
) !default;
|
|
16504
|
-
/// The ripple margin of radio button.
|
|
16372
|
+
$kendo-radio-ripple-bg: $kendo-radio-checked-bg !default;
|
|
16373
|
+
/// Opacity of radio button ripple.
|
|
16505
16374
|
/// @group radio
|
|
16506
|
-
$kendo-radio-ripple-
|
|
16507
|
-
sm: calc(-1 * (#{map-get( $kendo-radio-sizes, "sm" )} + 2 * #{$kendo-radio-border-width})),
|
|
16508
|
-
md: calc(-1 * (#{map-get( $kendo-radio-sizes, "md" )} + 2 * #{$kendo-radio-border-width})),
|
|
16509
|
-
lg: calc(-1 * (#{map-get( $kendo-radio-sizes, "lg" )} + 2 * #{$kendo-radio-border-width}))
|
|
16510
|
-
) !default;
|
|
16511
|
-
/// The ripple opacity of radio button.
|
|
16512
|
-
/// @group radio
|
|
16513
|
-
$kendo-radio-ripple-opacity: .3 !default;
|
|
16375
|
+
$kendo-radio-ripple-opacity: .25 !default;
|
|
16514
16376
|
|
|
16515
16377
|
// #endregion
|
|
16516
16378
|
// #region @import "_layout.scss"; -> packages/bootstrap/scss/radio/_layout.scss
|
|
@@ -16538,82 +16400,50 @@ $kendo-radio-ripple-opacity: .3 !default;
|
|
|
16538
16400
|
-webkit-appearance: none;
|
|
16539
16401
|
}
|
|
16540
16402
|
|
|
16541
|
-
// Radio size
|
|
16542
|
-
|
|
16543
|
-
@each $name, $size in $kendo-radio-sizes {
|
|
16544
|
-
.k-radio-#{$name} {
|
|
16545
|
-
width: $size;
|
|
16546
|
-
height: $size;
|
|
16547
|
-
|
|
16548
|
-
+ .k-radio-label {
|
|
16549
16403
|
|
|
16550
|
-
|
|
16551
|
-
|
|
16552
|
-
|
|
16553
|
-
|
|
16554
|
-
|
|
16555
|
-
|
|
16556
|
-
|
|
16557
|
-
|
|
16558
|
-
|
|
16559
|
-
|
|
16560
|
-
|
|
16561
|
-
|
|
16562
|
-
|
|
16563
|
-
width: $kendo-radio-glyph-size;
|
|
16564
|
-
height: $kendo-radio-glyph-size;
|
|
16565
|
-
font-size: $kendo-radio-glyph-size;
|
|
16566
|
-
font-family: $kendo-radio-glyph-font-family;
|
|
16567
|
-
line-height: 1;
|
|
16568
|
-
transform: scale(0) translate(-50%, -50%);
|
|
16569
|
-
overflow: hidden;
|
|
16570
|
-
position: absolute;
|
|
16571
|
-
top: 50%;
|
|
16572
|
-
left: 50%;
|
|
16573
|
-
}
|
|
16574
|
-
|
|
16575
|
-
@if $kendo-radio-icon-type == "marker" {
|
|
16576
|
-
content: "";
|
|
16577
|
-
width: ($size / 2);
|
|
16578
|
-
height: ($size / 2);
|
|
16579
|
-
border-radius: 50%;
|
|
16580
|
-
background-color: currentColor;
|
|
16581
|
-
transform: scale(0) translate(-50%, -50%);
|
|
16582
|
-
overflow: hidden;
|
|
16583
|
-
position: absolute;
|
|
16584
|
-
top: 50%;
|
|
16585
|
-
left: 50%;
|
|
16586
|
-
}
|
|
16404
|
+
// Radio indicator
|
|
16405
|
+
.k-radio::before {
|
|
16406
|
+
@if $kendo-radio-indicator-type == "glyph" {
|
|
16407
|
+
content: $kendo-radio-checked-glyph;
|
|
16408
|
+
width: 1em;
|
|
16409
|
+
height: 1em;
|
|
16410
|
+
font-family: $kendo-radio-glyph-font-family;
|
|
16411
|
+
line-height: 1;
|
|
16412
|
+
transform: scale(0) translate(-50%, -50%);
|
|
16413
|
+
overflow: hidden;
|
|
16414
|
+
position: absolute;
|
|
16415
|
+
top: 50%;
|
|
16416
|
+
left: 50%;
|
|
16587
16417
|
}
|
|
16588
16418
|
}
|
|
16589
16419
|
|
|
16420
|
+
|
|
16590
16421
|
// Checked state
|
|
16591
16422
|
.k-radio:checked,
|
|
16592
16423
|
.k-radio.k-checked {
|
|
16593
|
-
@if $kendo-radio-
|
|
16424
|
+
@if $kendo-radio-indicator-type == "image" {
|
|
16594
16425
|
background-image: $kendo-radio-checked-image;
|
|
16595
16426
|
}
|
|
16596
16427
|
|
|
16597
|
-
@if $kendo-radio-
|
|
16598
|
-
&::before {
|
|
16599
|
-
transform: scale(1) translate(-50%, -50%);
|
|
16600
|
-
}
|
|
16601
|
-
}
|
|
16602
|
-
|
|
16603
|
-
@if $kendo-radio-icon-type == "marker" {
|
|
16428
|
+
@if $kendo-radio-indicator-type == "glyph" {
|
|
16604
16429
|
&::before {
|
|
16605
16430
|
transform: scale(1) translate(-50%, -50%);
|
|
16606
16431
|
}
|
|
16607
16432
|
}
|
|
16608
16433
|
}
|
|
16609
16434
|
|
|
16435
|
+
|
|
16610
16436
|
// Disabled state
|
|
16611
16437
|
.k-radio:disabled,
|
|
16612
|
-
.k-radio.k-disabled
|
|
16613
|
-
.k-radio:disabled + .k-radio-label,
|
|
16614
|
-
.k-radio.k-disabled + .k-radio-label {
|
|
16438
|
+
.k-radio.k-disabled {
|
|
16615
16439
|
@include disabled( $disabled-styling );
|
|
16616
16440
|
}
|
|
16441
|
+
.k-radio:disabled:checked,
|
|
16442
|
+
.k-radio.k-disabled.k-checked {
|
|
16443
|
+
@if $kendo-radio-indicator-type == "image" {
|
|
16444
|
+
background-image: $kendo-radio-disabled-checked-image;
|
|
16445
|
+
}
|
|
16446
|
+
}
|
|
16617
16447
|
|
|
16618
16448
|
|
|
16619
16449
|
// Radio wrap
|
|
@@ -16623,6 +16453,9 @@ $kendo-radio-ripple-opacity: .3 !default;
|
|
|
16623
16453
|
flex-flow: row nowrap;
|
|
16624
16454
|
gap: 0;
|
|
16625
16455
|
align-items: center;
|
|
16456
|
+
align-self: start;
|
|
16457
|
+
vertical-align: middle;
|
|
16458
|
+
position: relative;
|
|
16626
16459
|
|
|
16627
16460
|
&::before {
|
|
16628
16461
|
content: "\200b";
|
|
@@ -16634,63 +16467,41 @@ $kendo-radio-ripple-opacity: .3 !default;
|
|
|
16634
16467
|
}
|
|
16635
16468
|
}
|
|
16636
16469
|
|
|
16637
|
-
.k-radio + .k-radio-label {
|
|
16638
|
-
display: inline;
|
|
16639
|
-
}
|
|
16640
16470
|
|
|
16641
16471
|
// Radio label
|
|
16642
16472
|
.k-radio-label {
|
|
16643
16473
|
margin: 0;
|
|
16644
16474
|
padding: 0;
|
|
16645
|
-
line-height: $kendo-radio-line-height;
|
|
16646
16475
|
display: inline-flex;
|
|
16647
16476
|
align-items: flex-start;
|
|
16477
|
+
gap: $kendo-radio-label-margin-x;
|
|
16648
16478
|
vertical-align: middle;
|
|
16649
16479
|
position: relative;
|
|
16650
16480
|
cursor: pointer;
|
|
16651
16481
|
|
|
16652
|
-
.k-label {
|
|
16653
|
-
cursor: pointer;
|
|
16654
|
-
}
|
|
16655
|
-
|
|
16656
|
-
// Hide empty label
|
|
16657
|
-
&:empty {
|
|
16658
|
-
display: none !important; // sass-lint:disable-line no-important
|
|
16659
|
-
}
|
|
16660
|
-
|
|
16661
16482
|
.k-ripple {
|
|
16662
|
-
right: auto;
|
|
16663
|
-
bottom: auto;
|
|
16664
|
-
transform: translate(-50%, -50%);
|
|
16665
|
-
border-radius: 50%;
|
|
16666
|
-
|
|
16667
16483
|
// Hide ripple temporarily
|
|
16668
16484
|
visibility: hidden !important; // sass-lint:disable-line no-important
|
|
16669
16485
|
}
|
|
16670
|
-
|
|
16671
|
-
.k-ripple-blob {
|
|
16672
|
-
// sass-lint:disable-block no-important
|
|
16673
|
-
// use !important until ripple can apply these styles from the script
|
|
16674
|
-
top: 50% !important;
|
|
16675
|
-
left: 50% !important;
|
|
16676
|
-
width: 200% !important;
|
|
16677
|
-
height: 200% !important;
|
|
16678
|
-
}
|
|
16679
16486
|
}
|
|
16680
|
-
|
|
16487
|
+
.k-radio + .k-label,
|
|
16488
|
+
.k-radio-wrap + .k-label,
|
|
16681
16489
|
.k-radio + .k-radio-label,
|
|
16682
|
-
.k-radio-
|
|
16683
|
-
|
|
16684
|
-
margin-
|
|
16490
|
+
.k-radio-wrap + .k-radio-label {
|
|
16491
|
+
display: inline;
|
|
16492
|
+
margin-inline-start: $kendo-radio-label-margin-x;
|
|
16685
16493
|
}
|
|
16686
|
-
|
|
16687
|
-
|
|
16688
|
-
|
|
16494
|
+
|
|
16495
|
+
|
|
16496
|
+
// Empty label
|
|
16497
|
+
.k-radio-label:empty {
|
|
16498
|
+
display: none !important; // sass-lint:disable-line no-important
|
|
16689
16499
|
}
|
|
16690
|
-
|
|
16691
|
-
|
|
16500
|
+
.k-radio-label.k-no-text {
|
|
16501
|
+
min-width: 1px;
|
|
16692
16502
|
}
|
|
16693
16503
|
|
|
16504
|
+
|
|
16694
16505
|
// Radio list
|
|
16695
16506
|
.k-radio-list {
|
|
16696
16507
|
margin: 0;
|
|
@@ -16710,7 +16521,7 @@ $kendo-radio-ripple-opacity: .3 !default;
|
|
|
16710
16521
|
gap: map-get( $spacing, 1 );
|
|
16711
16522
|
|
|
16712
16523
|
.k-radio-label {
|
|
16713
|
-
|
|
16524
|
+
margin: 0;
|
|
16714
16525
|
}
|
|
16715
16526
|
}
|
|
16716
16527
|
.k-radio-list-horizontal,
|
|
@@ -16720,43 +16531,28 @@ $kendo-radio-ripple-opacity: .3 !default;
|
|
|
16720
16531
|
gap: $kendo-radio-list-spacing;
|
|
16721
16532
|
}
|
|
16722
16533
|
|
|
16723
|
-
// RTL
|
|
16724
|
-
.k-rtl,
|
|
16725
|
-
[dir="rtl"] {
|
|
16726
|
-
.k-radio + .k-radio-label,
|
|
16727
|
-
.k-radio-label + .k-radio,
|
|
16728
|
-
.k-label + .k-radio {
|
|
16729
|
-
margin-left: 0;
|
|
16730
|
-
margin-right: $kendo-radio-label-margin-x;
|
|
16731
|
-
}
|
|
16732
|
-
.k-radio-label > .k-radio {
|
|
16733
|
-
margin-right: 0;
|
|
16734
|
-
margin-left: $kendo-radio-label-margin-x;
|
|
16735
|
-
}
|
|
16736
|
-
kendo-label.k-radio-label > .k-radio:last-child {
|
|
16737
|
-
margin-left: 0;
|
|
16738
|
-
}
|
|
16739
|
-
kendo-label.k-radio-label > .k-label:first-child {
|
|
16740
|
-
margin-right: 0;
|
|
16741
|
-
margin-left: $kendo-radio-label-margin-x;
|
|
16742
|
-
}
|
|
16743
|
-
}
|
|
16744
16534
|
|
|
16535
|
+
// Ripple
|
|
16745
16536
|
.k-ripple-container {
|
|
16746
|
-
|
|
16747
|
-
|
|
16748
|
-
|
|
16749
|
-
|
|
16750
|
-
|
|
16751
|
-
|
|
16752
|
-
|
|
16753
|
-
|
|
16754
|
-
|
|
16755
|
-
|
|
16756
|
-
|
|
16757
|
-
|
|
16758
|
-
|
|
16759
|
-
|
|
16537
|
+
.k-radio::after {
|
|
16538
|
+
content: "";
|
|
16539
|
+
display: block;
|
|
16540
|
+
position: absolute;
|
|
16541
|
+
left: 50%;
|
|
16542
|
+
top: 50%;
|
|
16543
|
+
border-radius: 100%;
|
|
16544
|
+
z-index: -1;
|
|
16545
|
+
transition: opacity 100ms linear, transform 150ms cubic-bezier(.4, 0, .2, 1);
|
|
16546
|
+
transform: translate(-50%, -50%) scale(0);
|
|
16547
|
+
transform-origin: center center;
|
|
16548
|
+
}
|
|
16549
|
+
|
|
16550
|
+
.k-radio:focus,
|
|
16551
|
+
.k-radio.k-state-focus {
|
|
16552
|
+
box-shadow: none !important; // sass-lint:disable-line no-important
|
|
16553
|
+
|
|
16554
|
+
&::after {
|
|
16555
|
+
transform: translate(-50%, -50%) scale(1);
|
|
16760
16556
|
}
|
|
16761
16557
|
}
|
|
16762
16558
|
|
|
@@ -16764,25 +16560,33 @@ $kendo-radio-ripple-opacity: .3 !default;
|
|
|
16764
16560
|
.k-radio.k-disabled::after {
|
|
16765
16561
|
display: none;
|
|
16766
16562
|
}
|
|
16767
|
-
}
|
|
16768
|
-
}
|
|
16769
|
-
|
|
16770
16563
|
|
|
16564
|
+
.k-radio:disabled::after,
|
|
16565
|
+
.k-radio.k-disabled::after {
|
|
16566
|
+
display: none;
|
|
16567
|
+
}
|
|
16568
|
+
}
|
|
16771
16569
|
|
|
16772
16570
|
|
|
16773
|
-
|
|
16571
|
+
// Radio size
|
|
16572
|
+
@each $size, $size-props in $kendo-radio-sizes {
|
|
16573
|
+
$_size: map-get( $size-props, size );
|
|
16574
|
+
$_glyph-size: map-get( $size-props, glyph-size );
|
|
16575
|
+
$_ripple-size: map-get( $size-props, ripple-size );
|
|
16774
16576
|
|
|
16775
|
-
|
|
16776
|
-
|
|
16777
|
-
|
|
16778
|
-
color: inherit;
|
|
16779
|
-
background-color: inherit;
|
|
16780
|
-
}
|
|
16577
|
+
.k-radio-#{$size} {
|
|
16578
|
+
width: $_size;
|
|
16579
|
+
height: $_size;
|
|
16781
16580
|
|
|
16782
|
-
|
|
16783
|
-
|
|
16784
|
-
|
|
16785
|
-
|
|
16581
|
+
&::before {
|
|
16582
|
+
font-size: $_glyph-size;
|
|
16583
|
+
}
|
|
16584
|
+
}
|
|
16585
|
+
.k-ripple-container {
|
|
16586
|
+
.k-radio-#{$size}::after {
|
|
16587
|
+
width: $_ripple-size;
|
|
16588
|
+
height: $_ripple-size;
|
|
16589
|
+
}
|
|
16786
16590
|
}
|
|
16787
16591
|
}
|
|
16788
16592
|
|
|
@@ -16793,7 +16597,7 @@ $kendo-radio-ripple-opacity: .3 !default;
|
|
|
16793
16597
|
// #endregion
|
|
16794
16598
|
// #region @import "_theme.scss"; -> packages/bootstrap/scss/radio/_theme.scss
|
|
16795
16599
|
// #region @import "~@progress/kendo-theme-default/scss/radio/_theme.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/radio/_theme.scss
|
|
16796
|
-
@include exports("radio/theme") {
|
|
16600
|
+
@include exports( "radio/theme" ) {
|
|
16797
16601
|
|
|
16798
16602
|
// Radio
|
|
16799
16603
|
.k-radio {
|
|
@@ -16848,7 +16652,6 @@ $kendo-radio-ripple-opacity: .3 !default;
|
|
|
16848
16652
|
$kendo-radio-checked-border
|
|
16849
16653
|
);
|
|
16850
16654
|
}
|
|
16851
|
-
|
|
16852
16655
|
.k-radio:checked:focus,
|
|
16853
16656
|
.k-radio.k-checked.k-state-focus {
|
|
16854
16657
|
@include fill( $border: $kendo-radio-focus-checked-border );
|
|
@@ -16874,11 +16677,12 @@ $kendo-radio-ripple-opacity: .3 !default;
|
|
|
16874
16677
|
);
|
|
16875
16678
|
}
|
|
16876
16679
|
|
|
16680
|
+
|
|
16877
16681
|
// Ripple
|
|
16878
16682
|
.k-ripple-container {
|
|
16879
16683
|
.k-radio::after {
|
|
16880
|
-
background: $kendo-
|
|
16881
|
-
opacity: $kendo-
|
|
16684
|
+
background: $kendo-radio-checked-bg;
|
|
16685
|
+
opacity: $kendo-radio-ripple-opacity;
|
|
16882
16686
|
}
|
|
16883
16687
|
}
|
|
16884
16688
|
|
|
@@ -16991,23 +16795,11 @@ $slider-disabled-opacity: null !default;
|
|
|
16991
16795
|
line-height: $slider-line-height;
|
|
16992
16796
|
background: none;
|
|
16993
16797
|
display: inline-flex;
|
|
16994
|
-
align-items:
|
|
16798
|
+
align-items: center;
|
|
16995
16799
|
position: relative;
|
|
16996
16800
|
-webkit-touch-callout: none;
|
|
16997
16801
|
-webkit-tap-highlight-color: $rgba-transparent;
|
|
16998
16802
|
|
|
16999
|
-
.k-button-increase {
|
|
17000
|
-
position: absolute;
|
|
17001
|
-
right: 0;
|
|
17002
|
-
top: 0;
|
|
17003
|
-
}
|
|
17004
|
-
|
|
17005
|
-
.k-button-decrease {
|
|
17006
|
-
position: absolute;
|
|
17007
|
-
left: 0;
|
|
17008
|
-
top: 0;
|
|
17009
|
-
}
|
|
17010
|
-
|
|
17011
16803
|
.k-label {
|
|
17012
16804
|
width: auto;
|
|
17013
16805
|
font-size: .92em;
|
|
@@ -17047,30 +16839,33 @@ $slider-disabled-opacity: null !default;
|
|
|
17047
16839
|
left: auto;
|
|
17048
16840
|
right: 0;
|
|
17049
16841
|
}
|
|
16842
|
+
}
|
|
16843
|
+
}
|
|
17050
16844
|
|
|
17051
|
-
.k-button-increase {
|
|
17052
|
-
left: 0;
|
|
17053
|
-
right: auto;
|
|
17054
|
-
}
|
|
17055
16845
|
|
|
17056
|
-
|
|
17057
|
-
|
|
17058
|
-
|
|
17059
|
-
|
|
17060
|
-
|
|
16846
|
+
// Slider wrap
|
|
16847
|
+
.k-slider-wrap {
|
|
16848
|
+
width: 100%;
|
|
16849
|
+
height: 100%;
|
|
16850
|
+
box-sizing: border-box;
|
|
16851
|
+
display: flex;
|
|
16852
|
+
flex-flow: inherit;
|
|
16853
|
+
align-items: inherit;
|
|
16854
|
+
gap: inherit;
|
|
16855
|
+
position: relative;
|
|
17061
16856
|
}
|
|
17062
16857
|
|
|
17063
16858
|
|
|
17064
16859
|
// New rendering
|
|
17065
16860
|
.k-slider {
|
|
16861
|
+
width: min-content;
|
|
16862
|
+
height: min-content;
|
|
17066
16863
|
gap: calc( #{$slider-draghandle-size} / 2 );
|
|
17067
16864
|
|
|
17068
|
-
|
|
17069
|
-
|
|
17070
|
-
flex-shrink: 0;
|
|
17071
|
-
align-self: center;
|
|
16865
|
+
.k-button {
|
|
16866
|
+
flex: none;
|
|
17072
16867
|
}
|
|
17073
|
-
|
|
16868
|
+
.k-slider-track-wrap {
|
|
17074
16869
|
flex: 1 1 auto;
|
|
17075
16870
|
display: flex;
|
|
17076
16871
|
flex-flow: inherit;
|
|
@@ -17078,6 +16873,9 @@ $slider-disabled-opacity: null !default;
|
|
|
17078
16873
|
touch-action: none;
|
|
17079
16874
|
|
|
17080
16875
|
.k-slider-items {
|
|
16876
|
+
margin: 0;
|
|
16877
|
+
padding: 0;
|
|
16878
|
+
list-style: none;
|
|
17081
16879
|
// For some reason, Safari does not understand `flex-basis: 100%`
|
|
17082
16880
|
// See telerik/kendo-themes#2197
|
|
17083
16881
|
// flex-basis: 100%;
|
|
@@ -17085,8 +16883,7 @@ $slider-disabled-opacity: null !default;
|
|
|
17085
16883
|
display: flex;
|
|
17086
16884
|
flex-flow: inherit;
|
|
17087
16885
|
justify-content: space-between;
|
|
17088
|
-
|
|
17089
|
-
&::after { display: none; }
|
|
16886
|
+
user-select: none;
|
|
17090
16887
|
}
|
|
17091
16888
|
.k-tick {
|
|
17092
16889
|
flex: 0 0 1px;
|
|
@@ -17098,7 +16895,8 @@ $slider-disabled-opacity: null !default;
|
|
|
17098
16895
|
}
|
|
17099
16896
|
|
|
17100
16897
|
&-horizontal {
|
|
17101
|
-
|
|
16898
|
+
.k-slider-track-wrap {
|
|
16899
|
+
height: 26px;
|
|
17102
16900
|
|
|
17103
16901
|
.k-slider-track {
|
|
17104
16902
|
width: 100%;
|
|
@@ -17150,7 +16948,8 @@ $slider-disabled-opacity: null !default;
|
|
|
17150
16948
|
}
|
|
17151
16949
|
|
|
17152
16950
|
&-vertical {
|
|
17153
|
-
|
|
16951
|
+
.k-slider-track-wrap {
|
|
16952
|
+
width: 26px;
|
|
17154
16953
|
|
|
17155
16954
|
.k-slider-track {
|
|
17156
16955
|
height: 100%;
|
|
@@ -17183,14 +16982,8 @@ $slider-disabled-opacity: null !default;
|
|
|
17183
16982
|
// Slider vertical
|
|
17184
16983
|
.k-slider-vertical {
|
|
17185
16984
|
height: $slider-size;
|
|
17186
|
-
width: $slider-alt-size;
|
|
17187
16985
|
flex-flow: column-reverse nowrap;
|
|
17188
16986
|
|
|
17189
|
-
.k-button-decrease {
|
|
17190
|
-
bottom: 0;
|
|
17191
|
-
top: auto;
|
|
17192
|
-
}
|
|
17193
|
-
|
|
17194
16987
|
.k-tick {
|
|
17195
16988
|
text-align: right;
|
|
17196
16989
|
margin-left: 2px;
|
|
@@ -17202,32 +16995,32 @@ $slider-disabled-opacity: null !default;
|
|
|
17202
16995
|
|
|
17203
16996
|
// ticks
|
|
17204
16997
|
|
|
17205
|
-
.k-tick { background-position: -
|
|
17206
|
-
.k-slider-topleft .k-tick { background-position: -
|
|
17207
|
-
.k-slider-bottomright .k-tick { background-position: -
|
|
16998
|
+
.k-tick { background-position: -94px center; }
|
|
16999
|
+
.k-slider-topleft .k-tick { background-position: -124px center; }
|
|
17000
|
+
.k-slider-bottomright .k-tick { background-position: -154px center; }
|
|
17208
17001
|
|
|
17209
17002
|
.k-tick-large {
|
|
17210
17003
|
display: flex;
|
|
17211
17004
|
align-items: center;
|
|
17212
|
-
background-position: -
|
|
17005
|
+
background-position: -4px center;
|
|
17213
17006
|
}
|
|
17214
17007
|
|
|
17215
|
-
.k-slider-topleft .k-tick-large { background-position: -
|
|
17216
|
-
.k-slider-bottomright .k-tick-large { background-position: -
|
|
17008
|
+
.k-slider-topleft .k-tick-large { background-position: -34px center; }
|
|
17009
|
+
.k-slider-bottomright .k-tick-large { background-position: -64px center; }
|
|
17217
17010
|
|
|
17218
|
-
.k-first { background-position: -
|
|
17219
|
-
.k-tick-large.k-first { background-position: -
|
|
17220
|
-
.k-slider-topleft .k-first { background-position: -
|
|
17221
|
-
.k-slider-topleft .k-tick-large.k-first { background-position: -
|
|
17222
|
-
.k-slider-bottomright .k-first { background-position: -
|
|
17223
|
-
.k-slider-bottomright .k-tick-large.k-first { background-position: -
|
|
17011
|
+
.k-first { background-position: -94px 100%; }
|
|
17012
|
+
.k-tick-large.k-first { background-position: -4px 100%; }
|
|
17013
|
+
.k-slider-topleft .k-first { background-position: -124px 100%; }
|
|
17014
|
+
.k-slider-topleft .k-tick-large.k-first { background-position: -34px 100%; }
|
|
17015
|
+
.k-slider-bottomright .k-first { background-position: -154px 100%; }
|
|
17016
|
+
.k-slider-bottomright .k-tick-large.k-first { background-position: -64px 100%; }
|
|
17224
17017
|
|
|
17225
|
-
.k-last { background-position: -
|
|
17226
|
-
.k-tick-large.k-last { background-position: -
|
|
17227
|
-
.k-slider-topleft .k-last { background-position: -
|
|
17228
|
-
.k-slider-topleft .k-tick-large.k-last { background-position: -
|
|
17229
|
-
.k-slider-bottomright .k-last { background-position: -
|
|
17230
|
-
.k-slider-bottomright .k-tick-large.k-last { background-position: -
|
|
17018
|
+
.k-last { background-position: -94px 0; }
|
|
17019
|
+
.k-tick-large.k-last { background-position: -4px 0; }
|
|
17020
|
+
.k-slider-topleft .k-last { background-position: -124px 0; }
|
|
17021
|
+
.k-slider-topleft .k-tick-large.k-last { background-position: -34px 0; }
|
|
17022
|
+
.k-slider-bottomright .k-last { background-position: -154px 0; }
|
|
17023
|
+
.k-slider-bottomright .k-tick-large.k-last { background-position: -64px 0; }
|
|
17231
17024
|
|
|
17232
17025
|
// labels
|
|
17233
17026
|
|
|
@@ -17265,17 +17058,9 @@ $slider-disabled-opacity: null !default;
|
|
|
17265
17058
|
|
|
17266
17059
|
// Slider horizontal
|
|
17267
17060
|
.k-slider-horizontal {
|
|
17268
|
-
height: $slider-alt-size;
|
|
17269
17061
|
width: $slider-size;
|
|
17270
17062
|
flex-flow: row nowrap;
|
|
17271
17063
|
|
|
17272
|
-
// ticks
|
|
17273
|
-
.k-tick {
|
|
17274
|
-
float: left;
|
|
17275
|
-
height: 100%;
|
|
17276
|
-
text-align: center;
|
|
17277
|
-
}
|
|
17278
|
-
|
|
17279
17064
|
.k-tick { background-position: center -92px; }
|
|
17280
17065
|
.k-slider-topleft .k-tick { background-position: center -122px; }
|
|
17281
17066
|
.k-slider-bottomright .k-tick { background-position: center -152px; }
|
|
@@ -17321,9 +17106,6 @@ $slider-disabled-opacity: null !default;
|
|
|
17321
17106
|
right: 0;
|
|
17322
17107
|
left: auto;
|
|
17323
17108
|
}
|
|
17324
|
-
.k-slider-buttons .k-slider-track {
|
|
17325
|
-
right: $slider-button-spacing;
|
|
17326
|
-
}
|
|
17327
17109
|
|
|
17328
17110
|
.k-button .k-i-arrow-e,
|
|
17329
17111
|
.k-button .k-i-arrow-w {
|
|
@@ -17332,11 +17114,6 @@ $slider-disabled-opacity: null !default;
|
|
|
17332
17114
|
}
|
|
17333
17115
|
}
|
|
17334
17116
|
|
|
17335
|
-
.k-slider-wrap {
|
|
17336
|
-
height: 100%;
|
|
17337
|
-
width: 100%;
|
|
17338
|
-
}
|
|
17339
|
-
|
|
17340
17117
|
.k-slider-track,
|
|
17341
17118
|
.k-slider-selection {
|
|
17342
17119
|
margin: 0;
|
|
@@ -17358,16 +17135,6 @@ $slider-disabled-opacity: null !default;
|
|
|
17358
17135
|
}
|
|
17359
17136
|
}
|
|
17360
17137
|
|
|
17361
|
-
.k-slider-buttons .k-slider-track {
|
|
17362
|
-
.k-slider-horizontal & {
|
|
17363
|
-
left: $slider-button-spacing;
|
|
17364
|
-
}
|
|
17365
|
-
|
|
17366
|
-
.k-slider-vertical & {
|
|
17367
|
-
bottom: $slider-button-spacing;
|
|
17368
|
-
}
|
|
17369
|
-
}
|
|
17370
|
-
|
|
17371
17138
|
|
|
17372
17139
|
.k-draghandle {
|
|
17373
17140
|
background-color: transparent;
|
|
@@ -17378,30 +17145,10 @@ $slider-disabled-opacity: null !default;
|
|
|
17378
17145
|
position: absolute;
|
|
17379
17146
|
text-align: center;
|
|
17380
17147
|
text-decoration: none;
|
|
17381
|
-
box-sizing:
|
|
17148
|
+
box-sizing: border-box;
|
|
17382
17149
|
width: $slider-draghandle-size;
|
|
17383
17150
|
height: $slider-draghandle-size;
|
|
17384
17151
|
|
|
17385
|
-
.k-slider-horizontal & {
|
|
17386
|
-
top: 50%;
|
|
17387
|
-
transform: translateY(-50%);
|
|
17388
|
-
|
|
17389
|
-
&:active,
|
|
17390
|
-
&.k-pressed {
|
|
17391
|
-
transform: translateY(-50%) scale($slider-draghandle-active-scale);
|
|
17392
|
-
}
|
|
17393
|
-
}
|
|
17394
|
-
|
|
17395
|
-
.k-slider-vertical & {
|
|
17396
|
-
left: 50%;
|
|
17397
|
-
transform: translateX(-50%);
|
|
17398
|
-
|
|
17399
|
-
&:active,
|
|
17400
|
-
&.k-pressed {
|
|
17401
|
-
transform: translateX(-50%) scale($slider-draghandle-active-scale);
|
|
17402
|
-
}
|
|
17403
|
-
}
|
|
17404
|
-
|
|
17405
17152
|
.k-slider-transitions.k-slider-horizontal & {
|
|
17406
17153
|
transition: left $slider-transition-speed $slider-transition-function, background-color $slider-transition-speed $slider-transition-function, transform $slider-draghandle-transition-speed $slider-draghandle-transition-function;
|
|
17407
17154
|
}
|
|
@@ -17430,34 +17177,18 @@ $slider-disabled-opacity: null !default;
|
|
|
17430
17177
|
}
|
|
17431
17178
|
|
|
17432
17179
|
|
|
17433
|
-
|
|
17434
|
-
|
|
17435
|
-
|
|
17436
|
-
.k-slider-
|
|
17437
|
-
|
|
17438
|
-
|
|
17439
|
-
|
|
17440
|
-
.k-slider-horizontal & {
|
|
17441
|
-
height: 100%;
|
|
17442
|
-
padding: 2px 0;
|
|
17443
|
-
box-sizing: border-box;
|
|
17444
|
-
}
|
|
17445
|
-
|
|
17446
|
-
.k-slider-vertical & {
|
|
17447
|
-
padding-top: 1px;
|
|
17448
|
-
}
|
|
17449
|
-
|
|
17450
|
-
.k-slider-vertical .k-slider-buttons & {
|
|
17451
|
-
margin: 0;
|
|
17452
|
-
padding-top: $slider-button-spacing;
|
|
17180
|
+
// Slider readonly
|
|
17181
|
+
.k-slider.k-readonly {
|
|
17182
|
+
.k-button,
|
|
17183
|
+
.k-slider-track,
|
|
17184
|
+
.k-tick,
|
|
17185
|
+
.k-draghandle {
|
|
17186
|
+
pointer-events: none;
|
|
17453
17187
|
}
|
|
17454
17188
|
}
|
|
17455
|
-
.k-slider-items::after {
|
|
17456
|
-
content: "";
|
|
17457
|
-
display: block;
|
|
17458
|
-
clear: both;
|
|
17459
|
-
}
|
|
17460
17189
|
|
|
17190
|
+
|
|
17191
|
+
// Slider tooltip
|
|
17461
17192
|
.k-slider-tooltip {
|
|
17462
17193
|
.k-callout-n,
|
|
17463
17194
|
.k-callout-s {
|
|
@@ -17469,6 +17200,21 @@ $slider-disabled-opacity: null !default;
|
|
|
17469
17200
|
margin-top: -$tooltip-callout-size / 2;
|
|
17470
17201
|
}
|
|
17471
17202
|
}
|
|
17203
|
+
|
|
17204
|
+
|
|
17205
|
+
// Angular specific
|
|
17206
|
+
.k-slider kendo-resize-sensor {
|
|
17207
|
+
position: absolute;
|
|
17208
|
+
}
|
|
17209
|
+
.k-slider-horizontal .k-slider-wrap:not(.k-slider-buttons) {
|
|
17210
|
+
padding-left: calc( #{$slider-draghandle-size} / 2 );
|
|
17211
|
+
padding-right: calc( #{$slider-draghandle-size} / 2 );
|
|
17212
|
+
}
|
|
17213
|
+
.k-slider-vertical .k-slider-wrap:not(.k-slider-buttons) {
|
|
17214
|
+
padding-top: calc( #{$slider-draghandle-size} / 2 );
|
|
17215
|
+
padding-bottom: calc( #{$slider-draghandle-size} / 2 );
|
|
17216
|
+
}
|
|
17217
|
+
|
|
17472
17218
|
}
|
|
17473
17219
|
|
|
17474
17220
|
// #endregion
|
|
@@ -17539,12 +17285,6 @@ $slider-disabled-opacity: null !default;
|
|
|
17539
17285
|
&.k-state-disabled {
|
|
17540
17286
|
opacity: $slider-disabled-opacity;
|
|
17541
17287
|
}
|
|
17542
|
-
|
|
17543
|
-
.k-slider-wrap {
|
|
17544
|
-
&:focus {
|
|
17545
|
-
outline: none;
|
|
17546
|
-
}
|
|
17547
|
-
}
|
|
17548
17288
|
}
|
|
17549
17289
|
|
|
17550
17290
|
.k-slider-horizontal .k-tick {
|
|
@@ -17998,7 +17738,7 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
|
|
|
17998
17738
|
display: block;
|
|
17999
17739
|
position: absolute;
|
|
18000
17740
|
bottom: 0;
|
|
18001
|
-
content: "
|
|
17741
|
+
content: "\200b";
|
|
18002
17742
|
height: 0;
|
|
18003
17743
|
line-height: 0;
|
|
18004
17744
|
z-index: 1;
|
|
@@ -18036,7 +17776,7 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
|
|
|
18036
17776
|
&::after {
|
|
18037
17777
|
display: block;
|
|
18038
17778
|
position: absolute;
|
|
18039
|
-
content: "
|
|
17779
|
+
content: "\200b";
|
|
18040
17780
|
height: 0;
|
|
18041
17781
|
line-height: 0;
|
|
18042
17782
|
z-index: 1;
|
|
@@ -18594,7 +18334,7 @@ $time-list-focused-bg: rgba(0, 0, 0, .02) !default;
|
|
|
18594
18334
|
&::before,
|
|
18595
18335
|
&::after {
|
|
18596
18336
|
display: block;
|
|
18597
|
-
content: "
|
|
18337
|
+
content: "\200b";
|
|
18598
18338
|
position: absolute;
|
|
18599
18339
|
width: 100%;
|
|
18600
18340
|
left: 0;
|
|
@@ -18624,13 +18364,14 @@ $time-list-focused-bg: rgba(0, 0, 0, .02) !default;
|
|
|
18624
18364
|
flex: 1;
|
|
18625
18365
|
position: relative;
|
|
18626
18366
|
z-index: 1;
|
|
18367
|
+
outline: 0;
|
|
18627
18368
|
overflow: hidden;
|
|
18628
18369
|
|
|
18629
18370
|
&::before,
|
|
18630
18371
|
&::after {
|
|
18631
18372
|
display: block;
|
|
18632
18373
|
position: absolute;
|
|
18633
|
-
content: "
|
|
18374
|
+
content: "\200b";
|
|
18634
18375
|
height: 0;
|
|
18635
18376
|
line-height: 0;
|
|
18636
18377
|
z-index: 1;
|
|
@@ -18810,25 +18551,6 @@ $time-list-focused-bg: rgba(0, 0, 0, .02) !default;
|
|
|
18810
18551
|
// Component
|
|
18811
18552
|
// #region @import "_variables.scss"; -> packages/bootstrap/scss/autocomplete/_variables.scss
|
|
18812
18553
|
// Autocomplete
|
|
18813
|
-
$autocomplete-bg: $kendo-input-bg !default;
|
|
18814
|
-
$autocomplete-text: $kendo-input-text !default;
|
|
18815
|
-
$autocomplete-border: $kendo-input-border !default;
|
|
18816
|
-
$autocomplete-shadow: $kendo-input-shadow !default;
|
|
18817
|
-
|
|
18818
|
-
$autocomplete-hovered-bg: $kendo-input-hover-bg !default;
|
|
18819
|
-
$autocomplete-hovered-text: $kendo-input-hover-text !default;
|
|
18820
|
-
$autocomplete-hovered-border: $kendo-input-hover-border !default;
|
|
18821
|
-
$autocomplete-hovered-shadow: $kendo-input-hover-shadow !default;
|
|
18822
|
-
|
|
18823
|
-
$autocomplete-focused-bg: $kendo-input-focus-bg !default;
|
|
18824
|
-
$autocomplete-focused-text: $kendo-input-focus-text !default;
|
|
18825
|
-
$autocomplete-focused-border: $kendo-input-focus-border !default;
|
|
18826
|
-
$autocomplete-focused-shadow: $kendo-input-focus-shadow !default;
|
|
18827
|
-
|
|
18828
|
-
$autocomplete-disabled-bg: null !default;
|
|
18829
|
-
$autocomplete-disabled-text: null !default;
|
|
18830
|
-
$autocomplete-disabled-border: null !default;
|
|
18831
|
-
$autocomplete-disabled-shadow: null !default;
|
|
18832
18554
|
|
|
18833
18555
|
// #endregion
|
|
18834
18556
|
// #region @import "_layout.scss"; -> packages/bootstrap/scss/autocomplete/_layout.scss
|
|
@@ -18845,7 +18567,7 @@ $autocomplete-disabled-shadow: null !default;
|
|
|
18845
18567
|
// #endregion
|
|
18846
18568
|
// #region @import "_theme.scss"; -> packages/bootstrap/scss/autocomplete/_theme.scss
|
|
18847
18569
|
// #region @import "~@progress/kendo-theme-default/scss/autocomplete/_theme.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/autocomplete/_theme.scss
|
|
18848
|
-
@include exports("autocomplete/theme") {
|
|
18570
|
+
@include exports( "autocomplete/theme" ) {
|
|
18849
18571
|
|
|
18850
18572
|
// Autocomplete
|
|
18851
18573
|
.k-autocomplete {}
|
|
@@ -19367,10 +19089,6 @@ $colorgradient-contrast-spacer: ( $colorgradient-spacer / 2 ) !default;
|
|
|
19367
19089
|
z-index: 1;
|
|
19368
19090
|
}
|
|
19369
19091
|
|
|
19370
|
-
.k-slider-wrap > .k-slider-track {
|
|
19371
|
-
height: $colorgradient-slider-vertical-size;
|
|
19372
|
-
}
|
|
19373
|
-
|
|
19374
19092
|
.k-slider-selection {
|
|
19375
19093
|
display: none;
|
|
19376
19094
|
}
|
|
@@ -19740,10 +19458,15 @@ $coloreditor-views-gap: $coloreditor-spacer !default;
|
|
|
19740
19458
|
@include exports( "colorpicker/layout" ) {
|
|
19741
19459
|
|
|
19742
19460
|
// Color picker
|
|
19743
|
-
.k-
|
|
19461
|
+
.k-color-picker {
|
|
19744
19462
|
width: min-content;
|
|
19745
19463
|
}
|
|
19746
19464
|
|
|
19465
|
+
// Alias
|
|
19466
|
+
.k-colorpicker {
|
|
19467
|
+
@extend .k-color-picker;
|
|
19468
|
+
}
|
|
19469
|
+
|
|
19747
19470
|
}
|
|
19748
19471
|
|
|
19749
19472
|
// #endregion
|
|
@@ -19754,7 +19477,7 @@ $coloreditor-views-gap: $coloreditor-spacer !default;
|
|
|
19754
19477
|
@include exports( "colorpicker/theme" ) {
|
|
19755
19478
|
|
|
19756
19479
|
// Color picker
|
|
19757
|
-
.k-
|
|
19480
|
+
.k-color-picker {}
|
|
19758
19481
|
|
|
19759
19482
|
}
|
|
19760
19483
|
|
|
@@ -20055,6 +19778,21 @@ $datetime-width: calc( #{$calendar-cell-size * 8} + #{$infinite-calendar-view-pa
|
|
|
20055
19778
|
}
|
|
20056
19779
|
|
|
20057
19780
|
|
|
19781
|
+
// Angular specific
|
|
19782
|
+
kendo-daterange {
|
|
19783
|
+
// @extend .k-daterangepicker;
|
|
19784
|
+
}
|
|
19785
|
+
|
|
19786
|
+
|
|
19787
|
+
// React specific
|
|
19788
|
+
.k-daterangepicker-wrap {
|
|
19789
|
+
display: inherit;
|
|
19790
|
+
flex-flow: inherit;
|
|
19791
|
+
align-items: inherit;
|
|
19792
|
+
gap: inherit;
|
|
19793
|
+
}
|
|
19794
|
+
|
|
19795
|
+
|
|
20058
19796
|
// Alias
|
|
20059
19797
|
.k-daterangepicker {
|
|
20060
19798
|
@extend .k-daterange-picker;
|
|
@@ -20484,13 +20222,28 @@ $dropdownlist-focused-shadow: $kendo-button-focus-shadow !default;
|
|
|
20484
20222
|
// Dropdown operator
|
|
20485
20223
|
.k-dropdown-operator {
|
|
20486
20224
|
width: min-content;
|
|
20225
|
+
flex: none;
|
|
20487
20226
|
aspect-ratio: 1;
|
|
20488
20227
|
|
|
20228
|
+
.k-input-button {
|
|
20229
|
+
border-width: 0;
|
|
20230
|
+
}
|
|
20231
|
+
.k-input-button .k-button-icon {
|
|
20232
|
+
width: auto;
|
|
20233
|
+
aspect-ratio: 1;
|
|
20234
|
+
}
|
|
20235
|
+
|
|
20489
20236
|
.k-input-inner {
|
|
20490
20237
|
display: none;
|
|
20491
20238
|
}
|
|
20492
20239
|
}
|
|
20493
20240
|
|
|
20241
|
+
// Alias
|
|
20242
|
+
.k-dropdown,
|
|
20243
|
+
.k-dropdownlist {
|
|
20244
|
+
@extend .k-dropdown-list !optional;
|
|
20245
|
+
}
|
|
20246
|
+
|
|
20494
20247
|
}
|
|
20495
20248
|
|
|
20496
20249
|
// #endregion
|
|
@@ -20618,30 +20371,30 @@ $dropdownlist-focused-shadow: $kendo-button-focus-shadow !default;
|
|
|
20618
20371
|
// #region @import "_variables.scss"; -> packages/bootstrap/scss/treeview/_variables.scss
|
|
20619
20372
|
// Treeview
|
|
20620
20373
|
|
|
20621
|
-
///
|
|
20374
|
+
/// Font family of the treeview component.
|
|
20622
20375
|
/// @group treeview
|
|
20623
20376
|
$kendo-treeview-font-family: $font-family !default;
|
|
20624
|
-
///
|
|
20377
|
+
/// Font size of the treeview component.
|
|
20625
20378
|
/// @group treeview
|
|
20626
|
-
$kendo-treeview-font-size: $font-size !default;
|
|
20627
|
-
///
|
|
20379
|
+
$kendo-treeview-font-size: $font-size-md !default;
|
|
20380
|
+
/// Line height of the treeview component.
|
|
20628
20381
|
/// @group treeview
|
|
20629
20382
|
$kendo-treeview-line-height: $line-height !default;
|
|
20630
20383
|
|
|
20631
|
-
///
|
|
20384
|
+
/// Indentation of child groups in treeview component.
|
|
20632
20385
|
/// @group treeview
|
|
20633
20386
|
$kendo-treeview-indent: 16px !default;
|
|
20634
20387
|
|
|
20635
|
-
///
|
|
20388
|
+
/// Horizontal padding of treeview items.
|
|
20636
20389
|
/// @group treeview
|
|
20637
20390
|
$kendo-treeview-item-padding-x: map-get( $spacing, 3 ) !default;
|
|
20638
|
-
///
|
|
20391
|
+
/// Vertical padding of treeview items.
|
|
20639
20392
|
/// @group treeview
|
|
20640
|
-
$kendo-treeview-item-padding-y: ( $
|
|
20641
|
-
///
|
|
20393
|
+
$kendo-treeview-item-padding-y: map-get( $spacing, 1 ) !default;
|
|
20394
|
+
/// Border width of treeview items.
|
|
20642
20395
|
/// @group treeview
|
|
20643
|
-
$kendo-treeview-item-border-width:
|
|
20644
|
-
///
|
|
20396
|
+
$kendo-treeview-item-border-width: 0px !default;
|
|
20397
|
+
/// Border radius of treeview items.
|
|
20645
20398
|
/// @group treeview
|
|
20646
20399
|
$kendo-treeview-item-border-radius: map-get( $spacing, 1 ) !default;
|
|
20647
20400
|
|
|
@@ -20650,96 +20403,96 @@ $kendo-treeview-item-border-radius: map-get( $spacing, 1 ) !default;
|
|
|
20650
20403
|
/// @group treeview
|
|
20651
20404
|
$kendo-treeview-sizes: (
|
|
20652
20405
|
sm: (
|
|
20653
|
-
font-size:
|
|
20654
|
-
line-height: $line-height,
|
|
20655
|
-
item-padding-x: map-get( $spacing,
|
|
20656
|
-
item-padding-y: map-get( $spacing, 1 )
|
|
20406
|
+
font-size: $font-size-md,
|
|
20407
|
+
line-height: $line-height-md,
|
|
20408
|
+
item-padding-x: map-get( $spacing, 3 ),
|
|
20409
|
+
item-padding-y: map-get( $spacing, 1 ) - map-get( $spacing, thin )
|
|
20657
20410
|
),
|
|
20658
20411
|
md: (
|
|
20659
|
-
font-size: $font-size,
|
|
20660
|
-
line-height: $line-height,
|
|
20661
|
-
item-padding-x: map-get( $spacing,
|
|
20662
|
-
item-padding-y: map-get( $spacing,
|
|
20412
|
+
font-size: $font-size-md,
|
|
20413
|
+
line-height: $line-height-md,
|
|
20414
|
+
item-padding-x: map-get( $spacing, 3 ),
|
|
20415
|
+
item-padding-y: map-get( $spacing, 1 )
|
|
20663
20416
|
),
|
|
20664
20417
|
lg: (
|
|
20665
|
-
font-size:
|
|
20666
|
-
line-height: $line-height,
|
|
20667
|
-
item-padding-x: map-get( $spacing,
|
|
20668
|
-
item-padding-y: map-get( $spacing,
|
|
20418
|
+
font-size: $font-size-md,
|
|
20419
|
+
line-height: $line-height-md,
|
|
20420
|
+
item-padding-x: map-get( $spacing, 3 ),
|
|
20421
|
+
item-padding-y: map-get( $spacing, 1 ) + map-get( $spacing, thin )
|
|
20669
20422
|
)
|
|
20670
20423
|
) !default;
|
|
20671
20424
|
|
|
20672
20425
|
|
|
20673
|
-
///
|
|
20426
|
+
/// Background color of the treeview component.
|
|
20674
20427
|
/// @group treeview
|
|
20675
20428
|
$kendo-treeview-bg: null !default;
|
|
20676
|
-
///
|
|
20429
|
+
/// Text color of the treeview component.
|
|
20677
20430
|
/// @group treeview
|
|
20678
20431
|
$kendo-treeview-text: $component-text !default;
|
|
20679
|
-
///
|
|
20432
|
+
/// Border color of the treeview component.
|
|
20680
20433
|
/// @group treeview
|
|
20681
20434
|
$kendo-treeview-border: null !default;
|
|
20682
20435
|
|
|
20683
|
-
///
|
|
20436
|
+
/// Background color of hovered treeview items.
|
|
20684
20437
|
/// @group treeview
|
|
20685
20438
|
$kendo-treeview-item-hover-bg: $hovered-bg !default;
|
|
20686
|
-
///
|
|
20439
|
+
/// Text color of hovered treeview items.
|
|
20687
20440
|
/// @group treeview
|
|
20688
20441
|
$kendo-treeview-item-hover-text: $hovered-text !default;
|
|
20689
|
-
///
|
|
20442
|
+
/// Border color of hovered treeview items.
|
|
20690
20443
|
/// @group treeview
|
|
20691
20444
|
$kendo-treeview-item-hover-border: $kendo-treeview-item-hover-bg !default;
|
|
20692
|
-
///
|
|
20445
|
+
/// Background gradient of hovered treeview items.
|
|
20693
20446
|
/// @group treeview
|
|
20694
20447
|
$kendo-treeview-item-hover-gradient: null !default;
|
|
20695
20448
|
|
|
20696
|
-
///
|
|
20449
|
+
/// Background color of selected treeview items.
|
|
20697
20450
|
/// @group treeview
|
|
20698
20451
|
$kendo-treeview-item-selected-bg: $selected-bg !default;
|
|
20699
|
-
///
|
|
20452
|
+
/// Text color of selected treeview items.
|
|
20700
20453
|
/// @group treeview
|
|
20701
20454
|
$kendo-treeview-item-selected-text: $selected-text !default;
|
|
20702
|
-
///
|
|
20455
|
+
/// Border color of selected treeview items.
|
|
20703
20456
|
/// @group treeview
|
|
20704
20457
|
$kendo-treeview-item-selected-border: $kendo-treeview-item-selected-bg !default;
|
|
20705
|
-
///
|
|
20458
|
+
/// Background gradient of selected treeview items.
|
|
20706
20459
|
/// @group treeview
|
|
20707
20460
|
$kendo-treeview-item-selected-gradient: null !default;
|
|
20708
20461
|
|
|
20709
|
-
///
|
|
20462
|
+
/// Box shadow of focused treeview items.
|
|
20710
20463
|
/// @group treeview
|
|
20711
20464
|
$kendo-treeview-item-focus-shadow: inset 0 0 0 2px rgba( $kendo-treeview-text, .15 ) !default;
|
|
20712
20465
|
|
|
20713
|
-
///
|
|
20466
|
+
/// Background color of load more.
|
|
20714
20467
|
/// @group treeview
|
|
20715
20468
|
$kendo-treeview-loadmore-bg: transparent !default;
|
|
20716
|
-
///
|
|
20469
|
+
/// Text color of load more.
|
|
20717
20470
|
/// @group treeview
|
|
20718
20471
|
$kendo-treeview-loadmore-text: $link-text !default;
|
|
20719
|
-
///
|
|
20472
|
+
/// Border color of load more.
|
|
20720
20473
|
/// @group treeview
|
|
20721
20474
|
$kendo-treeview-loadmore-border: null !default;
|
|
20722
20475
|
|
|
20723
|
-
///
|
|
20476
|
+
/// Background color of a hovered load more.
|
|
20724
20477
|
/// @group treeview
|
|
20725
20478
|
$kendo-treeview-loadmore-hover-bg: transparent !default;
|
|
20726
|
-
///
|
|
20479
|
+
/// Text color of a hovered load more.
|
|
20727
20480
|
/// @group treeview
|
|
20728
20481
|
$kendo-treeview-loadmore-hover-text: $link-hover-text !default;
|
|
20729
|
-
///
|
|
20482
|
+
/// Border color of a hovered load more.
|
|
20730
20483
|
/// @group treeview
|
|
20731
20484
|
$kendo-treeview-loadmore-hover-border: null !default;
|
|
20732
20485
|
|
|
20733
|
-
///
|
|
20486
|
+
/// Background color of a focused load more.
|
|
20734
20487
|
/// @group treeview
|
|
20735
20488
|
$kendo-treeview-loadmore-focus-bg: transparent !default;
|
|
20736
|
-
///
|
|
20489
|
+
/// Text color of a focused load more.
|
|
20737
20490
|
/// @group treeview
|
|
20738
20491
|
$kendo-treeview-loadmore-focus-text: $link-hover-text !default;
|
|
20739
|
-
///
|
|
20492
|
+
/// Border color of a focused load more.
|
|
20740
20493
|
/// @group treeview
|
|
20741
20494
|
$kendo-treeview-loadmore-focus-border: null !default;
|
|
20742
|
-
///
|
|
20495
|
+
/// Box shadow of a focused load more.
|
|
20743
20496
|
/// @group treeview
|
|
20744
20497
|
$kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !default;
|
|
20745
20498
|
|
|
@@ -20756,6 +20509,8 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
20756
20509
|
box-sizing: border-box;
|
|
20757
20510
|
outline: 0;
|
|
20758
20511
|
font-family: $kendo-treeview-font-family;
|
|
20512
|
+
font-size: $kendo-treeview-font-size;
|
|
20513
|
+
line-height: $kendo-treeview-line-height;
|
|
20759
20514
|
display: block;
|
|
20760
20515
|
cursor: default;
|
|
20761
20516
|
overflow: auto;
|
|
@@ -20765,9 +20520,18 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
20765
20520
|
}
|
|
20766
20521
|
|
|
20767
20522
|
|
|
20523
|
+
// Treeview filter
|
|
20524
|
+
.k-treeview-filter {
|
|
20525
|
+
padding: map-get( $spacing, 1 );
|
|
20526
|
+
box-sizing: border-box;
|
|
20527
|
+
display: block;
|
|
20528
|
+
position: relative;
|
|
20529
|
+
flex: none;
|
|
20530
|
+
}
|
|
20531
|
+
|
|
20532
|
+
|
|
20768
20533
|
// Treeview group
|
|
20769
|
-
.k-treeview-group
|
|
20770
|
-
.k-treeview .k-group {
|
|
20534
|
+
.k-treeview-group {
|
|
20771
20535
|
margin: 0;
|
|
20772
20536
|
padding: 0;
|
|
20773
20537
|
list-style: none;
|
|
@@ -20810,11 +20574,6 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
20810
20574
|
flex-flow: row nowrap;
|
|
20811
20575
|
align-items: center;
|
|
20812
20576
|
cursor: pointer;
|
|
20813
|
-
|
|
20814
|
-
+ .k-checkbox-wrap,
|
|
20815
|
-
+ .k-checkbox-wrapper {
|
|
20816
|
-
margin-left: $icon-spacing;
|
|
20817
|
-
}
|
|
20818
20577
|
}
|
|
20819
20578
|
|
|
20820
20579
|
|
|
@@ -20827,13 +20586,16 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
20827
20586
|
// Checkbox
|
|
20828
20587
|
.k-treeview .k-checkbox-wrap,
|
|
20829
20588
|
.k-treeview .k-checkbox-wrapper {
|
|
20589
|
+
margin-left: $icon-spacing;
|
|
20830
20590
|
margin-right: $icon-spacing;
|
|
20591
|
+
align-self: center;
|
|
20831
20592
|
}
|
|
20832
20593
|
|
|
20833
20594
|
|
|
20834
20595
|
// Treeview leaf
|
|
20835
20596
|
.k-treeview-leaf {
|
|
20836
20597
|
@include border-radius( $kendo-treeview-item-border-radius );
|
|
20598
|
+
padding: $kendo-treeview-item-padding-y $kendo-treeview-item-padding-x;
|
|
20837
20599
|
border: $kendo-treeview-item-border-width solid transparent;
|
|
20838
20600
|
text-decoration: none;
|
|
20839
20601
|
display: inline-flex;
|
|
@@ -20848,8 +20610,7 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
20848
20610
|
margin-right: $icon-spacing;
|
|
20849
20611
|
}
|
|
20850
20612
|
|
|
20851
|
-
&.k-
|
|
20852
|
-
&.k-state-focused {
|
|
20613
|
+
&.k-focus {
|
|
20853
20614
|
z-index: 1;
|
|
20854
20615
|
}
|
|
20855
20616
|
}
|
|
@@ -20860,10 +20621,9 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
20860
20621
|
cursor: pointer;
|
|
20861
20622
|
|
|
20862
20623
|
&:hover,
|
|
20863
|
-
&.k-
|
|
20624
|
+
&.k-hover,
|
|
20864
20625
|
&:focus,
|
|
20865
|
-
&.k-
|
|
20866
|
-
&.k-state-focused {
|
|
20626
|
+
&.k-focus {
|
|
20867
20627
|
text-decoration: underline;
|
|
20868
20628
|
}
|
|
20869
20629
|
}
|
|
@@ -20883,11 +20643,6 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
20883
20643
|
.k-treeview-toggle {
|
|
20884
20644
|
margin-left: 0;
|
|
20885
20645
|
margin-right: -$kendo-treeview-indent;
|
|
20886
|
-
|
|
20887
|
-
+ .k-checkbox-wrap,
|
|
20888
|
-
+ .k-checkbox-wrapper {
|
|
20889
|
-
margin-right: $icon-spacing;
|
|
20890
|
-
}
|
|
20891
20646
|
}
|
|
20892
20647
|
|
|
20893
20648
|
// Loading
|
|
@@ -20896,13 +20651,6 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
20896
20651
|
margin-left: $icon-spacing;
|
|
20897
20652
|
}
|
|
20898
20653
|
|
|
20899
|
-
// Checkbox
|
|
20900
|
-
.k-checkbox-wrap,
|
|
20901
|
-
.k-checkbox-wrapper {
|
|
20902
|
-
margin-right: 0;
|
|
20903
|
-
margin-left: $icon-spacing;
|
|
20904
|
-
}
|
|
20905
|
-
|
|
20906
20654
|
// Treeview leaf
|
|
20907
20655
|
.k-treeview-leaf,
|
|
20908
20656
|
.k-in {
|
|
@@ -20926,10 +20674,11 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
20926
20674
|
line-height: $_line-height;
|
|
20927
20675
|
|
|
20928
20676
|
.k-treeview-leaf {
|
|
20929
|
-
padding: $_item-padding-
|
|
20677
|
+
padding: $_item-padding-y $_item-padding-x;
|
|
20930
20678
|
}
|
|
20931
20679
|
}
|
|
20932
20680
|
}
|
|
20681
|
+
|
|
20933
20682
|
}
|
|
20934
20683
|
|
|
20935
20684
|
// #endregion
|
|
@@ -21027,6 +20776,7 @@ $kendo-treeview-loadmore-focus-shadow: $kendo-treeview-item-focus-shadow !defaul
|
|
|
21027
20776
|
@include box-shadow( $kendo-treeview-loadmore-focus-shadow );
|
|
21028
20777
|
}
|
|
21029
20778
|
}
|
|
20779
|
+
|
|
21030
20780
|
}
|
|
21031
20781
|
|
|
21032
20782
|
// #endregion
|
|
@@ -22704,7 +22454,7 @@ $upload-focused-shadow: 0 0 0 2px rgba(0, 0, 0, .13) !default;
|
|
|
22704
22454
|
$appbar-margin-y: null !default;
|
|
22705
22455
|
$appbar-margin-x: null !default;
|
|
22706
22456
|
$appbar-padding-y: map-get( $spacing, 2 ) !default;
|
|
22707
|
-
$appbar-padding-x: map-get( $spacing,
|
|
22457
|
+
$appbar-padding-x: map-get( $spacing, 2 ) !default;
|
|
22708
22458
|
$appbar-border-width: 0px !default;
|
|
22709
22459
|
|
|
22710
22460
|
$appbar-zindex: 1000 !default;
|
|
@@ -22782,9 +22532,12 @@ $appbar-bottom-box-shadow: 0px -1px 1px rgba(0, 0, 0, .16) !default;
|
|
|
22782
22532
|
|
|
22783
22533
|
// Input
|
|
22784
22534
|
.k-input,
|
|
22785
|
-
.k-picker
|
|
22535
|
+
.k-picker {
|
|
22786
22536
|
width: 10em;
|
|
22787
22537
|
}
|
|
22538
|
+
.k-color-picker {
|
|
22539
|
+
width: min-content;
|
|
22540
|
+
}
|
|
22788
22541
|
|
|
22789
22542
|
}
|
|
22790
22543
|
|
|
@@ -24353,10 +24106,10 @@ $actionsheet-item-disabled-shadow: null !default;
|
|
|
24353
24106
|
margin-top: -($window-inner-padding-y / 2);
|
|
24354
24107
|
}
|
|
24355
24108
|
.k-window-content:first-child {
|
|
24356
|
-
padding-top:
|
|
24109
|
+
padding-top: clamp( #{$window-inner-padding-y}, #{$window-titlebar-padding-y}, #{$window-titlebar-padding-y} );
|
|
24357
24110
|
}
|
|
24358
24111
|
.k-window-content:last-child {
|
|
24359
|
-
padding-bottom:
|
|
24112
|
+
padding-bottom: clamp( #{$window-inner-padding-y}, #{$window-titlebar-padding-y}, #{$window-titlebar-padding-y} );
|
|
24360
24113
|
}
|
|
24361
24114
|
|
|
24362
24115
|
.k-window-iframecontent {
|
|
@@ -24386,6 +24139,16 @@ $actionsheet-item-disabled-shadow: null !default;
|
|
|
24386
24139
|
overflow: hidden;
|
|
24387
24140
|
}
|
|
24388
24141
|
|
|
24142
|
+
|
|
24143
|
+
// Prompt
|
|
24144
|
+
.k-prompt-container {
|
|
24145
|
+
|
|
24146
|
+
> .k-textarea {
|
|
24147
|
+
width: 100%;
|
|
24148
|
+
}
|
|
24149
|
+
|
|
24150
|
+
}
|
|
24151
|
+
|
|
24389
24152
|
// Resize Handles
|
|
24390
24153
|
.k-window {
|
|
24391
24154
|
.k-resize-n { top: 0; }
|
|
@@ -27891,7 +27654,7 @@ $tabstrip-content-border-focused: $component-text !default;
|
|
|
27891
27654
|
color: inherit;
|
|
27892
27655
|
background-color: transparent;
|
|
27893
27656
|
display: flex;
|
|
27894
|
-
flex-
|
|
27657
|
+
flex-flow: column nowrap;
|
|
27895
27658
|
-webkit-touch-callout: none;
|
|
27896
27659
|
-webkit-tap-highlight-color: $rgba-transparent;
|
|
27897
27660
|
|
|
@@ -27984,6 +27747,9 @@ $tabstrip-content-border-focused: $component-text !default;
|
|
|
27984
27747
|
left: 0;
|
|
27985
27748
|
transition: width .2s linear;
|
|
27986
27749
|
|
|
27750
|
+
// TODO: a better name
|
|
27751
|
+
display: none;
|
|
27752
|
+
|
|
27987
27753
|
&.k-complete {
|
|
27988
27754
|
width: 100%;
|
|
27989
27755
|
border-top-width: 0;
|
|
@@ -27997,6 +27763,7 @@ $tabstrip-content-border-focused: $component-text !default;
|
|
|
27997
27763
|
|
|
27998
27764
|
> .k-tabstrip-items {
|
|
27999
27765
|
flex: 1 1 auto;
|
|
27766
|
+
flex-wrap: nowrap;
|
|
28000
27767
|
white-space: nowrap;
|
|
28001
27768
|
overflow: hidden;
|
|
28002
27769
|
}
|
|
@@ -29831,14 +29598,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
29831
29598
|
}
|
|
29832
29599
|
}
|
|
29833
29600
|
|
|
29834
|
-
.k-grid-filter-menu {
|
|
29835
|
-
|
|
29836
|
-
.k-filter-selected-items {
|
|
29837
|
-
margin: 1em;
|
|
29838
|
-
font-weight: normal;
|
|
29839
|
-
}
|
|
29840
|
-
}
|
|
29841
|
-
|
|
29842
29601
|
.k-grid-edit-form {
|
|
29843
29602
|
|
|
29844
29603
|
.k-popup-edit-form,
|
|
@@ -29847,7 +29606,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
29847
29606
|
min-width: auto;
|
|
29848
29607
|
}
|
|
29849
29608
|
}
|
|
29850
|
-
|
|
29851
29609
|
}
|
|
29852
29610
|
|
|
29853
29611
|
.k-grid.k-grid-mobile {
|
|
@@ -30114,29 +29872,8 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
30114
29872
|
|
|
30115
29873
|
.k-pane-wrapper {
|
|
30116
29874
|
|
|
30117
|
-
.k-
|
|
30118
|
-
|
|
30119
|
-
.k-grid-filter-menu,
|
|
30120
|
-
.k-scheduler-edit-form {
|
|
30121
|
-
|
|
30122
|
-
> .k-header {
|
|
30123
|
-
display: flex;
|
|
30124
|
-
justify-content: space-between;
|
|
30125
|
-
padding: .3em .6em;
|
|
30126
|
-
width: auto;
|
|
30127
|
-
line-height: 2em;
|
|
30128
|
-
|
|
30129
|
-
.k-header-done,
|
|
30130
|
-
.k-header-cancel {
|
|
30131
|
-
display: flex;
|
|
30132
|
-
flex-direction: row;
|
|
30133
|
-
align-items: center;
|
|
30134
|
-
|
|
30135
|
-
.k-icon {
|
|
30136
|
-
font-size: 1.5em;
|
|
30137
|
-
}
|
|
30138
|
-
}
|
|
30139
|
-
}
|
|
29875
|
+
.k-appbar {
|
|
29876
|
+
padding: map-get( $spacing, 1 );
|
|
30140
29877
|
}
|
|
30141
29878
|
|
|
30142
29879
|
.k-list-title,
|
|
@@ -30145,6 +29882,12 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
30145
29882
|
display: block;
|
|
30146
29883
|
}
|
|
30147
29884
|
|
|
29885
|
+
.k-listgroup-title {
|
|
29886
|
+
padding: $listgroup-item-padding-y $listgroup-item-padding-x;
|
|
29887
|
+
font-weight: bold;
|
|
29888
|
+
text-transform: uppercase;
|
|
29889
|
+
}
|
|
29890
|
+
|
|
30148
29891
|
.k-listgroup {
|
|
30149
29892
|
|
|
30150
29893
|
.k-listgroup-item {
|
|
@@ -30152,23 +29895,56 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
30152
29895
|
}
|
|
30153
29896
|
}
|
|
30154
29897
|
.k-listgroup + .k-listgroup {
|
|
30155
|
-
margin-top:
|
|
29898
|
+
margin-top: map-get( $spacing, 4 );
|
|
30156
29899
|
}
|
|
30157
29900
|
|
|
30158
29901
|
// Column menu
|
|
30159
29902
|
.k-column-menu {
|
|
29903
|
+
padding: map-get( $spacing, 2 );
|
|
29904
|
+
display: flex;
|
|
29905
|
+
flex-flow: column nowrap;
|
|
29906
|
+
gap: map-get( $spacing, 2 );
|
|
30160
29907
|
|
|
30161
29908
|
.k-filter-item .k-filterable * {
|
|
30162
29909
|
pointer-events: none;
|
|
30163
29910
|
}
|
|
29911
|
+
|
|
29912
|
+
.k-list-title,
|
|
29913
|
+
.k-listgroup-title {
|
|
29914
|
+
padding: 0;
|
|
29915
|
+
}
|
|
29916
|
+
|
|
29917
|
+
.k-listgroup {
|
|
29918
|
+
margin-inline: -#{map-get( $spacing, 2 )};
|
|
29919
|
+
}
|
|
30164
29920
|
}
|
|
30165
29921
|
|
|
30166
29922
|
// Filter menu
|
|
30167
29923
|
.k-filter-menu {
|
|
29924
|
+
padding: map-get( $spacing, 2 );
|
|
29925
|
+
display: flex;
|
|
29926
|
+
flex-flow: column nowrap;
|
|
29927
|
+
gap: map-get( $spacing, 2 );
|
|
29928
|
+
|
|
29929
|
+
.k-list-title {
|
|
29930
|
+
padding: 0;
|
|
29931
|
+
}
|
|
29932
|
+
|
|
29933
|
+
.k-list-filter {
|
|
29934
|
+
padding: 0;
|
|
29935
|
+
display: flex;
|
|
29936
|
+
flex-flow: column nowrap;
|
|
29937
|
+
gap: inherit;
|
|
29938
|
+
}
|
|
29939
|
+
|
|
30168
29940
|
.k-filter-tools {
|
|
30169
|
-
margin: 1em;
|
|
30170
29941
|
display: flex;
|
|
30171
|
-
|
|
29942
|
+
flex-flow: row nowrap;
|
|
29943
|
+
gap: inherit;
|
|
29944
|
+
}
|
|
29945
|
+
|
|
29946
|
+
.k-listgroup {
|
|
29947
|
+
margin-inline: -#{map-get( $spacing, 2 )};
|
|
30172
29948
|
}
|
|
30173
29949
|
}
|
|
30174
29950
|
|
|
@@ -30192,7 +29968,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
30192
29968
|
}
|
|
30193
29969
|
|
|
30194
29970
|
// Pager
|
|
30195
|
-
|
|
30196
29971
|
.k-pager-wrap.k-pager-sm {
|
|
30197
29972
|
justify-content: center;
|
|
30198
29973
|
|
|
@@ -30202,39 +29977,14 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
30202
29977
|
|
|
30203
29978
|
}
|
|
30204
29979
|
|
|
30205
|
-
// IE
|
|
30206
|
-
|
|
30207
|
-
.k-ie & {
|
|
30208
|
-
|
|
30209
|
-
.k-scheduler {
|
|
30210
|
-
.k-scheduler-toolbar,
|
|
30211
|
-
.k-scheduler-footer {
|
|
30212
|
-
line-height: 2em;
|
|
30213
|
-
}
|
|
30214
|
-
}
|
|
30215
|
-
|
|
30216
|
-
.k-grid {
|
|
30217
|
-
|
|
30218
|
-
.k-icon {
|
|
30219
|
-
text-indent: 0;
|
|
30220
|
-
}
|
|
30221
|
-
}
|
|
30222
|
-
}
|
|
30223
|
-
|
|
30224
29980
|
// RTL
|
|
30225
|
-
|
|
30226
29981
|
.k-rtl &,
|
|
30227
29982
|
&[dir="rtl"],
|
|
30228
29983
|
[dir="rtl"] & {
|
|
30229
29984
|
|
|
30230
|
-
.k-
|
|
30231
|
-
.k-
|
|
30232
|
-
|
|
30233
|
-
.k-scheduler-edit-form {
|
|
30234
|
-
|
|
30235
|
-
> .k-header {
|
|
30236
|
-
flex-direction: row-reverse;
|
|
30237
|
-
}
|
|
29985
|
+
.k-header-cancel .k-i-arrow-chevron-left,
|
|
29986
|
+
.k-listgroup-item .k-select .k-i-arrow-chevron-right {
|
|
29987
|
+
transform: scaleX( -1 );
|
|
30238
29988
|
}
|
|
30239
29989
|
|
|
30240
29990
|
.k-scheduler-mobile {
|
|
@@ -30256,10 +30006,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
30256
30006
|
margin-right: 0;
|
|
30257
30007
|
}
|
|
30258
30008
|
}
|
|
30259
|
-
|
|
30260
|
-
.k-scheduler-edit-form .k-item .k-i-arrow-chevron-right {
|
|
30261
|
-
transform: scaleX(-1);
|
|
30262
|
-
}
|
|
30263
30009
|
}
|
|
30264
30010
|
}
|
|
30265
30011
|
}
|
|
@@ -30337,15 +30083,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
30337
30083
|
.k-grid-filter-menu,
|
|
30338
30084
|
.k-scheduler-edit-form {
|
|
30339
30085
|
|
|
30340
|
-
.k-header {
|
|
30341
|
-
color: $adaptive-menu-text;
|
|
30342
|
-
background-color: $adaptive-menu-bg;
|
|
30343
|
-
|
|
30344
|
-
.k-link {
|
|
30345
|
-
color: inherit;
|
|
30346
|
-
}
|
|
30347
|
-
}
|
|
30348
|
-
|
|
30349
30086
|
.k-item,
|
|
30350
30087
|
.k-link {
|
|
30351
30088
|
color: $base-text;
|
|
@@ -30464,7 +30201,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
30464
30201
|
// be cautious when changing the next line; see https://github.com/MoOx/reduce-css-calc/issues/38
|
|
30465
30202
|
$grid-command-cell-padding-y: calc( #{$table-cell-padding-y} - (#{$kendo-button-calc-size} - #{$line-height-em}) / 2 ) !default;
|
|
30466
30203
|
|
|
30467
|
-
$grid-form-component-vertical-align: middle !default;
|
|
30468
30204
|
$grid-hierarchy-col-width: ($icon-size * 2) !default;
|
|
30469
30205
|
|
|
30470
30206
|
$grid-group-indicator-border-radius: $border-radius !default;
|
|
@@ -31187,6 +30923,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
31187
30923
|
|
|
31188
30924
|
> span,
|
|
31189
30925
|
.k-filtercell-wrapper {
|
|
30926
|
+
width: 100%;
|
|
31190
30927
|
display: flex;
|
|
31191
30928
|
flex-flow: row nowrap;
|
|
31192
30929
|
align-items: center;
|
|
@@ -31198,6 +30935,16 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
31198
30935
|
}
|
|
31199
30936
|
}
|
|
31200
30937
|
|
|
30938
|
+
.k-input,
|
|
30939
|
+
.k-picker {
|
|
30940
|
+
width: auto;
|
|
30941
|
+
flex: 1 1 auto;
|
|
30942
|
+
}
|
|
30943
|
+
.k-color-picker,
|
|
30944
|
+
.k-dropdown-operator {
|
|
30945
|
+
width: min-content;
|
|
30946
|
+
flex: none;
|
|
30947
|
+
}
|
|
31201
30948
|
}
|
|
31202
30949
|
|
|
31203
30950
|
// Grid content
|
|
@@ -31231,6 +30978,18 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
31231
30978
|
}
|
|
31232
30979
|
|
|
31233
30980
|
|
|
30981
|
+
// Checkboxes
|
|
30982
|
+
.k-grid th,
|
|
30983
|
+
.k-grid td {
|
|
30984
|
+
> .k-radio,
|
|
30985
|
+
> .k-radio-wrap,
|
|
30986
|
+
> .k-checkbox,
|
|
30987
|
+
> .k-checkbox-wrap {
|
|
30988
|
+
vertical-align: top;
|
|
30989
|
+
}
|
|
30990
|
+
}
|
|
30991
|
+
|
|
30992
|
+
|
|
31234
30993
|
// Edit row
|
|
31235
30994
|
.k-grid .k-edit-cell,
|
|
31236
30995
|
.k-grid .k-command-cell,
|
|
@@ -31246,13 +31005,19 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
31246
31005
|
> select,
|
|
31247
31006
|
> .k-widget:not(.k-switch) {
|
|
31248
31007
|
width: 100%;
|
|
31249
|
-
vertical-align:
|
|
31008
|
+
vertical-align: middle;
|
|
31250
31009
|
box-sizing: border-box;
|
|
31251
31010
|
}
|
|
31011
|
+
> .k-radio,
|
|
31012
|
+
> .k-checkbox,
|
|
31013
|
+
> .k-radio-wrap,
|
|
31014
|
+
> .k-checkbox-wrap {
|
|
31015
|
+
vertical-align: middle;
|
|
31016
|
+
}
|
|
31252
31017
|
}
|
|
31253
31018
|
|
|
31254
31019
|
.k-grid .k-command-cell > .k-button {
|
|
31255
|
-
vertical-align:
|
|
31020
|
+
vertical-align: middle;
|
|
31256
31021
|
}
|
|
31257
31022
|
.k-grid .k-command-cell > .k-button + .k-button {
|
|
31258
31023
|
margin-left: $grid-command-cell-button-spacing;
|
|
@@ -31702,11 +31467,8 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
31702
31467
|
.k-item,
|
|
31703
31468
|
.k-check-all-wrap {
|
|
31704
31469
|
padding: $grid-column-menu-list-item-padding-y $grid-column-menu-list-item-padding-x;
|
|
31705
|
-
|
|
31706
|
-
|
|
31707
|
-
line-height: inherit;
|
|
31708
|
-
display: block;
|
|
31709
|
-
}
|
|
31470
|
+
display: flex;
|
|
31471
|
+
flex-flow: row nowrap;
|
|
31710
31472
|
}
|
|
31711
31473
|
}
|
|
31712
31474
|
|
|
@@ -31747,7 +31509,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
31747
31509
|
padding: $grid-column-menu-popup-padding-y $grid-column-menu-popup-padding-x;
|
|
31748
31510
|
}
|
|
31749
31511
|
.k-popup > & {
|
|
31750
|
-
width: 100%;
|
|
31512
|
+
max-width: 100%;
|
|
31751
31513
|
}
|
|
31752
31514
|
|
|
31753
31515
|
.k-actions {
|
|
@@ -31788,10 +31550,17 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
31788
31550
|
}
|
|
31789
31551
|
|
|
31790
31552
|
.k-column-list-item {
|
|
31791
|
-
position: relative;
|
|
31792
|
-
display: block;
|
|
31793
31553
|
margin: 0;
|
|
31554
|
+
display: flex;
|
|
31555
|
+
flex-flow: row nowrap;
|
|
31556
|
+
align-items: center;
|
|
31557
|
+
gap: 4px;
|
|
31794
31558
|
cursor: pointer;
|
|
31559
|
+
position: relative;
|
|
31560
|
+
|
|
31561
|
+
.k-checkbox-label {
|
|
31562
|
+
margin: 0;
|
|
31563
|
+
}
|
|
31795
31564
|
}
|
|
31796
31565
|
|
|
31797
31566
|
.k-columns-items-wrap {
|
|
@@ -31984,12 +31753,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
|
|
|
31984
31753
|
@include fill( $bg: $grid-sticky-selected-alt-bg );
|
|
31985
31754
|
}
|
|
31986
31755
|
|
|
31987
|
-
// Hovered state
|
|
31988
|
-
.k-state-hover td,
|
|
31989
|
-
tr:hover td {
|
|
31990
|
-
@include fill( $bg: $grid-sticky-hovered-bg );
|
|
31991
|
-
}
|
|
31992
|
-
|
|
31993
31756
|
// Selected hover
|
|
31994
31757
|
.k-state-selected:hover td,
|
|
31995
31758
|
.k-state-selected.k-state-hover td {
|
|
@@ -32750,6 +32513,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
|
|
|
32750
32513
|
margin: 0;
|
|
32751
32514
|
}
|
|
32752
32515
|
.k-spreadsheet-tabstrip .k-loading {
|
|
32516
|
+
// TODO: better name
|
|
32753
32517
|
display: none;
|
|
32754
32518
|
}
|
|
32755
32519
|
.k-spreadsheet-tabstrip .k-content,
|
|
@@ -32778,9 +32542,12 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
|
|
|
32778
32542
|
}
|
|
32779
32543
|
|
|
32780
32544
|
.k-input,
|
|
32781
|
-
.k-picker
|
|
32545
|
+
.k-picker {
|
|
32782
32546
|
width: 5em;
|
|
32783
32547
|
}
|
|
32548
|
+
.k-color-picker {
|
|
32549
|
+
width: min-content;
|
|
32550
|
+
}
|
|
32784
32551
|
}
|
|
32785
32552
|
|
|
32786
32553
|
|
|
@@ -33313,7 +33080,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
|
|
|
33313
33080
|
}
|
|
33314
33081
|
.k-details-summary,
|
|
33315
33082
|
.k-columnmenu-item {
|
|
33316
|
-
padding: $kendo-menu-popup-item-padding-y
|
|
33083
|
+
padding: $kendo-menu-popup-item-padding-y $kendo-menu-popup-item-padding-x;
|
|
33317
33084
|
display: flex;
|
|
33318
33085
|
align-items: center;
|
|
33319
33086
|
cursor: pointer;
|
|
@@ -35190,9 +34957,13 @@ $treelist-footer-row-border-width: 1px !default;
|
|
|
35190
34957
|
padding: .4em .6em;
|
|
35191
34958
|
line-height: 1.6em;
|
|
35192
34959
|
|
|
34960
|
+
// TODO: see what this does and use a better name
|
|
35193
34961
|
.k-loading {
|
|
35194
34962
|
vertical-align: baseline;
|
|
35195
34963
|
margin-right: 5px;
|
|
34964
|
+
|
|
34965
|
+
// TODO
|
|
34966
|
+
display: none;
|
|
35196
34967
|
}
|
|
35197
34968
|
}
|
|
35198
34969
|
|
|
@@ -35381,6 +35152,7 @@ $filter-preview-operator-text: $subtle-text !default;
|
|
|
35381
35152
|
// #region @import "_layout.scss"; -> packages/bootstrap/scss/filter/_layout.scss
|
|
35382
35153
|
// #region @import "~@progress/kendo-theme-default/scss/filter/_layout.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/filter/_layout.scss
|
|
35383
35154
|
@include exports("filter/layout") {
|
|
35155
|
+
|
|
35384
35156
|
.k-filter {
|
|
35385
35157
|
border-width: 0;
|
|
35386
35158
|
display: inline-block;
|
|
@@ -35422,6 +35194,9 @@ $filter-preview-operator-text: $subtle-text !default;
|
|
|
35422
35194
|
border-style: solid;
|
|
35423
35195
|
}
|
|
35424
35196
|
}
|
|
35197
|
+
.k-filter-operator .k-dropdown-list {
|
|
35198
|
+
width: $filter-operator-dropdown-width;
|
|
35199
|
+
}
|
|
35425
35200
|
|
|
35426
35201
|
.k-filter-item {
|
|
35427
35202
|
position: relative;
|
|
@@ -36888,10 +36663,6 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
|
|
|
36888
36663
|
display: flex;
|
|
36889
36664
|
flex-direction: column;
|
|
36890
36665
|
padding: 10px 0 40px;
|
|
36891
|
-
|
|
36892
|
-
> span {
|
|
36893
|
-
padding-bottom: $padding-y;
|
|
36894
|
-
}
|
|
36895
36666
|
}
|
|
36896
36667
|
|
|
36897
36668
|
.k-matches-container {
|
|
@@ -37130,13 +36901,13 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
|
|
|
37130
36901
|
width: 5em;
|
|
37131
36902
|
}
|
|
37132
36903
|
|
|
37133
|
-
& + .k-
|
|
36904
|
+
& + .k-color-picker,
|
|
37134
36905
|
& + .k-dropdown-list {
|
|
37135
36906
|
margin-left: map-get( $spacing, 2 );
|
|
37136
36907
|
}
|
|
37137
36908
|
}
|
|
37138
36909
|
|
|
37139
|
-
.k-
|
|
36910
|
+
.k-color-picker {
|
|
37140
36911
|
vertical-align: middle;
|
|
37141
36912
|
}
|
|
37142
36913
|
|
|
@@ -38174,7 +37945,7 @@ $gantt-offset-resize-handler-top: 45% !default;
|
|
|
38174
37945
|
position: relative;
|
|
38175
37946
|
vertical-align: middle;
|
|
38176
37947
|
}
|
|
38177
|
-
td::after { content: "\
|
|
37948
|
+
td::after { content: "\200b"; }
|
|
38178
37949
|
}
|
|
38179
37950
|
.k-task-wrap {
|
|
38180
37951
|
margin: 0 -21px;
|
|
@@ -39705,7 +39476,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
|
|
|
39705
39476
|
// TODO: add this class to jQuery rendering
|
|
39706
39477
|
// after refactoring jQuery scheduler layout to be flex
|
|
39707
39478
|
.k-recurrence-editor {
|
|
39708
|
-
display:
|
|
39479
|
+
display: flex;
|
|
39709
39480
|
flex-direction: column;
|
|
39710
39481
|
}
|
|
39711
39482
|
kendo-scheduler .k-recurrence-editor {
|
|
@@ -39957,27 +39728,40 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
|
|
|
39957
39728
|
|
|
39958
39729
|
.k-scheduler-edit-form {
|
|
39959
39730
|
|
|
39960
|
-
.k-edit-form-container { width:
|
|
39731
|
+
.k-edit-form-container { width: 100%; }
|
|
39961
39732
|
.k-edit-label { width: 17%; }
|
|
39962
39733
|
.k-edit-field { width: 77%; }
|
|
39963
39734
|
|
|
39964
|
-
.k-
|
|
39965
|
-
|
|
39735
|
+
.k-edit-field > ul > li {
|
|
39736
|
+
display: flex;
|
|
39737
|
+
flex-flow: row nowrap;
|
|
39738
|
+
align-items: center;
|
|
39739
|
+
}
|
|
39740
|
+
.k-recurrence-editor {
|
|
39741
|
+
.k-radio-list .k-radio-wrap,
|
|
39742
|
+
.k-checkbox-list .k-checkbox-wrap {
|
|
39743
|
+
align-self: center;
|
|
39744
|
+
}
|
|
39966
39745
|
}
|
|
39967
39746
|
|
|
39968
|
-
|
|
39969
|
-
.k-
|
|
39970
|
-
.k-
|
|
39971
|
-
.k-widget.k-recur-monthday {
|
|
39747
|
+
.k-recur-interval,
|
|
39748
|
+
.k-recur-count,
|
|
39749
|
+
.k-recur-monthday {
|
|
39972
39750
|
width: 5em;
|
|
39973
39751
|
}
|
|
39974
|
-
.k-
|
|
39975
|
-
.k-
|
|
39976
|
-
.k-
|
|
39977
|
-
.k-
|
|
39752
|
+
.k-recur-until,
|
|
39753
|
+
.k-recur-month,
|
|
39754
|
+
.k-recur-weekday,
|
|
39755
|
+
.k-recur-weekday-offset {
|
|
39978
39756
|
width: 10em;
|
|
39979
39757
|
}
|
|
39980
39758
|
|
|
39759
|
+
.k-scheduler-datetime-picker {
|
|
39760
|
+
display: flex;
|
|
39761
|
+
flex-flow: row nowrap;
|
|
39762
|
+
gap: map-get( $spacing, 2 );
|
|
39763
|
+
}
|
|
39764
|
+
|
|
39981
39765
|
}
|
|
39982
39766
|
|
|
39983
39767
|
}
|
|
@@ -40521,11 +40305,6 @@ $chat-quick-reply-hover-bg: $primary !default;
|
|
|
40521
40305
|
$chat-quick-reply-hover-text: $primary-contrast !default;
|
|
40522
40306
|
$chat-quick-reply-hover-border: $primary !default;
|
|
40523
40307
|
|
|
40524
|
-
$chat-message-box-bg: $kendo-input-bg !default;
|
|
40525
|
-
$chat-message-box-text: $kendo-input-text !default;
|
|
40526
|
-
$chat-message-box-border: inherit !default;
|
|
40527
|
-
$chat-message-box-focus-shadow: 0 0 40px rgba( $kendo-input-text, .1 ) !default;
|
|
40528
|
-
|
|
40529
40308
|
// #endregion
|
|
40530
40309
|
// #region @import "_layout.scss"; -> packages/bootstrap/scss/chat/_layout.scss
|
|
40531
40310
|
// #region @import "~@progress/kendo-theme-default/scss/chat/_layout.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/chat/_layout.scss
|
|
@@ -40802,7 +40581,8 @@ $chat-message-box-focus-shadow: 0 0 40px rgba( $kendo-input-text, .1 ) !default;
|
|
|
40802
40581
|
box-sizing: border-box;
|
|
40803
40582
|
border-width: 1px 0 0;
|
|
40804
40583
|
border-style: solid;
|
|
40805
|
-
border-
|
|
40584
|
+
border-color: inherit !important; // sass-lint:disable-line no-important
|
|
40585
|
+
border-radius: 0 !important; // sass-lint:disable-line no-important
|
|
40806
40586
|
flex: none;
|
|
40807
40587
|
display: flex;
|
|
40808
40588
|
flex-flow: row nowrap;
|
|
@@ -40829,11 +40609,6 @@ $chat-message-box-focus-shadow: 0 0 40px rgba( $kendo-input-text, .1 ) !default;
|
|
|
40829
40609
|
display: inline-block;
|
|
40830
40610
|
}
|
|
40831
40611
|
|
|
40832
|
-
&::before,
|
|
40833
|
-
&::after {
|
|
40834
|
-
display: none;
|
|
40835
|
-
}
|
|
40836
|
-
|
|
40837
40612
|
.k-rtl &,
|
|
40838
40613
|
&[dir="rtl"] {
|
|
40839
40614
|
transform: scaleX(-1);
|
|
@@ -40980,10 +40755,16 @@ $chat-message-box-focus-shadow: 0 0 40px rgba( $kendo-input-text, .1 ) !default;
|
|
|
40980
40755
|
|
|
40981
40756
|
.k-scroll-button {
|
|
40982
40757
|
height: 100%;
|
|
40758
|
+
aspect-ratio: auto;
|
|
40983
40759
|
position: absolute;
|
|
40984
40760
|
z-index: 2;
|
|
40985
40761
|
top: 50%;
|
|
40986
40762
|
transform: translateY(-50%);
|
|
40763
|
+
|
|
40764
|
+
.k-button-icon {
|
|
40765
|
+
min-width: auto;
|
|
40766
|
+
min-height: auto;
|
|
40767
|
+
}
|
|
40987
40768
|
}
|
|
40988
40769
|
.k-scroll-button-left {
|
|
40989
40770
|
left: 0;
|
|
@@ -41159,19 +40940,6 @@ $chat-message-box-focus-shadow: 0 0 40px rgba( $kendo-input-text, .1 ) !default;
|
|
|
41159
40940
|
);
|
|
41160
40941
|
}
|
|
41161
40942
|
|
|
41162
|
-
|
|
41163
|
-
// Message box
|
|
41164
|
-
.k-message-box {
|
|
41165
|
-
@include fill(
|
|
41166
|
-
$chat-message-box-text,
|
|
41167
|
-
$chat-message-box-bg,
|
|
41168
|
-
$chat-message-box-border
|
|
41169
|
-
);
|
|
41170
|
-
}
|
|
41171
|
-
.k-message-box.k-state-focused {
|
|
41172
|
-
@include box-shadow( $chat-message-box-focus-shadow );
|
|
41173
|
-
}
|
|
41174
|
-
|
|
41175
40943
|
}
|
|
41176
40944
|
|
|
41177
40945
|
|
|
@@ -41299,6 +41067,9 @@ $mediaplayer-titlebar-gradient: rgba( $mediaplayer-text, .7 ), rgba( $mediaplaye
|
|
|
41299
41067
|
padding: 0 (14px / 2);
|
|
41300
41068
|
align-items: center;
|
|
41301
41069
|
}
|
|
41070
|
+
.k-mediaplayer-volume {
|
|
41071
|
+
width: 100px;
|
|
41072
|
+
}
|
|
41302
41073
|
|
|
41303
41074
|
|
|
41304
41075
|
// Seekbar
|
|
@@ -41306,8 +41077,9 @@ $mediaplayer-titlebar-gradient: rgba( $mediaplayer-text, .7 ), rgba( $mediaplaye
|
|
|
41306
41077
|
width: 100%;
|
|
41307
41078
|
position: absolute;
|
|
41308
41079
|
z-index: 3;
|
|
41309
|
-
top:
|
|
41080
|
+
top: 0;
|
|
41310
41081
|
left: 0;
|
|
41082
|
+
transform: translateY( -50% );
|
|
41311
41083
|
}
|
|
41312
41084
|
.k-mediaplayer-seekbar .k-slider-track {
|
|
41313
41085
|
// sass-lint:disable no-important
|
|
@@ -41315,6 +41087,9 @@ $mediaplayer-titlebar-gradient: rgba( $mediaplayer-text, .7 ), rgba( $mediaplaye
|
|
|
41315
41087
|
// sass-lint:enable no-important
|
|
41316
41088
|
border-radius: 0;
|
|
41317
41089
|
}
|
|
41090
|
+
.k-mediaplayer-seekbar .k-slider-selection {
|
|
41091
|
+
border-radius: 0;
|
|
41092
|
+
}
|
|
41318
41093
|
|
|
41319
41094
|
.k-mediaplayer-fullscreen {
|
|
41320
41095
|
z-index: 10000;
|