@progress/kendo-theme-default 5.0.0-beta.2 → 5.0.0-beta.6

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 (143) hide show
  1. package/README.md +5 -8
  2. package/dist/all.css +2559 -2188
  3. package/dist/all.scss +3607 -3193
  4. package/dist/default-dataviz-v4.scss +8 -0
  5. package/dist/default-main-dark.scss +5 -5
  6. package/dist/default-main.scss +5 -5
  7. package/lib/swatches/default-dataviz-v4.json +51 -0
  8. package/lib/swatches/default-main-dark.json +5 -5
  9. package/lib/swatches/default-main.json +5 -5
  10. package/package.json +2 -2
  11. package/scss/_layout.scss +0 -0
  12. package/scss/action-buttons/_layout.scss +7 -0
  13. package/scss/action-sheet/_layout.scss +6 -0
  14. package/scss/adaptive/_layout.scss +47 -71
  15. package/scss/adaptive/_theme.scss +0 -9
  16. package/scss/appbar/_layout.scss +28 -3
  17. package/scss/appbar/_variables.scss +1 -1
  18. package/scss/autocomplete/_theme.scss +1 -1
  19. package/scss/autocomplete/_variables.scss +0 -19
  20. package/scss/avatar/_layout.scss +6 -0
  21. package/scss/badge/_layout.scss +6 -0
  22. package/scss/bottom-navigation/_layout.scss +6 -0
  23. package/scss/breadcrumb/_layout.scss +6 -0
  24. package/scss/button/_layout.scss +92 -136
  25. package/scss/button/_theme.scss +175 -204
  26. package/scss/button/_variables.scss +58 -31
  27. package/scss/calendar/_layout.scss +2 -2
  28. package/scss/captcha/_layout.scss +6 -0
  29. package/scss/card/_layout.scss +6 -0
  30. package/scss/card/_variables.scss +4 -4
  31. package/scss/chat/_layout.scss +12 -11
  32. package/scss/chat/_theme.scss +0 -21
  33. package/scss/chat/_variables.scss +0 -7
  34. package/scss/checkbox/_index.scss +1 -1
  35. package/scss/checkbox/_layout.scss +112 -163
  36. package/scss/checkbox/_theme.scss +6 -4
  37. package/scss/checkbox/_variables.scss +64 -73
  38. package/scss/chip/_layout.scss +9 -5
  39. package/scss/chip/_variables.scss +30 -15
  40. package/scss/color-preview/_layout.scss +27 -22
  41. package/scss/color-preview/_theme.scss +0 -14
  42. package/scss/coloreditor/_layout.scss +11 -1
  43. package/scss/coloreditor/_variables.scss +3 -3
  44. package/scss/colorgradient/_layout.scss +6 -4
  45. package/scss/colorpalette/_layout.scss +6 -0
  46. package/scss/colorpicker/_layout.scss +6 -1
  47. package/scss/colorpicker/_theme.scss +1 -1
  48. package/scss/combobox/_layout.scss +1 -1
  49. package/scss/combobox/_theme.scss +1 -1
  50. package/scss/combobox/_variables.scss +1 -31
  51. package/scss/common/_loading.scss +1 -13
  52. package/scss/dataviz/_variables.scss +6 -6
  53. package/scss/daterangepicker/_layout.scss +37 -1
  54. package/scss/datetimepicker/_layout.scss +56 -2
  55. package/scss/drawer/_layout.scss +6 -0
  56. package/scss/dropdownlist/_layout.scss +15 -0
  57. package/scss/editor/_layout.scss +24 -11
  58. package/scss/expansion-panel/_layout.scss +6 -1
  59. package/scss/fab/_layout.scss +30 -58
  60. package/scss/fab/_theme.scss +43 -48
  61. package/scss/fab/_variables.scss +129 -72
  62. package/scss/fab/index.md +0 -0
  63. package/scss/filter/_layout.scss +11 -0
  64. package/scss/floating-label/_layout.scss +7 -0
  65. package/scss/forms/_layout.scss +11 -10
  66. package/scss/gantt/_layout.scss +1 -1
  67. package/scss/grid/_layout.scss +132 -103
  68. package/scss/grid/_theme.scss +0 -6
  69. package/scss/grid/_variables.scss +7 -7
  70. package/scss/imageeditor/_layout.scss +10 -8
  71. package/scss/imageeditor/_variables.scss +1 -0
  72. package/scss/index.scss +1 -0
  73. package/scss/input/_layout.scss +53 -3
  74. package/scss/input/_theme.scss +43 -17
  75. package/scss/input/_variables.scss +40 -16
  76. package/scss/list/_index.scss +1 -0
  77. package/scss/list/_layout.scss +14 -3
  78. package/scss/list/_variables.scss +19 -19
  79. package/scss/listbox/_layout.scss +10 -0
  80. package/scss/listbox/_variables.scss +1 -1
  81. package/scss/listview/_layout.scss +2 -9
  82. package/scss/map/_layout.scss +24 -0
  83. package/scss/maskedtextbox/_layout.scss +1 -1
  84. package/scss/maskedtextbox/_theme.scss +1 -1
  85. package/scss/mediaplayer/_layout.scss +19 -1
  86. package/scss/menu/_layout.scss +66 -41
  87. package/scss/menu/_theme.scss +6 -1
  88. package/scss/menu/_variables.scss +56 -46
  89. package/scss/multiselect/_layout.scss +4 -1
  90. package/scss/multiselect/_theme.scss +4 -1
  91. package/scss/notification/_layout.scss +6 -0
  92. package/scss/numerictextbox/_layout.scss +6 -2
  93. package/scss/numerictextbox/_theme.scss +1 -1
  94. package/scss/numerictextbox/_variables.scss +1 -1
  95. package/scss/orgchart/_layout.scss +6 -0
  96. package/scss/orgchart/_variables.scss +2 -2
  97. package/scss/pager/_layout.scss +6 -2
  98. package/scss/pager/_variables.scss +1 -1
  99. package/scss/panelbar/_layout.scss +6 -0
  100. package/scss/pdf-viewer/_layout.scss +23 -16
  101. package/scss/pdf-viewer/_variables.scss +2 -5
  102. package/scss/pivotgrid/_layout.scss +58 -66
  103. package/scss/pivotgrid/_theme.scss +39 -72
  104. package/scss/popover/_layout.scss +6 -0
  105. package/scss/progressbar/_layout.scss +6 -0
  106. package/scss/radio/_index.scss +1 -1
  107. package/scss/radio/_layout.scss +123 -165
  108. package/scss/radio/_theme.scss +4 -4
  109. package/scss/radio/_variables.scss +69 -90
  110. package/scss/rating/_layout.scss +6 -1
  111. package/scss/scheduler/_layout.scss +32 -13
  112. package/scss/skeleton/_layout.scss +1 -1
  113. package/scss/slider/_layout.scss +71 -125
  114. package/scss/slider/_theme.scss +0 -6
  115. package/scss/spreadsheet/_layout.scss +32 -19
  116. package/scss/stepper/_layout.scss +6 -1
  117. package/scss/switch/_layout.scss +16 -1
  118. package/scss/switch/_variables.scss +3 -6
  119. package/scss/table/_layout.scss +27 -6
  120. package/scss/table/_theme.scss +3 -2
  121. package/scss/table/_variables.scss +15 -15
  122. package/scss/tabstrip/_layout.scss +17 -5
  123. package/scss/taskboard/_layout.scss +6 -2
  124. package/scss/textarea/_layout.scss +3 -1
  125. package/scss/timeline/_layout.scss +6 -4
  126. package/scss/timeselector/_layout.scss +3 -2
  127. package/scss/toolbar/_index.scss +1 -0
  128. package/scss/toolbar/_layout.scss +43 -2
  129. package/scss/toolbar/_theme.scss +41 -7
  130. package/scss/toolbar/_variables.scss +2 -0
  131. package/scss/tooltip/_layout.scss +6 -1
  132. package/scss/treelist/_layout.scss +4 -0
  133. package/scss/treeview/_layout.scss +116 -119
  134. package/scss/treeview/_theme.scss +39 -29
  135. package/scss/treeview/_variables.scss +67 -84
  136. package/scss/typography/_variables.scss +3 -3
  137. package/scss/upload/_layout.scss +6 -1
  138. package/scss/virtual-scroller/_index.scss +10 -0
  139. package/scss/virtual-scroller/_layout.scss +35 -0
  140. package/scss/virtual-scroller/_theme.scss +3 -0
  141. package/scss/virtual-scroller/_variables.scss +1 -0
  142. package/scss/window/_layout.scss +12 -2
  143. package/scss/window/_variables.scss +1 -1
@@ -86,36 +86,43 @@
86
86
 
87
87
  // Search
88
88
  .k-pdf-viewer-search-dialog {
89
- padding: $pdf-viewer-search-dialog-spacing;
89
+ padding: $pdf-viewer-search-dialog-padding;
90
90
 
91
91
  .k-search-container {
92
92
  display: flex;
93
+ gap: $pdf-viewer-search-dialog-spacing;
94
+ flex-flow: row nowrap;
93
95
  flex: 0 0 auto;
94
96
  justify-content: flex-start;
95
97
  align-items: center;
96
98
 
97
- .k-match-case-button {
98
- display: inline-flex;
99
- height: $pdf-viewer-search-dialog-input-button-height;
100
- justify-content: center;
99
+ .k-search-dialog-draghandle {
100
+ cursor: move;
101
+ margin-left: 0;
101
102
  }
102
103
 
103
- .k-search-matches {
104
- display: inline-block;
105
- min-width: $pdf-viewer-search-dialog-matches-width;
106
- margin: 0 $pdf-viewer-search-dialog-spacing 0 $pdf-viewer-search-dialog-button-spacing;
107
- vertical-align: middle;
108
- }
104
+ .k-textbox {
105
+ width: 10em;
106
+ flex: none;
109
107
 
110
- > .k-button {
111
- margin-left: $pdf-viewer-search-dialog-button-spacing;
108
+ .k-button {
109
+ border-width: 0;
110
+ }
112
111
  }
113
112
 
114
- .k-search-dialog-draghandle {
115
- cursor: move;
116
- margin-left: 0;
113
+ .k-search-matches {
114
+ flex: 1 1 auto;
117
115
  }
118
116
  }
119
117
  }
120
118
 
119
+
120
+ // IE
121
+ .k-ie .k-pdf-viewer-search-dialog {
122
+
123
+ .k-search-container > * + * {
124
+ margin-left: $pdf-viewer-search-dialog-spacing;
125
+ }
126
+ }
127
+
121
128
  }
@@ -24,11 +24,8 @@ $pdf-viewer-page-text: $component-text !default;
24
24
  $pdf-viewer-page-border: $component-border !default;
25
25
  $pdf-viewer-page-shadow: 0 0 ($pdf-viewer-page-spacing / 2) $pdf-viewer-page-border !default;
26
26
 
27
- $pdf-viewer-search-dialog-spacing: $toolbar-padding-x !default;
28
- $pdf-viewer-search-dialog-button-spacing: $pdf-viewer-search-dialog-spacing !default;
29
- $pdf-viewer-search-dialog-textbox-padding-x: $kendo-input-padding-y !default;
30
- $pdf-viewer-search-dialog-input-button-height: $line-height-em !default;
31
- $pdf-viewer-search-dialog-matches-width: 4.5em !default;
27
+ $pdf-viewer-search-dialog-padding: $toolbar-padding-x !default;
28
+ $pdf-viewer-search-dialog-spacing: $toolbar-spacing !default;
32
29
 
33
30
  $pdf-viewer-selection-line-height: $line-height-sm !default;
34
31
 
@@ -481,6 +481,7 @@
481
481
  border-style: solid;
482
482
  align-items: flex-start;
483
483
  flex-wrap: wrap;
484
+ box-shadow: none;
484
485
 
485
486
  > * {
486
487
  max-width: 100%;
@@ -491,32 +492,6 @@
491
492
  }
492
493
  }
493
494
 
494
- .k-pivot-toolbar .k-button {
495
- @include border-radius( $border-radius );
496
- padding: $kendo-button-padding-y $kendo-button-padding-x;
497
- padding-right: calc( #{$kendo-button-padding-x} + #{$icon-size * 3} );
498
- min-height: auto;
499
- font-size: $font-size;
500
- line-height: $kendo-button-line-height;
501
- text-align: left;
502
- white-space: normal;
503
- word-break: break-word;
504
- position: relative;
505
- cursor: move;
506
-
507
- .k-field-actions .k-setting-delete {
508
- box-sizing: content-box;
509
- }
510
- }
511
-
512
- .k-field-actions {
513
- position: absolute;
514
- right: $kendo-button-padding-y;
515
- top: $kendo-button-padding-y;
516
- line-height: 1;
517
- cursor: pointer;
518
- }
519
-
520
495
  .k-pivot-layout {
521
496
  border-spacing: 0;
522
497
  table-layout: auto;
@@ -539,6 +514,8 @@
539
514
  .k-pivot-rowheaders > .k-grid,
540
515
  .k-pivot-table > .k-grid {
541
516
  border-width: 0;
517
+ color: inherit;
518
+ background: none;
542
519
  }
543
520
 
544
521
  .k-pivot-rowheaders > .k-grid td:first-child,
@@ -602,58 +579,73 @@
602
579
  @include exports("pivotgrid/configurator/layout/legacy") {
603
580
 
604
581
 
605
- .k-fieldselector {
606
- border-width: 1px;
607
- border-style: solid;
582
+ // jquery specific -- old pivot
583
+ .k-pivotgrid-wrapper {
608
584
  box-sizing: border-box;
609
- outline: 0;
610
- font-family: $pivotgrid-font-family;
611
- font-size: $pivotgrid-font-size;
612
- line-height: $pivotgrid-line-height;
613
- -webkit-touch-callout: none;
614
- -webkit-tap-highlight-color: $rgba-transparent;
585
+ display: flex;
586
+ flex-flow: row nowrap;
587
+ align-items: flex-start;
588
+ gap: map-get( $spacing, 2 );
615
589
 
616
- .k-columns {
617
- display: flex;
618
- align-items: stretch;
619
-
620
- > div {
621
- padding: $table-cell-padding-y;
622
- width: 50%;
623
- box-sizing: border-box;
624
- border-width: 0;
625
- border-style: solid;
626
- float: left;
627
- overflow: auto;
628
- }
629
- > div + div {
630
- border-left-width: 1px;
631
- }
590
+ > .k-pivotgrid-configurator-panel {
591
+ max-width: 320px;
592
+ flex: none;
632
593
  }
594
+ > .k-pivot {
595
+ flex: 1;
596
+ }
597
+ }
598
+ .k-pivotgrid-configurator-panel.kendo-jquery {
599
+ box-sizing: border-box;
600
+ display: inline-flex;
633
601
 
634
-
635
- p {
636
- margin: 0 0 $padding-y-sm;
637
- text-transform: uppercase;
602
+ .k-pivotgrid-configurator {
603
+ height: 100%;
638
604
  }
639
- p .k-icon {
640
- margin: 0 $icon-spacing 0 0;
605
+
606
+ .k-pivotgrid-configurator-content {
607
+ padding: map-get( $spacing, 4 );
608
+ max-height: 100%;
609
+ display: flex;
610
+ flex-flow: column nowrap;
611
+ gap: map-get( $spacing, 4 );
612
+ overflow-x: hidden;
613
+ overflow-y: auto;
641
614
  }
642
615
 
616
+ .k-pivotgrid-targets {
617
+ display: flex;
618
+ flex-flow: column nowrap;
619
+ gap: map-get( $spacing, 4 );
620
+ }
643
621
 
644
- // Treeview
645
- .k-treeview {
646
- border-width: 0;
647
- overflow: visible;
622
+ .k-pivotgrid-configurator-section {
623
+ display: flex;
624
+ flex-flow: column nowrap;
625
+ gap: map-get( $spacing, 2 );
648
626
  }
649
627
 
650
- .k-edit-label {
651
- width: 16%;
628
+ .k-column-fields {
629
+ margin: 0;
630
+ padding: map-get( $spacing, 1 );
631
+ max-height: 200px;
632
+ border-width: 1px;
633
+ border-style: solid;
634
+ display: flex;
635
+ flex-flow: row wrap;
636
+ gap: map-get( $spacing, 1 );
637
+ overflow-x: hidden;
638
+ overflow-y: auto;
639
+
640
+ > * {
641
+ margin: 0;
642
+ }
652
643
  }
653
- .k-edit-field {
654
- width: 77%;
644
+ .k-ie & .k-column-fields {
645
+ > * {
646
+ margin: 2px;
647
+ }
655
648
  }
656
-
657
649
  }
658
650
 
659
651
  }
@@ -159,102 +159,59 @@
159
159
  @include exports("pivotgrid/theme/legacy") {
160
160
 
161
161
  .k-pivot {
162
+ @include fill (
163
+ $pivotgrid-text,
164
+ $pivotgrid-bg,
165
+ $pivotgrid-border
166
+ );
167
+ }
168
+ .k-pivot-table {
162
169
  border-color: $pivotgrid-border;
163
170
  }
164
171
 
165
- .k-alt,
166
- .k-pivot-layout > tbody > tr:first-child > td:first-child {
167
- background-color: $pivotgrid-alt-bg;
172
+ // Pivotgrid header
173
+ .k-pivot-rowheaders {
174
+ @include fill(
175
+ $pivotgrid-headers-text,
176
+ $pivotgrid-headers-bg,
177
+ $pivotgrid-headers-border
178
+ );
168
179
  }
169
180
 
170
- .k-fieldselector {
171
- color: $pivotgrid-configurator-text;
181
+
182
+ // Pivotgrid toolbar
183
+ .k-pivot-toolbar {
184
+ @include fill(
185
+ $pivotgrid-headers-text,
186
+ $pivotgrid-headers-bg,
187
+ $pivotgrid-headers-border
188
+ );
189
+
190
+ .k-empty {
191
+ color: $subtle-text;
192
+ }
172
193
  }
173
194
 
174
- .k-fieldselector .k-list-container {
175
- background-color: $pivotgrid-container-bg;
195
+ .k-alt {
196
+ background-color: $pivotgrid-alt-bg;
176
197
  }
177
198
 
178
199
  .k-pivot-toolbar,
179
200
  .k-pivot-table,
180
- .k-fieldselector,
181
- .k-fieldselector .k-list-container,
182
- .k-fieldselector .k-columns > div,
183
201
  .k-pivot-rowheaders > .k-grid td:first-child,
184
202
  .k-pivot-table .k-grid-header .k-header.k-first {
185
203
  border-color: $pivotgrid-chrome-border;
186
204
  }
187
205
 
188
- .k-pivot-rowheaders .k-alt .k-alt,
189
206
  .k-header.k-alt {
190
207
  background-color: $pivotgrid-row-headers-bg;
191
208
  }
192
209
 
193
- .k-pivot-toolbar .k-button {
194
- @include fill(
195
- $kendo-button-text,
196
- $kendo-button-bg,
197
- $kendo-button-border,
198
- $kendo-button-gradient
199
- );
200
-
201
- &:hover,
202
- &.k-state-hover {
203
- @include fill(
204
- $kendo-button-hover-text,
205
- $kendo-button-hover-bg,
206
- $kendo-button-hover-border,
207
- $kendo-button-hover-gradient
208
- );
209
- }
210
-
211
- // Pressed state
212
- &:active,
213
- &.k-state-active {
214
- @include fill(
215
- $kendo-button-active-text,
216
- $kendo-button-active-bg,
217
- $kendo-button-active-border,
218
- $kendo-button-active-gradient
219
- );
220
- }
221
-
222
- // Focused state
223
- &:focus,
224
- &.k-state-focus,
225
- &.k-state-focused {
226
- box-shadow: $kendo-button-focus-shadow;
227
- }
228
-
229
- &.k-empty {
230
- color: $subtle-text;
231
- }
232
- }
233
-
234
- .k-pivot-toolbar {
235
- .k-empty {
236
- color: $subtle-text;
237
- }
238
- }
239
-
240
- .k-pivot-layout .k-grid-footer,
241
- .k-pivot-layout .k-grid.k-alt {
210
+ .k-pivot-layout .k-grid-footer {
242
211
  color: $pivotgrid-alt-text;
243
212
  background-color: $pivotgrid-alt-bg;
244
213
  }
245
214
 
246
- // Loading indicator
247
- .k-fieldselector {
248
- .k-i-loading {
249
- border-color: $header-bg;
250
- }
251
-
252
- .k-i-loading::before,
253
- .k-i-loading::after {
254
- background-color: $header-bg;
255
- }
256
- }
257
-
258
215
  // KPI icons
259
216
  .k-i-kpi-trend-increase,
260
217
  .k-i-kpi-trend-decrease,
@@ -273,4 +230,14 @@
273
230
  .k-i-kpi-status-open {
274
231
  color: $success;
275
232
  }
233
+
234
+
235
+ // Configurator
236
+ .k-pivotgrid-configurator-panel.kendo-jquery {
237
+
238
+ .k-column-fields {
239
+ border-color: $component-border;
240
+ }
241
+
242
+ }
276
243
  }
@@ -16,6 +16,12 @@
16
16
  z-index: 12000;
17
17
  -webkit-touch-callout: none;
18
18
  -webkit-tap-highlight-color: $rgba-transparent;
19
+
20
+ *,
21
+ *::before,
22
+ *::after {
23
+ box-sizing: border-box;
24
+ }
19
25
  }
20
26
 
21
27
  // Header
@@ -18,6 +18,12 @@
18
18
  -webkit-touch-callout: none;
19
19
  -webkit-tap-highlight-color: $rgba-transparent;
20
20
 
21
+ *,
22
+ *::before,
23
+ *::after {
24
+ box-sizing: border-box;
25
+ }
26
+
21
27
 
22
28
  // Selection
23
29
  > .k-state-selected {
@@ -2,7 +2,7 @@
2
2
 
3
3
 
4
4
  // Dependencies
5
- @import "../common/_index.scss";
5
+ @import "../typography/_variables.scss";
6
6
  @import "../list/_variables.scss";
7
7
  @import "../checkbox/_variables.scss";
8
8