@progress/kendo-theme-fluent 5.12.1-dev.2 → 5.12.1-dev.3

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.
Files changed (86) hide show
  1. package/dist/all.css +342 -342
  2. package/dist/all.scss +4 -1
  3. package/dist/fluent-main.scss +4 -0
  4. package/lib/swatches/all.json +17 -0
  5. package/lib/swatches/fluent-main.json +17 -0
  6. package/package.json +4 -4
  7. package/scss/adaptive/_layout.scss +2 -2
  8. package/scss/badge/_variables.scss +30 -30
  9. package/scss/breadcrumb/_variables.scss +4 -0
  10. package/scss/button/_variables.scss +33 -33
  11. package/scss/card/_layout.scss +2 -2
  12. package/scss/chat/_variables.scss +3 -3
  13. package/scss/checkbox/_variables.scss +1 -1
  14. package/scss/chip/_variables.scss +27 -27
  15. package/scss/coloreditor/_layout.scss +24 -24
  16. package/scss/coloreditor/_theme.scss +8 -8
  17. package/scss/coloreditor/_variables.scss +27 -27
  18. package/scss/coloreditor/index.scss +2 -2
  19. package/scss/colorgradient/_layout.scss +41 -41
  20. package/scss/colorgradient/_theme.scss +19 -19
  21. package/scss/colorgradient/_variables.scss +46 -46
  22. package/scss/colorgradient/index.scss +2 -2
  23. package/scss/colorpalette/_layout.scss +8 -8
  24. package/scss/colorpalette/_theme.scss +9 -9
  25. package/scss/colorpalette/_variables.scss +15 -15
  26. package/scss/colorpalette/index.scss +2 -2
  27. package/scss/core/_variables.scss +2 -2
  28. package/scss/core/mixins/_hide-scrollbar.scss +1 -1
  29. package/scss/core/mixins/_typography.scss +6 -16
  30. package/scss/dataviz/_layout.scss +3 -3
  31. package/scss/dataviz/_variables.scss +33 -33
  32. package/scss/dialog/_variables.scss +3 -3
  33. package/scss/editor/_layout.scss +2 -2
  34. package/scss/fab/_variables.scss +12 -12
  35. package/scss/filemanager/_layout.scss +31 -31
  36. package/scss/filemanager/_theme.scss +34 -34
  37. package/scss/filemanager/_variables.scss +58 -58
  38. package/scss/filemanager/index.scss +2 -2
  39. package/scss/floating-label/_variables.scss +2 -2
  40. package/scss/forms/_layout.scss +3 -3
  41. package/scss/forms/_variables.scss +8 -8
  42. package/scss/gantt/_layout.scss +2 -2
  43. package/scss/grid/_layout.scss +12 -12
  44. package/scss/grid/_theme.scss +1 -1
  45. package/scss/grid/_variables.scss +74 -74
  46. package/scss/imageeditor/_layout.scss +24 -24
  47. package/scss/imageeditor/_theme.scss +14 -14
  48. package/scss/imageeditor/_variables.scss +33 -33
  49. package/scss/imageeditor/index.scss +2 -2
  50. package/scss/input/_layout.scss +3 -3
  51. package/scss/input/_variables.scss +42 -42
  52. package/scss/list/_variables.scss +102 -102
  53. package/scss/loader/_layout.scss +45 -45
  54. package/scss/loader/_variables.scss +33 -33
  55. package/scss/map/_variables.scss +2 -2
  56. package/scss/mediaplayer/_layout.scss +7 -7
  57. package/scss/mediaplayer/_theme.scss +8 -8
  58. package/scss/mediaplayer/_variables.scss +13 -13
  59. package/scss/mediaplayer/index.scss +2 -2
  60. package/scss/menu/_layout.scss +3 -3
  61. package/scss/menu/_variables.scss +43 -43
  62. package/scss/pager/_variables.scss +18 -18
  63. package/scss/pivotgrid/_layout.scss +2 -2
  64. package/scss/radio/_variables.scss +1 -1
  65. package/scss/rating/_variables.scss +1 -1
  66. package/scss/scheduler/_layout.scss +1 -1
  67. package/scss/scrollview/_variables.scss +1 -1
  68. package/scss/signature/_variables.scss +18 -18
  69. package/scss/split-button/_layout.scss +2 -2
  70. package/scss/split-button/_variables.scss +9 -9
  71. package/scss/spreadsheet/_layout.scss +9 -9
  72. package/scss/spreadsheet/_variables.scss +1 -1
  73. package/scss/table/_layout.scss +2 -2
  74. package/scss/table/_variables.scss +27 -27
  75. package/scss/tilelayout/_layout.scss +4 -4
  76. package/scss/tilelayout/_theme.scss +4 -4
  77. package/scss/tilelayout/_variables.scss +6 -6
  78. package/scss/tilelayout/index.scss +2 -2
  79. package/scss/timeselector/_layout.scss +1 -1
  80. package/scss/timeselector/_variables.scss +13 -13
  81. package/scss/toolbar/_layout.scss +10 -10
  82. package/scss/toolbar/_variables.scss +18 -18
  83. package/scss/treeview/_variables.scss +24 -24
  84. package/scss/typography/_layout.scss +7 -7
  85. package/scss/upload/_variables.scss +1 -1
  86. package/scss/window/_variables.scss +2 -2
package/scss/input/_variables.scss CHANGED
@@ -19,27 +19,27 @@ $kendo-input-border-height: ( $kendo-input-border-width * 2 ) !default;
19
19
 
20
20
  /// Horizontal padding of the input.
21
21
  /// @group input
22
- $kendo-input-padding-x-sm: map.get( $kendo-spacing, 2 ) !default;
23
- $kendo-input-padding-x-md: map.get( $kendo-spacing, 2 ) !default;
24
- $kendo-input-padding-x-lg: map.get( $kendo-spacing, 2 ) !default;
22
+ $kendo-input-sm-padding-x: map.get( $kendo-spacing, 2 ) !default;
23
+ $kendo-input-md-padding-x: map.get( $kendo-spacing, 2 ) !default;
24
+ $kendo-input-lg-padding-x: map.get( $kendo-spacing, 2 ) !default;
25
25
 
26
26
  /// Vertical padding of the input.
27
27
  /// @group input
28
- $kendo-input-padding-y-sm: map.get( $kendo-spacing, 1 ) !default;
29
- $kendo-input-padding-y-md: map.get( $kendo-spacing, 1.5 ) !default;
30
- $kendo-input-padding-y-lg: map.get( $kendo-spacing, 2 ) !default;
28
+ $kendo-input-sm-padding-y: map.get( $kendo-spacing, 1 ) !default;
29
+ $kendo-input-md-padding-y: map.get( $kendo-spacing, 1.5 ) !default;
30
+ $kendo-input-lg-padding-y: map.get( $kendo-spacing, 2 ) !default;
31
31
 
32
32
  /// Font sizes of the input.
33
33
  /// @group input
34
- $kendo-input-font-size-sm: var( --kendo-font-size, inherit ) !default;
35
- $kendo-input-font-size-md: var( --kendo-font-size, inherit ) !default;
36
- $kendo-input-font-size-lg: var( --kendo-font-size, inherit ) !default;
34
+ $kendo-input-sm-font-size: var( --kendo-font-size, inherit ) !default;
35
+ $kendo-input-md-font-size: var( --kendo-font-size, inherit ) !default;
36
+ $kendo-input-lg-font-size: var( --kendo-font-size, inherit ) !default;
37
37
 
38
38
  /// Line heights of the input.
39
39
  /// @group input
40
- $kendo-input-line-height-sm: var( --kendo-line-height, normal ) !default;
41
- $kendo-input-line-height-md: var( --kendo-line-height, normal ) !default;
42
- $kendo-input-line-height-lg: var( --kendo-line-height, normal ) !default;
40
+ $kendo-input-sm-line-height: var( --kendo-line-height, normal ) !default;
41
+ $kendo-input-md-line-height: var( --kendo-line-height, normal ) !default;
42
+ $kendo-input-lg-line-height: var( --kendo-line-height, normal ) !default;
43
43
 
44
44
  // Font family of the input.
45
45
  $kendo-input-font-family: var( --kendo-font-family, inherit) !default;
@@ -48,15 +48,15 @@ $kendo-input-font-family: var( --kendo-font-family, inherit) !default;
48
48
  $kendo-input-font-weight: var( --kendo-font-weight, normal ) !default;
49
49
 
50
50
  // Input actions
51
- $kendo-input-button-width-sm: calc( #{$kendo-button-line-height-sm} * 1em + #{$kendo-button-padding-y-sm} * 2 ) !default;
52
- $kendo-input-button-width-md: calc( #{$kendo-button-line-height-md} * 1em + #{$kendo-button-padding-y-md} * 2 ) !default;
53
- $kendo-input-button-width-lg: calc( #{$kendo-button-line-height-lg} * 1em + #{$kendo-button-padding-y-lg} * 2 ) !default;
51
+ $kendo-input-sm-button-width: calc( #{$kendo-button-sm-line-height} * 1em + #{$kendo-button-sm-padding-y} * 2 ) !default;
52
+ $kendo-input-md-button-width: calc( #{$kendo-button-md-line-height} * 1em + #{$kendo-button-md-padding-y} * 2 ) !default;
53
+ $kendo-input-lg-button-width: calc( #{$kendo-button-lg-line-height} * 1em + #{$kendo-button-lg-padding-y} * 2 ) !default;
54
54
 
55
55
  $kendo-input-button-border-width: 1px !default;
56
56
 
57
- $kendo-input-spinner-width-sm: $kendo-input-button-width-sm !default;
58
- $kendo-input-spinner-width-md: $kendo-input-button-width-md !default;
59
- $kendo-input-spinner-width-lg: $kendo-input-button-width-lg !default;
57
+ $kendo-input-sm-spinner-width: $kendo-input-sm-button-width !default;
58
+ $kendo-input-md-spinner-width: $kendo-input-md-button-width !default;
59
+ $kendo-input-lg-spinner-width: $kendo-input-lg-button-width !default;
60
60
 
61
61
  $kendo-input-spinner-icon-offset: null !default;
62
62
 
@@ -424,34 +424,34 @@ $kendo-picker-flat-disabled-border: $kendo-picker-flat-disabled-text !default;
424
424
  /// @group input
425
425
  $kendo-input-sizes: (
426
426
  sm: (
427
- padding-x: $kendo-input-padding-x-sm,
428
- padding-y: $kendo-input-padding-y-sm,
429
- font-size: $kendo-input-font-size-sm,
430
- line-height: $kendo-input-line-height-sm,
431
- icon-size: calc( var( --kendo-icon-size, 1rem ) + #{$kendo-input-padding-y-sm * 2} ),
432
- button-padding-x: $kendo-input-padding-y-sm,
433
- button-padding-y: $kendo-input-padding-y-sm,
434
- button-width: $kendo-input-button-width-sm
427
+ padding-x: $kendo-input-sm-padding-x,
428
+ padding-y: $kendo-input-sm-padding-y,
429
+ font-size: $kendo-input-sm-font-size,
430
+ line-height: $kendo-input-sm-line-height,
431
+ icon-size: calc( var( --kendo-icon-size, 1rem ) + #{$kendo-input-sm-padding-y * 2} ),
432
+ button-padding-x: $kendo-input-sm-padding-y,
433
+ button-padding-y: $kendo-input-sm-padding-y,
434
+ button-width: $kendo-input-sm-button-width
435
435
  ),
436
436
  md: (
437
- padding-x: $kendo-input-padding-x-md,
438
- padding-y: $kendo-input-padding-y-md,
439
- font-size: $kendo-input-font-size-md,
440
- line-height: $kendo-input-line-height-md,
441
- icon-size: calc( var( --kendo-icon-size, 1rem ) + #{$kendo-input-padding-y-md * 2} ),
442
- button-padding-x: $kendo-input-padding-y-md,
443
- button-padding-y: $kendo-input-padding-y-md,
444
- button-width: $kendo-input-button-width-md
437
+ padding-x: $kendo-input-md-padding-x,
438
+ padding-y: $kendo-input-md-padding-y,
439
+ font-size: $kendo-input-md-font-size,
440
+ line-height: $kendo-input-md-line-height,
441
+ icon-size: calc( var( --kendo-icon-size, 1rem ) + #{$kendo-input-md-padding-y * 2} ),
442
+ button-padding-x: $kendo-input-md-padding-y,
443
+ button-padding-y: $kendo-input-md-padding-y,
444
+ button-width: $kendo-input-md-button-width
445
445
  ),
446
446
  lg: (
447
- padding-x: $kendo-input-padding-x-lg,
448
- padding-y: $kendo-input-padding-y-lg,
449
- font-size: $kendo-input-font-size-lg,
450
- line-height: $kendo-input-line-height-lg,
451
- icon-size: calc( var( --kendo-icon-size, 1rem ) + #{$kendo-input-padding-y-lg * 2} ),
452
- button-padding-x: $kendo-input-padding-y-lg,
453
- button-padding-y: $kendo-input-padding-y-lg,
454
- button-width: $kendo-input-button-width-lg
447
+ padding-x: $kendo-input-lg-padding-x,
448
+ padding-y: $kendo-input-lg-padding-y,
449
+ font-size: $kendo-input-lg-font-size,
450
+ line-height: $kendo-input-lg-line-height,
451
+ icon-size: calc( var( --kendo-icon-size, 1rem ) + #{$kendo-input-lg-padding-y * 2} ),
452
+ button-padding-x: $kendo-input-lg-padding-y,
453
+ button-padding-y: $kendo-input-lg-padding-y,
454
+ button-width: $kendo-input-lg-button-width
455
455
  )
456
456
  ) !default;
457
457
 
package/scss/list/_variables.scss CHANGED
@@ -3,27 +3,27 @@
3
3
 
4
4
  /// Font size of the list component.
5
5
  /// @group list
6
- $kendo-list-font-size-sm: var( --kendo-font-size, inherit ) !default;
7
- $kendo-list-font-size-md: var( --kendo-font-size, inherit ) !default;
8
- $kendo-list-font-size-lg: var( --kendo-font-size, inherit ) !default;
6
+ $kendo-list-sm-font-size: var( --kendo-font-size, inherit ) !default;
7
+ $kendo-list-md-font-size: var( --kendo-font-size, inherit ) !default;
8
+ $kendo-list-lg-font-size: var( --kendo-font-size, inherit ) !default;
9
9
 
10
10
  /// Line height of the list component.
11
11
  /// @group list
12
- $kendo-list-line-height-sm: var( --kendo-line-height, normal ) !default;
13
- $kendo-list-line-height-md: var( --kendo-line-height, normal ) !default;
14
- $kendo-list-line-height-lg: var( --kendo-line-height, normal ) !default;
12
+ $kendo-list-sm-line-height: var( --kendo-line-height, normal ) !default;
13
+ $kendo-list-md-line-height: var( --kendo-line-height, normal ) !default;
14
+ $kendo-list-lg-line-height: var( --kendo-line-height, normal ) !default;
15
15
 
16
16
  /// Horizontal padding of list header.
17
17
  /// @group list
18
- $kendo-list-header-padding-x-sm: map.get( $kendo-spacing, 2 ) !default;
19
- $kendo-list-header-padding-x-md: map.get( $kendo-spacing, 2 ) !default;
20
- $kendo-list-header-padding-x-lg: map.get( $kendo-spacing, 2 ) !default;
18
+ $kendo-list-sm-header-padding-x: map.get( $kendo-spacing, 2 ) !default;
19
+ $kendo-list-md-header-padding-x: map.get( $kendo-spacing, 2 ) !default;
20
+ $kendo-list-lg-header-padding-x: map.get( $kendo-spacing, 2 ) !default;
21
21
 
22
22
  /// Vertical padding of list header.
23
23
  /// @group list
24
- $kendo-list-header-padding-y-sm: map.get( $kendo-spacing, 1.5 ) !default;
25
- $kendo-list-header-padding-y-md: map.get( $kendo-spacing, 2 ) !default;
26
- $kendo-list-header-padding-y-lg: map.get( $kendo-spacing, 2.5 ) !default;
24
+ $kendo-list-sm-header-padding-y: map.get( $kendo-spacing, 1.5 ) !default;
25
+ $kendo-list-md-header-padding-y: map.get( $kendo-spacing, 2 ) !default;
26
+ $kendo-list-lg-header-padding-y: map.get( $kendo-spacing, 2.5 ) !default;
27
27
 
28
28
  /// Border width of list header.
29
29
  /// @group list
@@ -31,15 +31,15 @@ $kendo-list-header-border-width: 0 !default;
31
31
 
32
32
  /// Font size of list header.
33
33
  /// @group list
34
- $kendo-list-header-font-size-sm: var( --kendo-font-size, inherit ) !default;
35
- $kendo-list-header-font-size-md: var( --kendo-font-size, inherit ) !default;
36
- $kendo-list-header-font-size-lg: var( --kendo-font-size, inherit ) !default;
34
+ $kendo-list-sm-header-font-size: var( --kendo-font-size, inherit ) !default;
35
+ $kendo-list-md-header-font-size: var( --kendo-font-size, inherit ) !default;
36
+ $kendo-list-lg-header-font-size: var( --kendo-font-size, inherit ) !default;
37
37
 
38
38
  /// Line height of list header.
39
39
  /// @group list
40
- $kendo-list-header-line-height-sm: var( --kendo-line-height, normal ) !default;
41
- $kendo-list-header-line-height-md: var( --kendo-line-height, normal ) !default;
42
- $kendo-list-header-line-height-lg: var( --kendo-line-height, normal ) !default;
40
+ $kendo-list-sm-header-line-height: var( --kendo-line-height, normal ) !default;
41
+ $kendo-list-md-header-line-height: var( --kendo-line-height, normal ) !default;
42
+ $kendo-list-lg-header-line-height: var( --kendo-line-height, normal ) !default;
43
43
 
44
44
  /// Font weight of list header.
45
45
  /// @group list
@@ -47,57 +47,57 @@ $kendo-list-header-font-weight: var( --kendo-font-weight-bold, normal ) !default
47
47
 
48
48
  /// Horizontal padding of list items.
49
49
  /// @group list
50
- $kendo-list-item-padding-x-sm: map.get( $kendo-spacing, 2 ) !default;
51
- $kendo-list-item-padding-x-md: map.get( $kendo-spacing, 2 ) !default;
52
- $kendo-list-item-padding-x-lg: map.get( $kendo-spacing, 2 ) !default;
50
+ $kendo-list-sm-item-padding-x: map.get( $kendo-spacing, 2 ) !default;
51
+ $kendo-list-md-item-padding-x: map.get( $kendo-spacing, 2 ) !default;
52
+ $kendo-list-lg-item-padding-x: map.get( $kendo-spacing, 2 ) !default;
53
53
 
54
54
  /// Vertical padding of list items.
55
55
  /// @group list
56
- $kendo-list-item-padding-y-sm: map.get( $kendo-spacing, 1.5 ) !default;
57
- $kendo-list-item-padding-y-md: map.get( $kendo-spacing, 2 ) !default;
58
- $kendo-list-item-padding-y-lg: map.get( $kendo-spacing, 2.5 ) !default;
56
+ $kendo-list-sm-item-padding-y: map.get( $kendo-spacing, 1.5 ) !default;
57
+ $kendo-list-md-item-padding-y: map.get( $kendo-spacing, 2 ) !default;
58
+ $kendo-list-lg-item-padding-y: map.get( $kendo-spacing, 2.5 ) !default;
59
59
 
60
60
  /// Font size of list items.
61
61
  /// @group list
62
- $kendo-list-item-font-size-sm: var( --kendo-font-size, inherit ) !default;
63
- $kendo-list-item-font-size-md: var( --kendo-font-size, inherit ) !default;
64
- $kendo-list-item-font-size-lg: var( --kendo-font-size, inherit ) !default;
62
+ $kendo-list-sm-item-font-size: var( --kendo-font-size, inherit ) !default;
63
+ $kendo-list-md-item-font-size: var( --kendo-font-size, inherit ) !default;
64
+ $kendo-list-lg-item-font-size: var( --kendo-font-size, inherit ) !default;
65
65
 
66
66
  /// Line height of list items.
67
67
  /// @group list
68
- $kendo-list-item-line-height-sm: var( --kendo-line-height, normal ) !default;
69
- $kendo-list-item-line-height-md: var( --kendo-line-height, normal ) !default;
70
- $kendo-list-item-line-height-lg: var( --kendo-line-height, normal ) !default;
68
+ $kendo-list-sm-item-line-height: var( --kendo-line-height, normal ) !default;
69
+ $kendo-list-md-item-line-height: var( --kendo-line-height, normal ) !default;
70
+ $kendo-list-lg-item-line-height: var( --kendo-line-height, normal ) !default;
71
71
 
72
72
  /// Font size of list item group label.
73
73
  /// @group list
74
- $kendo-list-item-group-label-font-size-sm: var( --kendo-font-size-xs, inherit ) !default;
75
- $kendo-list-item-group-label-font-size-md: var( --kendo-font-size-xs, inherit ) !default;
76
- $kendo-list-item-group-label-font-size-lg: var( --kendo-font-size-xs, inherit ) !default;
74
+ $kendo-list-item-group-label-sm-font-size: var( --kendo-font-size-xs, inherit ) !default;
75
+ $kendo-list-item-group-label-md-font-size: var( --kendo-font-size-xs, inherit ) !default;
76
+ $kendo-list-item-group-label-lg-font-size: var( --kendo-font-size-xs, inherit ) !default;
77
77
 
78
78
  /// Horizontal padding of list group items.
79
79
  /// @group list
80
- $kendo-list-group-item-padding-x-sm: map.get( $kendo-spacing, 2 ) !default;
81
- $kendo-list-group-item-padding-x-md: map.get( $kendo-spacing, 2 ) !default;
82
- $kendo-list-group-item-padding-x-lg: map.get( $kendo-spacing, 2 ) !default;
80
+ $kendo-list-sm-group-item-padding-x: map.get( $kendo-spacing, 2 ) !default;
81
+ $kendo-list-md-group-item-padding-x: map.get( $kendo-spacing, 2 ) !default;
82
+ $kendo-list-lg-group-item-padding-x: map.get( $kendo-spacing, 2 ) !default;
83
83
 
84
84
  /// Vertical padding of list group items.
85
85
  /// @group list
86
- $kendo-list-group-item-padding-y-sm: map.get( $kendo-spacing, 1.5 ) !default;
87
- $kendo-list-group-item-padding-y-md: map.get( $kendo-spacing, 2 ) !default;
88
- $kendo-list-group-item-padding-y-lg: map.get( $kendo-spacing, 2.5 ) !default;
86
+ $kendo-list-sm-group-item-padding-y: map.get( $kendo-spacing, 1.5 ) !default;
87
+ $kendo-list-md-group-item-padding-y: map.get( $kendo-spacing, 2 ) !default;
88
+ $kendo-list-lg-group-item-padding-y: map.get( $kendo-spacing, 2.5 ) !default;
89
89
 
90
90
  /// Horizontal padding of list item group label.
91
91
  /// @group list
92
- $kendo-list-item-group-label-padding-x-sm: map.get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
93
- $kendo-list-item-group-label-padding-x-md: map.get( $kendo-spacing, 1 ) !default;
94
- $kendo-list-item-group-label-padding-x-lg: map.get( $kendo-spacing, 1.5 ) !default;
92
+ $kendo-list-item-group-label-sm-padding-x: map.get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
93
+ $kendo-list-item-group-label-md-padding-x: map.get( $kendo-spacing, 1 ) !default;
94
+ $kendo-list-item-group-label-lg-padding-x: map.get( $kendo-spacing, 1.5 ) !default;
95
95
 
96
96
  /// Vertical padding of list item group label.
97
97
  /// @group list
98
- $kendo-list-item-group-label-padding-y-sm: map.get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
99
- $kendo-list-item-group-label-padding-y-md: map.get( $kendo-spacing, 1 ) !default;
100
- $kendo-list-item-group-label-padding-y-lg: map.get( $kendo-spacing, 1.5 ) !default;
98
+ $kendo-list-item-group-label-sm-padding-y: map.get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
99
+ $kendo-list-item-group-label-md-padding-y: map.get( $kendo-spacing, 1 ) !default;
100
+ $kendo-list-item-group-label-lg-padding-y: map.get( $kendo-spacing, 1.5 ) !default;
101
101
 
102
102
  /// Border width of list group items.
103
103
  /// @group list
@@ -105,15 +105,15 @@ $kendo-list-group-item-border-width: 1px 0 0 !default;
105
105
 
106
106
  /// Font size of list group items.
107
107
  /// @group list
108
- $kendo-list-group-item-font-size-sm: var( --kendo-font-size, inherit ) !default;
109
- $kendo-list-group-item-font-size-md: var( --kendo-font-size, inherit ) !default;
110
- $kendo-list-group-item-font-size-lg: var( --kendo-font-size, inherit ) !default;
108
+ $kendo-list-sm-group-item-font-size: var( --kendo-font-size, inherit ) !default;
109
+ $kendo-list-md-group-item-font-size: var( --kendo-font-size, inherit ) !default;
110
+ $kendo-list-lg-group-item-font-size: var( --kendo-font-size, inherit ) !default;
111
111
 
112
112
  /// Line height of list group items.
113
113
  /// @group list
114
- $kendo-list-group-item-line-height-sm: var( --kendo-line-height, normal ) !default;
115
- $kendo-list-group-item-line-height-md: var( --kendo-line-height, normal ) !default;
116
- $kendo-list-group-item-line-height-lg: var( --kendo-line-height, normal ) !default;
114
+ $kendo-list-sm-group-item-line-height: var( --kendo-line-height, normal ) !default;
115
+ $kendo-list-md-group-item-line-height: var( --kendo-line-height, normal ) !default;
116
+ $kendo-list-lg-group-item-line-height: var( --kendo-line-height, normal ) !default;
117
117
 
118
118
  /// Font weight of list group item.
119
119
  /// @group list
@@ -126,61 +126,61 @@ $kendo-list-item-icon-text: get-theme-color-var( primary-100 ) !default;
126
126
  // Kendo list sizes
127
127
  $kendo-list-sizes: (
128
128
  sm: (
129
- font-size: $kendo-list-font-size-sm,
130
- line-height: $kendo-list-line-height-sm,
131
- header-padding-x: $kendo-list-header-padding-x-sm,
132
- header-padding-y: $kendo-list-header-padding-y-sm,
133
- header-font-size: $kendo-list-header-font-size-sm,
134
- header-line-height: $kendo-list-header-line-height-sm,
135
- item-padding-x: $kendo-list-item-padding-x-sm,
136
- item-padding-y: $kendo-list-item-padding-y-sm,
137
- item-font-size: $kendo-list-item-font-size-sm,
138
- item-line-height: $kendo-list-item-line-height-sm,
139
- item-group-label-padding-x: $kendo-list-item-group-label-padding-x-sm,
140
- item-group-label-padding-y: $kendo-list-item-group-label-padding-y-sm,
141
- item-group-label-font-size: $kendo-list-item-group-label-font-size-sm,
142
- group-item-padding-x: $kendo-list-group-item-padding-x-sm,
143
- group-item-padding-y: $kendo-list-group-item-padding-y-sm,
144
- group-item-font-size: $kendo-list-group-item-font-size-sm,
145
- group-item-line-height: $kendo-list-group-item-line-height-sm
129
+ font-size: $kendo-list-sm-font-size,
130
+ line-height: $kendo-list-sm-line-height,
131
+ header-padding-x: $kendo-list-sm-header-padding-x,
132
+ header-padding-y: $kendo-list-sm-header-padding-y,
133
+ header-font-size: $kendo-list-sm-header-font-size,
134
+ header-line-height: $kendo-list-sm-header-line-height,
135
+ item-padding-x: $kendo-list-sm-item-padding-x,
136
+ item-padding-y: $kendo-list-sm-item-padding-y,
137
+ item-font-size: $kendo-list-sm-item-font-size,
138
+ item-line-height: $kendo-list-sm-item-line-height,
139
+ item-group-label-padding-x: $kendo-list-item-group-label-sm-padding-x,
140
+ item-group-label-padding-y: $kendo-list-item-group-label-sm-padding-y,
141
+ item-group-label-font-size: $kendo-list-item-group-label-sm-font-size,
142
+ group-item-padding-x: $kendo-list-sm-group-item-padding-x,
143
+ group-item-padding-y: $kendo-list-sm-group-item-padding-y,
144
+ group-item-font-size: $kendo-list-sm-group-item-font-size,
145
+ group-item-line-height: $kendo-list-sm-group-item-line-height
146
146
  ),
147
147
  md: (
148
- font-size: $kendo-list-font-size-md,
149
- line-height: $kendo-list-line-height-md,
150
- header-padding-x: $kendo-list-header-padding-x-md,
151
- header-padding-y: $kendo-list-header-padding-y-md,
152
- header-font-size: $kendo-list-header-font-size-md,
153
- header-line-height: $kendo-list-header-line-height-md,
154
- item-padding-x: $kendo-list-item-padding-x-md,
155
- item-padding-y: $kendo-list-item-padding-y-md,
156
- item-font-size: $kendo-list-item-font-size-md,
157
- item-line-height: $kendo-list-item-line-height-md,
158
- item-group-label-padding-x: $kendo-list-item-group-label-padding-x-md,
159
- item-group-label-padding-y: $kendo-list-item-group-label-padding-y-md,
160
- item-group-label-font-size: $kendo-list-item-group-label-font-size-md,
161
- group-item-padding-x: $kendo-list-group-item-padding-x-md,
162
- group-item-padding-y: $kendo-list-group-item-padding-y-md,
163
- group-item-font-size: $kendo-list-group-item-font-size-md,
164
- group-item-line-height: $kendo-list-group-item-line-height-md
148
+ font-size: $kendo-list-md-font-size,
149
+ line-height: $kendo-list-md-line-height,
150
+ header-padding-x: $kendo-list-md-header-padding-x,
151
+ header-padding-y: $kendo-list-md-header-padding-y,
152
+ header-font-size: $kendo-list-md-header-font-size,
153
+ header-line-height: $kendo-list-md-header-line-height,
154
+ item-padding-x: $kendo-list-md-item-padding-x,
155
+ item-padding-y: $kendo-list-md-item-padding-y,
156
+ item-font-size: $kendo-list-md-item-font-size,
157
+ item-line-height: $kendo-list-md-item-line-height,
158
+ item-group-label-padding-x: $kendo-list-item-group-label-md-padding-x,
159
+ item-group-label-padding-y: $kendo-list-item-group-label-md-padding-y,
160
+ item-group-label-font-size: $kendo-list-item-group-label-md-font-size,
161
+ group-item-padding-x: $kendo-list-md-group-item-padding-x,
162
+ group-item-padding-y: $kendo-list-md-group-item-padding-y,
163
+ group-item-font-size: $kendo-list-md-group-item-font-size,
164
+ group-item-line-height: $kendo-list-md-group-item-line-height
165
165
  ),
166
166
  lg: (
167
- font-size: $kendo-list-font-size-lg,
168
- line-height: $kendo-list-line-height-lg,
169
- header-padding-x: $kendo-list-header-padding-x-lg,
170
- header-padding-y: $kendo-list-header-padding-y-lg,
171
- header-font-size: $kendo-list-header-font-size-lg,
172
- header-line-height: $kendo-list-header-line-height-lg,
173
- item-padding-x: $kendo-list-item-padding-x-lg,
174
- item-padding-y: $kendo-list-item-padding-y-lg,
175
- item-font-size: $kendo-list-item-font-size-lg,
176
- item-line-height: $kendo-list-item-line-height-lg,
177
- item-group-label-padding-x: $kendo-list-item-group-label-padding-x-lg,
178
- item-group-label-padding-y: $kendo-list-item-group-label-padding-y-lg,
179
- item-group-label-font-size: $kendo-list-item-group-label-font-size-lg,
180
- group-item-padding-x: $kendo-list-group-item-padding-x-lg,
181
- group-item-padding-y: $kendo-list-group-item-padding-y-lg,
182
- group-item-font-size: $kendo-list-group-item-font-size-lg,
183
- group-item-line-height: $kendo-list-group-item-line-height-lg
167
+ font-size: $kendo-list-lg-font-size,
168
+ line-height: $kendo-list-lg-line-height,
169
+ header-padding-x: $kendo-list-lg-header-padding-x,
170
+ header-padding-y: $kendo-list-lg-header-padding-y,
171
+ header-font-size: $kendo-list-lg-header-font-size,
172
+ header-line-height: $kendo-list-lg-header-line-height,
173
+ item-padding-x: $kendo-list-lg-item-padding-x,
174
+ item-padding-y: $kendo-list-lg-item-padding-y,
175
+ item-font-size: $kendo-list-lg-item-font-size,
176
+ item-line-height: $kendo-list-lg-item-line-height,
177
+ item-group-label-padding-x: $kendo-list-item-group-label-lg-padding-x,
178
+ item-group-label-padding-y: $kendo-list-item-group-label-lg-padding-y,
179
+ item-group-label-font-size: $kendo-list-item-group-label-lg-font-size,
180
+ group-item-padding-x: $kendo-list-lg-group-item-padding-x,
181
+ group-item-padding-y: $kendo-list-lg-group-item-padding-y,
182
+ group-item-font-size: $kendo-list-lg-group-item-font-size,
183
+ group-item-line-height: $kendo-list-lg-group-item-line-height
184
184
  )
185
185
  ) !default;
186
186
 
package/scss/loader/_layout.scss CHANGED
@@ -29,30 +29,30 @@
29
29
 
30
30
  // Loader sizes
31
31
  .k-loader-sm {
32
- padding-inline: var( --kendo-loader-padding-x-sm, #{$kendo-loader-padding-x-sm} );
33
- padding-block: var( --kendo-loader-padding-y-sm, #{$kendo-loader-padding-y-sm} );
32
+ padding-inline: var( --kendo-loader-sm-padding-x, #{$kendo-loader-sm-padding-x} );
33
+ padding-block: var( --kendo-loader-sm-padding-y, #{$kendo-loader-sm-padding-y} );
34
34
 
35
35
  .k-loader-segment {
36
- width: var( --kendo-loader-segment-size-sm, #{$kendo-loader-segment-size-sm} );
37
- height: var( --kendo-loader-segment-size-sm, #{$kendo-loader-segment-size-sm} );
36
+ width: var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} );
37
+ height: var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} );
38
38
  }
39
39
  }
40
40
  .k-loader-md {
41
- padding-inline: var( --kendo-loader-padding-x-md, #{$kendo-loader-padding-x-md} );
42
- padding-block: var( --kendo-loader-padding-y-md, #{$kendo-loader-padding-y-md} );
41
+ padding-inline: var( --kendo-loader-md-padding-x, #{$kendo-loader-md-padding-x} );
42
+ padding-block: var( --kendo-loader-md-padding-y, #{$kendo-loader-md-padding-y} );
43
43
 
44
44
  .k-loader-segment {
45
- width: var( --kendo-loader-segment-size-md, #{$kendo-loader-segment-size-md} );
46
- height: var( --kendo-loader-segment-size-md, #{$kendo-loader-segment-size-md} );
45
+ width: var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} );
46
+ height: var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} );
47
47
  }
48
48
  }
49
49
  .k-loader-lg {
50
- padding-inline: var( --kendo-loader-padding-x-lg, #{$kendo-loader-padding-x-lg} );
51
- padding-block: var( --kendo-loader-padding-y-lg, #{$kendo-loader-padding-y-lg} );
50
+ padding-inline: var( --kendo-loader-lg-padding-x, #{$kendo-loader-lg-padding-x} );
51
+ padding-block: var( --kendo-loader-lg-padding-y, #{$kendo-loader-lg-padding-y} );
52
52
 
53
53
  .k-loader-segment {
54
- width: var( --kendo-loader-segment-size-lg, #{$kendo-loader-segment-size-lg} );
55
- height: var( --kendo-loader-segment-size-lg, #{$kendo-loader-segment-size-lg} );
54
+ width: var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} );
55
+ height: var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} );
56
56
  }
57
57
  }
58
58
 
@@ -90,22 +90,22 @@
90
90
 
91
91
  &.k-loader-sm {
92
92
  .k-loader-canvas {
93
- width: calc( var( --kendo-loader-segment-size-sm, #{$kendo-loader-segment-size-sm} ) * 3 );
94
- height: calc( var( --kendo-loader-segment-size-sm, #{$kendo-loader-segment-size-sm} ) * 1.5 );
93
+ width: calc( var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} ) * 3 );
94
+ height: calc( var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} ) * 1.5 );
95
95
  }
96
96
  }
97
97
 
98
98
  &.k-loader-md {
99
99
  .k-loader-canvas {
100
- width: calc( var( --kendo-loader-segment-size-md, #{$kendo-loader-segment-size-md} ) * 3 );
101
- height: calc( var( --kendo-loader-segment-size-md, #{$kendo-loader-segment-size-md} ) * 1.5 );
100
+ width: calc( var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} ) * 3 );
101
+ height: calc( var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} ) * 1.5 );
102
102
  }
103
103
  }
104
104
 
105
105
  &.k-loader-lg {
106
106
  .k-loader-canvas {
107
- width: calc( var( --kendo-loader-segment-size-lg, #{$kendo-loader-segment-size-lg} ) * 3 );
108
- height: calc( var( --kendo-loader-segment-size-lg, #{$kendo-loader-segment-size-lg} ) * 1.5 );
107
+ width: calc( var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} ) * 3 );
108
+ height: calc( var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} ) * 1.5 );
109
109
  }
110
110
  }
111
111
  }
@@ -170,25 +170,25 @@
170
170
 
171
171
  &.k-loader-sm {
172
172
  .k-loader-canvas {
173
- margin: calc( var( --kendo-loader-segment-size-sm, #{$kendo-loader-segment-size-sm} ) / 2 );
174
- width: calc( var( --kendo-loader-spinner-3-width-sm, #{$kendo-loader-spinner-3-width-sm} ) - var( --kendo-loader-segment-size-sm, #{$kendo-loader-segment-size-sm} ) );
175
- height: calc( var( --kendo-loader-spinner-3-height-sm, #{$kendo-loader-spinner-3-height-sm} ) - var( --kendo-loader-segment-size-sm, #{$kendo-loader-segment-size-sm} ) );
173
+ margin: calc( var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} ) / 2 );
174
+ width: calc( var( --kendo-loader-sm-spinner-3-width, #{$kendo-loader-sm-spinner-3-width} ) - var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} ) );
175
+ height: calc( var( --kendo-loader-sm-spinner-3-height, #{$kendo-loader-sm-spinner-3-height} ) - var( --kendo-loader-sm-segment-size, #{$kendo-loader-sm-segment-size} ) );
176
176
  }
177
177
  }
178
178
 
179
179
  &.k-loader-md {
180
180
  .k-loader-canvas {
181
- margin: calc( var( --kendo-loader-segment-size-md, #{$kendo-loader-segment-size-md} ) / 2 );
182
- width: calc( var( --kendo-loader-spinner-3-width-md, #{$kendo-loader-spinner-3-width-md} ) - var( --kendo-loader-segment-size-md, #{$kendo-loader-segment-size-md} ) );
183
- height: calc( var( --kendo-loader-spinner-3-height-md, #{$kendo-loader-spinner-3-height-md} ) - var( --kendo-loader-segment-size-md, #{$kendo-loader-segment-size-md} ) );
181
+ margin: calc( var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} ) / 2 );
182
+ width: calc( var( --kendo-loader-md-spinner-3-width, #{$kendo-loader-md-spinner-3-width} ) - var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} ) );
183
+ height: calc( var( --kendo-loader-md-spinner-3-height, #{$kendo-loader-md-spinner-3-height} ) - var( --kendo-loader-md-segment-size, #{$kendo-loader-md-segment-size} ) );
184
184
  }
185
185
  }
186
186
 
187
187
  &.k-loader-lg {
188
188
  .k-loader-canvas {
189
- margin: calc( var( --kendo-loader-segment-size-lg, #{$kendo-loader-segment-size-lg} ) / 2 );
190
- width: calc( var( --kendo-loader-spinner-3-width-lg, #{$kendo-loader-spinner-3-width-lg} ) - var( --kendo-loader-segment-size-lg, #{$kendo-loader-segment-size-lg} ) );
191
- height: calc( var( --kendo-loader-spinner-3-height-lg, #{$kendo-loader-spinner-3-height-lg} ) - var( --kendo-loader-segment-size-lg, #{$kendo-loader-segment-size-lg} ) );
189
+ margin: calc( var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} ) / 2 );
190
+ width: calc( var( --kendo-loader-lg-spinner-3-width, #{$kendo-loader-lg-spinner-3-width} ) - var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} ) );
191
+ height: calc( var( --kendo-loader-lg-spinner-3-height, #{$kendo-loader-lg-spinner-3-height} ) - var( --kendo-loader-lg-segment-size, #{$kendo-loader-lg-segment-size} ) );
192
192
  }
193
193
  }
194
194
  }
@@ -345,22 +345,22 @@
345
345
 
346
346
  &.k-loader-sm {
347
347
  .k-loader-canvas {
348
- width: var( --kendo-loader-spinner-4-width-sm, #{$kendo-loader-spinner-4-width-sm} );
349
- height: var( --kendo-loader-spinner-4-height-sm, #{$kendo-loader-spinner-4-height-sm} );
348
+ width: var( --kendo-loader-sm-spinner-4-width, #{$kendo-loader-sm-spinner-4-width} );
349
+ height: var( --kendo-loader-sm-spinner-4-height, #{$kendo-loader-sm-spinner-4-height} );
350
350
  }
351
351
  }
352
352
 
353
353
  &.k-loader-md {
354
354
  .k-loader-canvas {
355
- width: var( --kendo-loader-spinner-4-width-md, #{$kendo-loader-spinner-4-width-md} );
356
- height: var( --kendo-loader-spinner-4-height-md, #{$kendo-loader-spinner-4-height-md} );
355
+ width: var( --kendo-loader-md-spinner-4-width, #{$kendo-loader-md-spinner-4-width} );
356
+ height: var( --kendo-loader-md-spinner-4-height, #{$kendo-loader-md-spinner-4-height} );
357
357
  }
358
358
  }
359
359
 
360
360
  &.k-loader-lg {
361
361
  .k-loader-canvas {
362
- width: var( --kendo-loader-spinner-4-width-lg, #{$kendo-loader-spinner-4-width-lg} );
363
- height: var( --kendo-loader-spinner-4-height-lg, #{$kendo-loader-spinner-4-height-lg} );
362
+ width: var( --kendo-loader-lg-spinner-4-width, #{$kendo-loader-lg-spinner-4-width} );
363
+ height: var( --kendo-loader-lg-spinner-4-height, #{$kendo-loader-lg-spinner-4-height} );
364
364
  }
365
365
  }
366
366
  }
@@ -411,35 +411,35 @@
411
411
  // Loader Container Sizes
412
412
  .k-loader-container-sm {
413
413
  .k-loader-container-inner {
414
- padding-inline: var( --kendo-loader-container-padding-x-sm, #{$kendo-loader-container-padding-x-sm} );
415
- padding-block: var( --kendo-loader-container-padding-y-sm, #{$kendo-loader-container-padding-y-sm} );
416
- gap: var( --kendo-loader-container-gap-sm, #{$kendo-loader-container-gap-sm} );
414
+ padding-inline: var( --kendo-loader-sm-container-padding-x, #{$kendo-loader-sm-container-padding-x} );
415
+ padding-block: var( --kendo-loader-sm-container-padding-y, #{$kendo-loader-sm-container-padding-y} );
416
+ gap: var( --kendo-loader-sm-container-gap, #{$kendo-loader-sm-container-gap} );
417
417
  }
418
418
 
419
419
  .k-loader-container-label {
420
- font-size: var( --kendo-loader-container-font-size-sm, #{$kendo-loader-container-font-size-sm} );
420
+ font-size: var( --kendo-loader-sm-container-font-size, #{$kendo-loader-sm-container-font-size} );
421
421
  }
422
422
  }
423
423
  .k-loader-container-md {
424
424
  .k-loader-container-inner {
425
- padding-inline: var( --kendo-loader-container-padding-x-md, #{$kendo-loader-container-padding-x-md} );
426
- padding-block: var( --kendo-loader-container-padding-y-md, #{$kendo-loader-container-padding-y-md} );
427
- gap: var( --kendo-loader-container-gap-md, #{$kendo-loader-container-gap-md} );
425
+ padding-inline: var( --kendo-loader-md-container-padding-x, #{$kendo-loader-md-container-padding-x} );
426
+ padding-block: var( --kendo-loader-md-container-padding-y, #{$kendo-loader-md-container-padding-y} );
427
+ gap: var( --kendo-loader-md-container-gap, #{$kendo-loader-md-container-gap} );
428
428
  }
429
429
 
430
430
  .k-loader-container-label {
431
- font-size: var( --kendo-loader-container-font-size-md, #{$kendo-loader-container-font-size-md} );
431
+ font-size: var( --kendo-loader-md-container-font-size, #{$kendo-loader-md-container-font-size} );
432
432
  }
433
433
  }
434
434
  .k-loader-container-lg {
435
435
  .k-loader-container-inner {
436
- padding-inline: var( --kendo-loader-container-padding-x-lg, #{$kendo-loader-container-padding-x-lg} );
437
- padding-block: var( --kendo-loader-container-padding-y-lg, #{$kendo-loader-container-padding-y-lg} );
438
- gap: var( --kendo-loader-container-gap-lg, #{$kendo-loader-container-gap-lg} );
436
+ padding-inline: var( --kendo-loader-lg-container-padding-x, #{$kendo-loader-lg-container-padding-x} );
437
+ padding-block: var( --kendo-loader-lg-container-padding-y, #{$kendo-loader-lg-container-padding-y} );
438
+ gap: var( --kendo-loader-lg-container-gap, #{$kendo-loader-lg-container-gap} );
439
439
  }
440
440
 
441
441
  .k-loader-container-label {
442
- font-size: var( --kendo-loader-container-font-size-lg, #{$kendo-loader-container-font-size-lg} );
442
+ font-size: var( --kendo-loader-lg-container-font-size, #{$kendo-loader-lg-container-font-size} );
443
443
  }
444
444
  }
445
445