@syncfusion/ej2-ribbon 25.2.5 → 26.1.35

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 (112) hide show
  1. package/.eslintrc.json +3 -2
  2. package/dist/ej2-ribbon.umd.min.js +2 -2
  3. package/dist/ej2-ribbon.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-ribbon.es2015.js +821 -592
  5. package/dist/es6/ej2-ribbon.es2015.js.map +1 -1
  6. package/dist/es6/ej2-ribbon.es5.js +812 -577
  7. package/dist/es6/ej2-ribbon.es5.js.map +1 -1
  8. package/dist/global/ej2-ribbon.min.js +2 -2
  9. package/dist/global/ej2-ribbon.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +13 -13
  12. package/src/ribbon/base/interface.d.ts +14 -0
  13. package/src/ribbon/base/ribbon-model.d.ts +1 -1
  14. package/src/ribbon/base/ribbon.d.ts +3 -1
  15. package/src/ribbon/base/ribbon.js +195 -94
  16. package/src/ribbon/items/ribbon-button.js +6 -1
  17. package/src/ribbon/items/ribbon-gallery.d.ts +15 -6
  18. package/src/ribbon/items/ribbon-gallery.js +164 -96
  19. package/src/ribbon/items/ribbon-groupbutton.d.ts +1 -0
  20. package/src/ribbon/items/ribbon-groupbutton.js +11 -3
  21. package/src/ribbon/models/ribbon-contextual-tab-settings-model.d.ts +1 -1
  22. package/src/ribbon/models/ribbon-gallery-group-model.d.ts +5 -5
  23. package/src/ribbon/models/ribbon-gallery-group.d.ts +2 -2
  24. package/src/ribbon/models/ribbon-gallery-group.js +2 -2
  25. package/src/ribbon/models/ribbon-gallery-item-model.d.ts +5 -5
  26. package/src/ribbon/models/ribbon-gallery-item.d.ts +1 -1
  27. package/src/ribbon/models/ribbon-gallery-item.js +1 -1
  28. package/src/ribbon/models/ribbon-gallery-settings-model.d.ts +1 -1
  29. package/src/ribbon/models/ribbon-gallery-settings.d.ts +3 -3
  30. package/src/ribbon/models/ribbon-gallery-settings.js +2 -2
  31. package/src/ribbon/modules/ribbon-backstage.d.ts +6 -3
  32. package/src/ribbon/modules/ribbon-backstage.js +65 -12
  33. package/src/ribbon/modules/ribbon-contextualtab.js +5 -2
  34. package/src/ribbon/modules/ribbon-keytip.d.ts +1 -0
  35. package/src/ribbon/modules/ribbon-keytip.js +58 -46
  36. package/styles/bootstrap-dark.css +452 -269
  37. package/styles/bootstrap-dark.scss +18 -1
  38. package/styles/bootstrap.css +456 -276
  39. package/styles/bootstrap.scss +18 -1
  40. package/styles/bootstrap4.css +455 -272
  41. package/styles/bootstrap4.scss +18 -1
  42. package/styles/bootstrap5-dark.css +470 -278
  43. package/styles/bootstrap5-dark.scss +18 -1
  44. package/styles/bootstrap5.css +470 -278
  45. package/styles/bootstrap5.scss +18 -1
  46. package/styles/fabric-dark.css +451 -269
  47. package/styles/fabric-dark.scss +18 -1
  48. package/styles/fabric.css +450 -272
  49. package/styles/fabric.scss +18 -1
  50. package/styles/fluent-dark.css +472 -277
  51. package/styles/fluent-dark.scss +18 -1
  52. package/styles/fluent.css +472 -277
  53. package/styles/fluent.scss +18 -1
  54. package/styles/fluent2.css +3868 -0
  55. package/styles/fluent2.scss +18 -0
  56. package/styles/highcontrast-light.css +445 -263
  57. package/styles/highcontrast-light.scss +17 -1
  58. package/styles/highcontrast.css +451 -273
  59. package/styles/highcontrast.scss +18 -1
  60. package/styles/material-dark.css +540 -283
  61. package/styles/material-dark.scss +18 -1
  62. package/styles/material.css +539 -289
  63. package/styles/material.scss +18 -1
  64. package/styles/material3-dark.css +496 -280
  65. package/styles/material3-dark.scss +18 -1
  66. package/styles/material3.css +496 -280
  67. package/styles/material3.scss +18 -1
  68. package/styles/ribbon/_bds-definition.scss +56 -20
  69. package/styles/ribbon/_bootstrap-dark-definition.scss +56 -20
  70. package/styles/ribbon/_bootstrap-definition.scss +57 -21
  71. package/styles/ribbon/_bootstrap4-definition.scss +57 -21
  72. package/styles/ribbon/_bootstrap5-definition.scss +57 -21
  73. package/styles/ribbon/_bootstrap5.3-definition.scss +396 -0
  74. package/styles/ribbon/_fabric-dark-definition.scss +55 -19
  75. package/styles/ribbon/_fabric-definition.scss +56 -20
  76. package/styles/ribbon/_fluent-definition.scss +59 -23
  77. package/styles/ribbon/_fluent2-definition.scss +396 -0
  78. package/styles/ribbon/_fusionnew-definition.scss +50 -14
  79. package/styles/ribbon/_highcontrast-definition.scss +58 -22
  80. package/styles/ribbon/_highcontrast-light-definition.scss +49 -13
  81. package/styles/ribbon/_layout.scss +359 -399
  82. package/styles/ribbon/_material-dark-definition.scss +56 -20
  83. package/styles/ribbon/_material-definition.scss +56 -20
  84. package/styles/ribbon/_material3-definition.scss +56 -19
  85. package/styles/ribbon/_tailwind-definition.scss +56 -20
  86. package/styles/ribbon/_theme.scss +118 -170
  87. package/styles/ribbon/bootstrap-dark.css +452 -269
  88. package/styles/ribbon/bootstrap.css +456 -276
  89. package/styles/ribbon/bootstrap4.css +455 -272
  90. package/styles/ribbon/bootstrap5-dark.css +470 -278
  91. package/styles/ribbon/bootstrap5.css +470 -278
  92. package/styles/ribbon/fabric-dark.css +451 -269
  93. package/styles/ribbon/fabric.css +450 -272
  94. package/styles/ribbon/fluent-dark.css +472 -277
  95. package/styles/ribbon/fluent.css +472 -277
  96. package/styles/ribbon/fluent2.css +3868 -0
  97. package/styles/ribbon/fluent2.scss +18 -0
  98. package/styles/ribbon/highcontrast-light.css +445 -263
  99. package/styles/ribbon/highcontrast.css +451 -273
  100. package/styles/ribbon/icons/_bootstrap5.3.scss +9 -0
  101. package/styles/ribbon/icons/_fluent2.scss +9 -0
  102. package/styles/ribbon/material-dark.css +540 -283
  103. package/styles/ribbon/material.css +539 -289
  104. package/styles/ribbon/material3-dark.css +496 -280
  105. package/styles/ribbon/material3.css +496 -280
  106. package/styles/ribbon/tailwind-dark.css +506 -280
  107. package/styles/ribbon/tailwind.css +506 -280
  108. package/styles/tailwind-dark.css +506 -280
  109. package/styles/tailwind-dark.scss +18 -1
  110. package/styles/tailwind.css +506 -280
  111. package/styles/tailwind.scss +18 -1
  112. package/CHANGELOG.md +0 -101
@@ -13,7 +13,8 @@
13
13
 
14
14
  .e-popup.e-ddl {
15
15
  border-radius: 4px;
16
- box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
16
+ -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
17
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
17
18
  margin-top: 3px;
18
19
  }
19
20
  .e-popup.e-ddl .e-input-group {
@@ -28,6 +29,7 @@
28
29
  }
29
30
 
30
31
  .e-popup.e-ddl .e-filter-parent .e-input-group {
32
+ display: -webkit-box;
31
33
  display: -ms-flexbox;
32
34
  display: flex;
33
35
  width: auto;
@@ -86,7 +88,8 @@
86
88
  .e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-input-group-icon:active,
87
89
  .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:active,
88
90
  .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:active {
89
- box-shadow: none;
91
+ -webkit-box-shadow: none;
92
+ box-shadow: none;
90
93
  }
91
94
 
92
95
  .e-ddl.e-popup .e-filter-parent {
@@ -122,6 +125,7 @@
122
125
 
123
126
  .e-ribbon.e-rbn {
124
127
  display: block;
128
+ border-radius: unset;
125
129
  }
126
130
  .e-ribbon.e-rbn .e-ribbon-tab .e-toolbar {
127
131
  min-height: auto;
@@ -132,14 +136,15 @@
132
136
  }
133
137
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu,
134
138
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage {
135
- position: absolute;
139
+ font-size: 14px;
140
+ font-weight: 400;
136
141
  line-height: 22px;
142
+ position: absolute;
137
143
  padding: 12px 15px 14px;
138
144
  border: none;
139
145
  border-width: unset;
140
- font-size: 14px;
141
- font-weight: 400;
142
- box-shadow: none;
146
+ -webkit-box-shadow: none;
147
+ box-shadow: none;
143
148
  text-transform: none;
144
149
  }
145
150
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active,
@@ -149,16 +154,19 @@
149
154
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active, .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu:focus,
150
155
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage.e-active,
151
156
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage:focus {
152
- box-shadow: none;
157
+ -webkit-box-shadow: none;
158
+ box-shadow: none;
153
159
  outline: none;
154
160
  }
155
161
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template {
156
162
  position: absolute;
157
163
  top: 0;
164
+ display: -webkit-box;
158
165
  display: -ms-flexbox;
159
166
  display: flex;
160
- -ms-flex-align: center;
161
- align-items: center;
167
+ -webkit-box-align: center;
168
+ -ms-flex-align: center;
169
+ align-items: center;
162
170
  height: 48px;
163
171
  padding-right: 16px;
164
172
  border-bottom: none;
@@ -178,8 +186,8 @@
178
186
  z-index: 1;
179
187
  }
180
188
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-items {
181
- min-height: auto;
182
189
  height: 48px;
190
+ min-height: auto;
183
191
  }
184
192
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-items:not(.e-tbar-pos) .e-toolbar-item:first-child,
185
193
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-items:not(.e-tbar-pos) .e-toolbar-item:last-child {
@@ -189,6 +197,11 @@
189
197
  vertical-align: unset;
190
198
  margin: 0;
191
199
  border: none;
200
+ border-radius: unset;
201
+ }
202
+ .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
203
+ height: auto;
204
+ min-height: auto;
192
205
  }
193
206
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-active {
194
207
  border: none;
@@ -202,12 +215,12 @@
202
215
  border: none;
203
216
  }
204
217
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-tab-text {
205
- padding: 12px 15px 14px;
218
+ font-size: 14px;
219
+ font-weight: 400;
206
220
  line-height: 22px;
221
+ padding: 12px 15px 14px;
207
222
  text-transform: none;
208
223
  margin: 0;
209
- font-size: 14px;
210
- font-weight: 400;
211
224
  }
212
225
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-text-wrap {
213
226
  height: auto;
@@ -215,12 +228,12 @@
215
228
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-active .e-text-wrap::before {
216
229
  display: none;
217
230
  }
218
- .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item:not(.e-separator) {
219
- height: auto;
220
- min-height: auto;
231
+ .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-active .e-text-wrap .e-tab-text {
232
+ font-weight: 400;
221
233
  }
222
234
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
223
- box-shadow: none;
235
+ -webkit-box-shadow: none;
236
+ box-shadow: none;
224
237
  }
225
238
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
226
239
  padding: 0;
@@ -231,7 +244,8 @@
231
244
  min-width: auto;
232
245
  width: auto;
233
246
  border-style: solid;
234
- transform: none;
247
+ -webkit-transform: none;
248
+ transform: none;
235
249
  border-width: 1px;
236
250
  border-radius: 2px;
237
251
  z-index: 3;
@@ -241,13 +255,14 @@
241
255
  }
242
256
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
243
257
  font-size: 16px;
244
- height: auto;
245
- transform: none;
258
+ font-weight: 400;
246
259
  line-height: 16px;
260
+ height: auto;
261
+ -webkit-transform: none;
262
+ transform: none;
247
263
  padding: 0 4px;
248
264
  width: auto;
249
265
  letter-spacing: unset;
250
- font-weight: 400;
251
266
  }
252
267
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow::before {
253
268
  font-size: 16px;
@@ -274,7 +289,8 @@
274
289
  border: none;
275
290
  }
276
291
  .e-ribbon.e-rbn .e-ribbon-collapse-btn:not(.e-ribbon-expand-btn) {
277
- transform: rotate(180deg);
292
+ -webkit-transform: rotate(180deg);
293
+ transform: rotate(180deg);
278
294
  }
279
295
  .e-ribbon.e-rbn.e-ribbon-overflow .e-content {
280
296
  width: calc(100% - 20px - 40px);
@@ -287,7 +303,8 @@
287
303
  border: none;
288
304
  height: 32px;
289
305
  margin: auto;
290
- box-shadow: none;
306
+ -webkit-box-shadow: none;
307
+ box-shadow: none;
291
308
  }
292
309
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
293
310
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -309,24 +326,28 @@
309
326
  bottom: 4px;
310
327
  position: absolute;
311
328
  }
329
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-ribbon-hide {
330
+ display: none;
331
+ }
312
332
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-container {
333
+ display: -webkit-inline-box;
313
334
  display: -ms-inline-flexbox;
314
335
  display: inline-flex;
315
336
  }
316
- .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-ribbon-hide {
317
- display: none;
318
- }
319
337
  .e-ribbon.e-rbn.e-ribbon-minimize .e-ribbon-tab .e-content, .e-ribbon.e-rbn.e-ribbon-minimize .e-ribbon-collapse-btn, .e-ribbon.e-rbn.e-ribbon-minimize .e-ribbon-overall-of-btn {
320
338
  display: none;
321
339
  }
340
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
341
+ height: 36px;
342
+ }
322
343
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper {
323
- height: 30px;
344
+ margin: 4px 6px;
324
345
  }
325
346
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
326
- padding: 5px 0;
327
347
  width: 78px;
328
- margin: 2px;
329
- max-height: 26px;
348
+ margin: 0 2px;
349
+ border-radius: 4px;
350
+ max-height: 28px;
330
351
  }
331
352
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item.e-disabled {
332
353
  pointer-events: none;
@@ -354,15 +375,17 @@
354
375
  display: none;
355
376
  }
356
377
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-container {
357
- padding: 0 4px 0;
378
+ padding: 0 4px;
358
379
  }
359
380
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content {
360
381
  padding: 0;
361
382
  height: 40px;
362
- -ms-flex-align: center;
363
- align-items: center;
383
+ -webkit-box-align: center;
384
+ -ms-flex-align: center;
385
+ align-items: center;
364
386
  }
365
387
  .e-ribbon.e-rbn .e-ribbon-tab-item {
388
+ display: -webkit-inline-box;
366
389
  display: -ms-inline-flexbox;
367
390
  display: inline-flex;
368
391
  }
@@ -420,29 +443,37 @@
420
443
  }
421
444
 
422
445
  .e-ribbon-backstage-popup.e-ribbon-backstage-open {
446
+ display: -webkit-box;
423
447
  display: -ms-flexbox;
424
448
  display: flex;
425
449
  }
426
-
427
450
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper {
451
+ display: -webkit-box;
428
452
  display: -ms-flexbox;
429
453
  display: flex;
430
- -ms-flex-direction: column;
431
- flex-direction: column;
454
+ -webkit-box-orient: vertical;
455
+ -webkit-box-direction: normal;
456
+ -ms-flex-direction: column;
457
+ flex-direction: column;
432
458
  }
433
459
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-items-wrapper {
460
+ display: -webkit-box;
434
461
  display: -ms-flexbox;
435
462
  display: flex;
436
- -ms-flex-direction: column;
437
- flex-direction: column;
438
- -ms-flex-pack: justify;
439
- justify-content: space-between;
463
+ -webkit-box-orient: vertical;
464
+ -webkit-box-direction: normal;
465
+ -ms-flex-direction: column;
466
+ flex-direction: column;
467
+ -webkit-box-pack: justify;
468
+ -ms-flex-pack: justify;
469
+ justify-content: space-between;
440
470
  height: 100%;
441
471
  }
442
472
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-btn {
443
473
  border: none;
444
474
  border-radius: unset;
445
- box-shadow: none;
475
+ -webkit-box-shadow: none;
476
+ box-shadow: none;
446
477
  padding: unset;
447
478
  text-align: start;
448
479
  width: 100%;
@@ -450,10 +481,10 @@
450
481
  line-height: 48px;
451
482
  }
452
483
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-btn .e-btn-icon {
453
- width: auto;
454
- margin: 0;
455
484
  font-size: 16px;
456
485
  line-height: 16px;
486
+ width: auto;
487
+ margin: 0;
457
488
  padding: 16px;
458
489
  }
459
490
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-btn:focus {
@@ -496,10 +527,10 @@
496
527
  border-width: 2px;
497
528
  }
498
529
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:not(.e-separator) .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:not(.e-separator) .e-menu-icon {
499
- width: auto;
500
- margin-right: unset;
501
530
  font-size: 16px;
502
531
  line-height: 16px;
532
+ width: auto;
533
+ margin-right: unset;
503
534
  padding: 16px;
504
535
  }
505
536
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:not(.e-separator).e-blankicon, .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:not(.e-separator).e-blankicon {
@@ -518,32 +549,36 @@
518
549
  .e-ribbon-group-overflow-ddb {
519
550
  border: none;
520
551
  }
552
+ .e-ribbon.e-rbn .e-disabled,
553
+ .e-ribbon-group-overflow-ddb .e-disabled {
554
+ opacity: 0.35;
555
+ }
521
556
  .e-ribbon.e-rbn .e-input-group,
522
557
  .e-ribbon-group-overflow-ddb .e-input-group {
523
558
  height: 32px;
524
559
  border-radius: 2px;
525
- margin-bottom: 4px;
560
+ margin: 0 0 4px;
526
561
  }
527
562
  .e-ribbon.e-rbn .e-input-group input.e-input,
528
563
  .e-ribbon-group-overflow-ddb .e-input-group input.e-input {
529
- padding: 5px 0 5px 8px;
530
564
  font-size: 14px;
531
- line-height: 22px;
532
565
  font-weight: 400;
566
+ line-height: 22px;
533
567
  height: auto;
534
568
  min-height: auto;
569
+ padding: 5px 0 5px 8px;
535
570
  }
536
571
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-input-group-icon,
537
572
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-input-group-icon {
538
573
  font-size: 16px;
574
+ font-weight: 400;
539
575
  line-height: 16px;
540
576
  height: auto;
577
+ min-height: auto;
541
578
  padding: 8px 4px 8px 2px;
542
579
  margin: 0;
543
- font-weight: 400;
544
580
  border: none;
545
581
  min-width: auto;
546
- min-height: auto;
547
582
  border-radius: unset;
548
583
  }
549
584
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-input-group-icon.e-ddl-icon,
@@ -570,16 +605,19 @@
570
605
  }
571
606
  .e-ribbon.e-rbn .e-ribbon-group-header,
572
607
  .e-ribbon-group-overflow-ddb .e-ribbon-group-header {
573
- -ms-flex-align: center;
574
- align-items: center;
608
+ font-size: 10px;
609
+ line-height: 15px;
610
+ -webkit-box-align: center;
611
+ -ms-flex-align: center;
612
+ align-items: center;
613
+ display: -webkit-box;
575
614
  display: -ms-flexbox;
576
615
  display: flex;
577
- -ms-flex-pack: center;
578
- justify-content: center;
616
+ -webkit-box-pack: center;
617
+ -ms-flex-pack: center;
618
+ justify-content: center;
579
619
  white-space: nowrap;
580
620
  padding: 8px 11px 3px 11px;
581
- line-height: 15px;
582
- font-size: 10px;
583
621
  }
584
622
  .e-ribbon.e-rbn .e-ribbon-launcher-icon,
585
623
  .e-ribbon-group-overflow-ddb .e-ribbon-launcher-icon {
@@ -608,22 +646,29 @@
608
646
  }
609
647
  .e-ribbon.e-rbn .e-ribbon-column,
610
648
  .e-ribbon-group-overflow-ddb .e-ribbon-column {
649
+ display: -webkit-inline-box;
611
650
  display: -ms-inline-flexbox;
612
651
  display: inline-flex;
613
- -ms-flex-direction: row;
614
- flex-direction: row;
652
+ -webkit-box-orient: horizontal;
653
+ -webkit-box-direction: normal;
654
+ -ms-flex-direction: row;
655
+ flex-direction: row;
615
656
  }
616
657
  .e-ribbon.e-rbn .e-ribbon-row,
617
658
  .e-ribbon-group-overflow-ddb .e-ribbon-row {
659
+ display: -webkit-inline-box;
618
660
  display: -ms-inline-flexbox;
619
661
  display: inline-flex;
620
- -ms-flex-direction: column;
621
- flex-direction: column;
662
+ -webkit-box-orient: vertical;
663
+ -webkit-box-direction: normal;
664
+ -ms-flex-direction: column;
665
+ flex-direction: column;
622
666
  }
623
667
  .e-ribbon.e-rbn .e-ribbon-group-overflow,
624
668
  .e-ribbon.e-rbn .e-ribbon-item,
625
669
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow,
626
670
  .e-ribbon-group-overflow-ddb .e-ribbon-item {
671
+ display: -webkit-box;
627
672
  display: -ms-flexbox;
628
673
  display: flex;
629
674
  padding: 1px;
@@ -633,23 +678,29 @@
633
678
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper,
634
679
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-gallery-wrapper,
635
680
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-gallery-wrapper {
636
- height: 80px;
681
+ display: -webkit-box;
637
682
  display: -ms-flexbox;
638
683
  display: flex;
684
+ margin: 9px 6px;
639
685
  }
640
686
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
641
687
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
642
688
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
643
689
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
644
- max-height: 80px;
690
+ max-height: 90px;
691
+ margin: 0 2px;
692
+ border-radius: 8px;
645
693
  }
646
694
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-gallery-button,
647
695
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-button,
648
696
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-gallery-button,
649
697
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-gallery-button {
650
- padding: 0;
698
+ padding: 0 4px;
651
699
  border-width: 0 0 0 1px;
652
700
  border-radius: 0 4px 4px 0;
701
+ line-height: 8px;
702
+ font-weight: 400;
703
+ font-size: 8px;
653
704
  }
654
705
  .e-ribbon.e-rbn .e-ribbon-group-overflow.e-hidden,
655
706
  .e-ribbon.e-rbn .e-ribbon-item.e-hidden,
@@ -666,7 +717,8 @@
666
717
  font-weight: 400;
667
718
  font-size: 12px;
668
719
  text-transform: none;
669
- box-shadow: none;
720
+ -webkit-box-shadow: none;
721
+ box-shadow: none;
670
722
  }
671
723
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
672
724
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -688,21 +740,28 @@
688
740
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn,
689
741
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn,
690
742
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn {
691
- max-width: 10ch;
743
+ height: 100%;
692
744
  min-height: inherit;
745
+ display: -webkit-box;
746
+ display: -ms-flexbox;
747
+ display: flex;
748
+ -webkit-box-orient: vertical;
749
+ -webkit-box-direction: normal;
750
+ -ms-flex-direction: column;
751
+ flex-direction: column;
752
+ max-width: 10ch;
753
+ min-width: -webkit-fit-content;
754
+ min-width: -moz-fit-content;
693
755
  min-width: fit-content;
694
756
  white-space: normal;
695
757
  padding: 0 3px;
696
758
  line-height: 18px;
697
- height: 100%;
698
- display: -ms-flexbox;
699
- display: flex;
700
- -ms-flex-direction: column;
701
- flex-direction: column;
702
- -ms-flex-pack: start;
703
- justify-content: flex-start;
704
- -ms-flex-align: center;
705
- align-items: center;
759
+ -webkit-box-pack: start;
760
+ -ms-flex-pack: start;
761
+ justify-content: flex-start;
762
+ -webkit-box-align: center;
763
+ -ms-flex-align: center;
764
+ align-items: center;
706
765
  }
707
766
  .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item .e-btn.e-ribbon-group-overflow-ddb,
708
767
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn.e-ribbon-group-overflow-ddb,
@@ -734,17 +793,24 @@
734
793
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn,
735
794
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn,
736
795
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn {
737
- -ms-flex-pack: space-evenly;
738
- justify-content: space-evenly;
796
+ -webkit-box-pack: space-evenly;
797
+ -ms-flex-pack: space-evenly;
798
+ justify-content: space-evenly;
739
799
  height: 50%;
740
800
  }
801
+ .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top,
802
+ .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top,
803
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top,
804
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item > .e-split-btn-wrapper.e-vertical .e-btn .e-icon-top {
805
+ height: 100%;
806
+ }
741
807
  .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item .e-dropdown-btn .e-caret,
742
808
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-dropdown-btn .e-caret,
743
809
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-dropdown-btn .e-caret,
744
810
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-dropdown-btn .e-caret {
745
811
  font-size: 16px;
746
- padding: 0 13px;
747
812
  line-height: 16px;
813
+ padding: 0 13px;
748
814
  }
749
815
  .e-ribbon.e-rbn .e-ribbon-group-overflow,
750
816
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow {
@@ -761,14 +827,26 @@
761
827
  padding: 0;
762
828
  border-style: solid;
763
829
  border-width: 1px;
764
- border-radius: 4px;
830
+ }
831
+ .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)),
832
+ .e-ribbon-group-overflow-ddb .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
833
+ height: 108px;
834
+ border-radius: 2px;
765
835
  }
766
836
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group,
767
837
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group {
768
- box-shadow: none;
838
+ -webkit-box-shadow: none;
839
+ box-shadow: none;
769
840
  }
770
841
  .e-ribbon.e-rbn .e-ribbon-item .e-checkbox-wrapper,
771
842
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-checkbox-wrapper {
843
+ height: -webkit-fit-content;
844
+ height: -moz-fit-content;
845
+ height: fit-content;
846
+ margin: auto 0;
847
+ width: -webkit-max-content;
848
+ width: -moz-max-content;
849
+ width: max-content;
772
850
  padding: 0 8px;
773
851
  }
774
852
  .e-ribbon.e-rbn .e-ribbon-item .e-checkbox-wrapper .e-label,
@@ -777,18 +855,13 @@
777
855
  }
778
856
  .e-ribbon.e-rbn .e-ribbon-item .e-btn,
779
857
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn {
780
- box-shadow: none;
858
+ -webkit-box-shadow: none;
859
+ box-shadow: none;
781
860
  }
782
861
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:disabled,
783
862
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:disabled {
784
863
  pointer-events: none;
785
864
  }
786
- .e-ribbon.e-rbn .e-ribbon-item .e-checkbox-wrapper,
787
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-checkbox-wrapper {
788
- height: fit-content;
789
- margin: auto 0;
790
- width: max-content;
791
- }
792
865
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
793
866
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
794
867
  border: 1px solid transparent;
@@ -802,7 +875,8 @@
802
875
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
803
876
  border: 1px solid transparent;
804
877
  border-radius: 2px;
805
- box-shadow: none;
878
+ -webkit-box-shadow: none;
879
+ box-shadow: none;
806
880
  }
807
881
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
808
882
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -859,8 +933,8 @@
859
933
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-dropdown-btn .e-caret,
860
934
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-dropdown-btn .e-caret {
861
935
  font-size: 16px;
862
- padding: 2px 4px;
863
936
  line-height: 16px;
937
+ padding: 2px 4px;
864
938
  margin: 0;
865
939
  width: auto;
866
940
  }
@@ -871,8 +945,10 @@
871
945
  }
872
946
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn,
873
947
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn {
874
- -ms-flex-align: center;
875
- align-items: center;
948
+ -webkit-box-align: center;
949
+ -ms-flex-align: center;
950
+ align-items: center;
951
+ display: -webkit-box;
876
952
  display: -ms-flexbox;
877
953
  display: flex;
878
954
  }
@@ -885,11 +961,6 @@
885
961
  margin: 8px;
886
962
  padding: 0;
887
963
  }
888
- .e-ribbon.e-rbn .e-ribbon-vertical-center:not(.e-ribbon-large-item),
889
- .e-ribbon-group-overflow-ddb .e-ribbon-vertical-center:not(.e-ribbon-large-item) {
890
- margin-bottom: auto;
891
- margin-top: auto;
892
- }
893
964
  .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-item.e-ribbon-small-item .e-btn:not(.e-icon-btn, .e-dropdown-btn), .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-item.e-ribbon-medium-item .e-btn:not(.e-icon-btn, .e-dropdown-btn),
894
965
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-item.e-ribbon-small-item .e-btn:not(.e-icon-btn, .e-dropdown-btn),
895
966
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-item.e-ribbon-medium-item .e-btn:not(.e-icon-btn, .e-dropdown-btn) {
@@ -923,12 +994,15 @@
923
994
  }
924
995
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-dropdown.e-btn {
925
996
  padding: 0;
997
+ display: -webkit-box;
926
998
  display: -ms-flexbox;
927
999
  display: flex;
928
- -ms-flex-align: center;
929
- align-items: center;
930
- -ms-flex-pack: start;
931
- justify-content: flex-start;
1000
+ -webkit-box-align: center;
1001
+ -ms-flex-align: center;
1002
+ align-items: center;
1003
+ -webkit-box-pack: start;
1004
+ -ms-flex-pack: start;
1005
+ justify-content: flex-start;
932
1006
  width: 100%;
933
1007
  }
934
1008
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-dropdown.e-btn .e-btn-icon {
@@ -936,18 +1010,12 @@
936
1010
  }
937
1011
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-wrapper.e-hidden,
938
1012
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-container.e-hidden,
939
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-button.e-hidden {
940
- display: none;
941
- }
942
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
943
- display: none;
944
- }
945
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
946
- pointer-events: none;
947
- }
948
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
1013
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-gallery-button.e-hidden,
1014
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden,
1015
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
949
1016
  display: none;
950
1017
  }
1018
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled,
951
1019
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {
952
1020
  pointer-events: none;
953
1021
  }
@@ -960,16 +1028,19 @@
960
1028
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-combobox-label,
961
1029
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-colorpicker-label {
962
1030
  white-space: nowrap;
1031
+ display: -webkit-box;
963
1032
  display: -ms-flexbox;
964
1033
  display: flex;
965
- -ms-flex-align: center;
966
- align-items: center;
1034
+ -webkit-box-align: center;
1035
+ -ms-flex-align: center;
1036
+ align-items: center;
967
1037
  font-weight: 400;
968
1038
  font-size: 12px;
969
1039
  }
970
1040
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:has(.e-colorpicker-wrapper) {
971
- -ms-flex-align: center;
972
- align-items: center;
1041
+ -webkit-box-align: center;
1042
+ -ms-flex-align: center;
1043
+ align-items: center;
973
1044
  }
974
1045
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
975
1046
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
@@ -1001,14 +1072,15 @@
1001
1072
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-split-btn,
1002
1073
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
1003
1074
  width: 100%;
1004
- -ms-flex-pack: start;
1005
- justify-content: flex-start;
1075
+ -webkit-box-pack: start;
1076
+ -ms-flex-pack: start;
1077
+ justify-content: flex-start;
1006
1078
  }
1007
1079
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
1008
- padding: 5px 0 5px 12px;
1009
1080
  font-size: 14px;
1010
1081
  font-weight: 400;
1011
1082
  line-height: 18px;
1083
+ padding: 5px 0 5px 12px;
1012
1084
  height: 24px;
1013
1085
  }
1014
1086
 
@@ -1019,12 +1091,16 @@
1019
1091
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1020
1092
  padding: 7px 8px 7px 12px;
1021
1093
  }
1022
- .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1094
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1095
+ padding-left: 36px;
1096
+ }
1097
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper, .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper {
1023
1098
  margin-left: 36px;
1024
1099
  }
1025
1100
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1026
1101
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1027
- transform: rotate(-90deg);
1102
+ -webkit-transform: rotate(-90deg);
1103
+ transform: rotate(-90deg);
1028
1104
  padding: 0 12px;
1029
1105
  margin: 0 0 0 auto;
1030
1106
  }
@@ -1039,12 +1115,16 @@
1039
1115
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1040
1116
  padding: 7px 12px 7px 8px;
1041
1117
  }
1042
- .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1118
+ .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1119
+ padding-right: 36px;
1120
+ }
1121
+ .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper, .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper {
1043
1122
  margin-right: 36px;
1044
1123
  }
1045
1124
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1046
1125
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1047
- transform: rotate(90deg);
1126
+ -webkit-transform: rotate(90deg);
1127
+ transform: rotate(90deg);
1048
1128
  padding: 0 12px;
1049
1129
  margin: 0 auto 0 0;
1050
1130
  }
@@ -1052,11 +1132,6 @@
1052
1132
  margin: 7px 12px 7px 0;
1053
1133
  }
1054
1134
 
1055
- .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group:not(.e-icon-btn) {
1056
- -ms-flex-direction: column;
1057
- flex-direction: column;
1058
- }
1059
-
1060
1135
  .e-dropdown-popup.e-ribbon-dropdown-group-button {
1061
1136
  border-radius: 2px;
1062
1137
  border: 1px solid;
@@ -1070,12 +1145,15 @@
1070
1145
  }
1071
1146
  .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group .e-btn.e-ribbon-group-button:not(.e-icon-btn) {
1072
1147
  width: 100%;
1148
+ display: -webkit-box;
1073
1149
  display: -ms-flexbox;
1074
1150
  display: flex;
1075
- -ms-flex-align: center;
1076
- align-items: center;
1077
- -ms-flex-pack: start;
1078
- justify-content: flex-start;
1151
+ -webkit-box-align: center;
1152
+ -ms-flex-align: center;
1153
+ align-items: center;
1154
+ -webkit-box-pack: start;
1155
+ -ms-flex-pack: start;
1156
+ justify-content: flex-start;
1079
1157
  }
1080
1158
  .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group:has(.e-ribbon-group-button-content) .e-btn.e-ribbon-group-button:first-of-type {
1081
1159
  border-top-right-radius: 4px;
@@ -1089,14 +1167,21 @@
1089
1167
  border-bottom-right-radius: 4px;
1090
1168
  border-bottom-left-radius: 4px;
1091
1169
  }
1170
+ .e-dropdown-popup.e-ribbon-dropdown-group-button.e-ribbon-group-button-overflow-popup .e-btn-group:not(.e-icon-btn) {
1171
+ -webkit-box-orient: vertical;
1172
+ -webkit-box-direction: normal;
1173
+ -ms-flex-direction: column;
1174
+ flex-direction: column;
1175
+ }
1092
1176
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group {
1093
- box-shadow: none;
1177
+ -webkit-box-shadow: none;
1178
+ box-shadow: none;
1094
1179
  border-radius: 2px;
1095
1180
  }
1096
1181
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group .e-btn-icon {
1097
1182
  font-size: 16px;
1098
- line-height: 16px;
1099
1183
  font-weight: 400;
1184
+ line-height: 16px;
1100
1185
  margin: 8px;
1101
1186
  width: auto;
1102
1187
  }
@@ -1115,25 +1200,31 @@
1115
1200
  }
1116
1201
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group .e-btn.e-ribbon-group-button:focus, .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-group .e-btn.e-ribbon-group-button:focus-visible {
1117
1202
  outline: none;
1118
- box-shadow: none !important; /* stylelint-disable-line declaration-no-important */
1203
+ -webkit-box-shadow: none !important;
1204
+ box-shadow: none !important; /* stylelint-disable-line declaration-no-important */
1205
+ }
1206
+
1207
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-popup-container .e-ribbon-gallery-header:first-child,
1208
+ .e-ribbon-gallery-dropdown.e-popup .e-ribbon-popup-container .e-ribbon-gallery-header:first-child {
1209
+ padding-top: 0;
1119
1210
  }
1120
1211
 
1121
1212
  .e-ribbon-gallery-popup.e-popup,
1122
1213
  .e-ribbon-gallery-dropdown.e-popup {
1123
1214
  border-radius: 4px;
1124
- padding: 0 12px 12px;
1215
+ padding: 8px 12px 12px;
1125
1216
  overflow: auto;
1126
1217
  }
1127
1218
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
1128
1219
  .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-header {
1129
- padding: 8px 0 4px;
1130
1220
  font-size: 14px;
1131
1221
  font-weight: 500;
1132
1222
  line-height: 22px;
1223
+ padding: 8px 0 4px;
1133
1224
  }
1134
1225
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item,
1135
1226
  .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item {
1136
- margin: 4px;
1227
+ margin: 2px;
1137
1228
  height: 54px;
1138
1229
  width: 73px;
1139
1230
  }
@@ -1148,6 +1239,7 @@
1148
1239
  .e-ribbon-item .e-ribbon-gallery-container {
1149
1240
  padding: 0;
1150
1241
  margin: 0;
1242
+ display: -webkit-box;
1151
1243
  display: -ms-flexbox;
1152
1244
  display: flex;
1153
1245
  -ms-flex-line-pack: distribute;
@@ -1158,15 +1250,19 @@
1158
1250
  .e-ribbon-group-overflow .e-ribbon-gallery-container .e-ribbon-gallery-item,
1159
1251
  .e-ribbon-item .e-ribbon-gallery-container .e-ribbon-gallery-item {
1160
1252
  display: inherit;
1161
- -ms-flex-align: center;
1162
- align-items: center;
1163
- -ms-flex-pack: center;
1164
- justify-content: center;
1253
+ -webkit-box-orient: vertical;
1254
+ -webkit-box-direction: normal;
1255
+ -ms-flex-direction: column;
1256
+ flex-direction: column;
1257
+ -webkit-box-align: center;
1258
+ -ms-flex-align: center;
1259
+ align-items: center;
1260
+ -webkit-box-pack: center;
1261
+ -ms-flex-pack: center;
1262
+ justify-content: center;
1165
1263
  text-align: center;
1166
1264
  list-style-type: none;
1167
1265
  padding: 5px 0;
1168
- -ms-flex-direction: column;
1169
- flex-direction: column;
1170
1266
  cursor: pointer;
1171
1267
  border-width: 2px;
1172
1268
  border-style: solid;
@@ -1184,18 +1280,6 @@
1184
1280
  .e-ribbon-item .e-ribbon-gallery-container .e-ribbon-gallery-item.e-hidden {
1185
1281
  display: none;
1186
1282
  }
1187
- .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text,
1188
- .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text,
1189
- .e-ribbon-group-overflow .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text,
1190
- .e-ribbon-item .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-text {
1191
- font-size: 14px;
1192
- font-weight: 400;
1193
- line-height: 22px;
1194
- width: inherit;
1195
- overflow: hidden;
1196
- white-space: nowrap;
1197
- text-overflow: ellipsis;
1198
- }
1199
1283
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-icons,
1200
1284
  .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-icons,
1201
1285
  .e-ribbon-group-overflow .e-ribbon-gallery-container .e-ribbon-gallery-item .e-ribbon-gallery-icons,
@@ -1216,19 +1300,33 @@
1216
1300
  border-radius: 4px;
1217
1301
  }
1218
1302
 
1303
+ .e-ribbon-gallery-text {
1304
+ font-size: 14px;
1305
+ font-weight: 400;
1306
+ line-height: 22px;
1307
+ width: inherit;
1308
+ overflow: hidden;
1309
+ white-space: nowrap;
1310
+ text-overflow: ellipsis;
1311
+ }
1312
+
1219
1313
  .e-ribbon-keytip {
1314
+ font-size: 14px;
1315
+ line-height: 18px;
1220
1316
  min-width: 20px;
1221
1317
  height: 20px;
1222
- line-height: 18px;
1223
- font-size: 14px;
1318
+ border-radius: unset;
1224
1319
  }
1225
1320
  .e-ribbon-keytip.e-popup-open {
1321
+ display: -webkit-box;
1226
1322
  display: -ms-flexbox;
1227
1323
  display: flex;
1228
- -ms-flex-pack: center;
1229
- justify-content: center;
1230
- -ms-flex-align: center;
1231
- align-items: center;
1324
+ -webkit-box-pack: center;
1325
+ -ms-flex-pack: center;
1326
+ justify-content: center;
1327
+ -webkit-box-align: center;
1328
+ -ms-flex-align: center;
1329
+ align-items: center;
1232
1330
  }
1233
1331
 
1234
1332
  .e-ribbon-menu {
@@ -1251,8 +1349,9 @@
1251
1349
  .e-ribbon-control.e-dropdown-popup ul .e-item {
1252
1350
  font-size: 14px;
1253
1351
  height: 26px;
1254
- -ms-flex-align: center;
1255
- align-items: center;
1352
+ -webkit-box-align: center;
1353
+ -ms-flex-align: center;
1354
+ align-items: center;
1256
1355
  }
1257
1356
  .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1258
1357
  font-size: 16px;
@@ -1269,6 +1368,7 @@
1269
1368
  }
1270
1369
  .e-ribbon-tooltip .e-tip-content .e-ribbon-text-container {
1271
1370
  padding: 4px;
1371
+ display: -webkit-box;
1272
1372
  display: -ms-flexbox;
1273
1373
  display: flex;
1274
1374
  }
@@ -1290,9 +1390,9 @@
1290
1390
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage,
1291
1391
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu,
1292
1392
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage {
1393
+ font-size: 16px;
1293
1394
  line-height: 24px;
1294
1395
  padding: 13px 20px;
1295
- font-size: 16px;
1296
1396
  }
1297
1397
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template,
1298
1398
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template {
@@ -1319,8 +1419,8 @@
1319
1419
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-tab-text,
1320
1420
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item .e-tab-text {
1321
1421
  font-size: 16px;
1322
- padding: 13px 20px;
1323
1422
  line-height: 24px;
1423
+ padding: 13px 20px;
1324
1424
  }
1325
1425
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus, .e-bigger.e-ribbon.e-rbn .e-ribbon-tab.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus .e-text-wrap,
1326
1426
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus,
@@ -1333,8 +1433,8 @@
1333
1433
  }
1334
1434
  .e-bigger.e-ribbon.e-rbn.e-ribbon-collapsible .e-ribbon-collapse-btn,
1335
1435
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible .e-ribbon-collapse-btn {
1336
- line-height: 16px;
1337
1436
  font-size: 16px;
1437
+ line-height: 16px;
1338
1438
  padding: 4px;
1339
1439
  }
1340
1440
  .e-bigger.e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-content,
@@ -1352,8 +1452,8 @@
1352
1452
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
1353
1453
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
1354
1454
  font-size: 20px;
1355
- padding: 10px;
1356
1455
  line-height: 20px;
1456
+ padding: 10px;
1357
1457
  }
1358
1458
  .e-bigger.e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-overall-of-btn,
1359
1459
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow .e-ribbon-overall-of-btn {
@@ -1367,14 +1467,35 @@
1367
1467
  .e-bigger .e-ribbon.e-rbn.e-ribbon-collapsible.e-ribbon-overflow.e-rtl .e-ribbon-overall-of-btn {
1368
1468
  left: 28px;
1369
1469
  }
1470
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)),
1471
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
1472
+ height: 132px;
1473
+ }
1474
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container),
1475
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container) {
1476
+ padding: 0;
1477
+ }
1478
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
1479
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
1480
+ max-height: 114px;
1481
+ width: 114px;
1482
+ }
1483
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)),
1484
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item:has(.e-ribbon-gallery-container:not(.e-hidden)) {
1485
+ height: 44px;
1486
+ }
1487
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item,
1488
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-item .e-ribbon-gallery-wrapper .e-ribbon-gallery-container .e-ribbon-gallery-item {
1489
+ max-height: 36px;
1490
+ }
1370
1491
 
1371
1492
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-header,
1372
1493
  .e-bigger .e-ribbon.e-rbn .e-ribbon-group-header,
1373
1494
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-header,
1374
1495
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-header {
1375
- padding: 0 11px 8px;
1376
- line-height: 18px;
1377
1496
  font-size: 12px;
1497
+ line-height: 18px;
1498
+ padding: 0 11px 8px;
1378
1499
  }
1379
1500
  .e-bigger.e-ribbon.e-rbn .e-ribbon-launcher-icon,
1380
1501
  .e-bigger .e-ribbon.e-rbn .e-ribbon-launcher-icon,
@@ -1423,7 +1544,7 @@
1423
1544
  .e-bigger .e-ribbon-group-overflow-ddb .e-input-group,
1424
1545
  .e-bigger.e-ribbon-group-overflow-ddb .e-input-group {
1425
1546
  height: 40px;
1426
- margin-bottom: 4px;
1547
+ margin: 0 0 4px;
1427
1548
  }
1428
1549
  .e-bigger.e-ribbon.e-rbn .e-input-group:not(.e-float-input) .e-input,
1429
1550
  .e-bigger .e-ribbon.e-rbn .e-input-group:not(.e-float-input) .e-input,
@@ -1435,9 +1556,9 @@
1435
1556
  .e-bigger .e-ribbon.e-rbn .e-input-group input.e-input,
1436
1557
  .e-bigger .e-ribbon-group-overflow-ddb .e-input-group input.e-input,
1437
1558
  .e-bigger.e-ribbon-group-overflow-ddb .e-input-group input.e-input {
1438
- padding: 9px 0 9px 12px;
1439
1559
  font-size: 14px;
1440
1560
  line-height: 22px;
1561
+ padding: 9px 0 9px 12px;
1441
1562
  height: auto;
1442
1563
  }
1443
1564
  .e-bigger.e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-input-group-icon,
@@ -1480,9 +1601,10 @@
1480
1601
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn,
1481
1602
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn,
1482
1603
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn {
1483
- padding: 0 6px;
1484
1604
  font-size: 14px;
1485
1605
  line-height: 22px;
1606
+ padding: 0 6px;
1607
+ max-width: 10ch;
1486
1608
  }
1487
1609
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1488
1610
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
@@ -1563,8 +1685,8 @@
1563
1685
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon,
1564
1686
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon {
1565
1687
  font-size: 20px;
1566
- margin: 10px;
1567
1688
  line-height: 20px;
1689
+ margin: 10px;
1568
1690
  }
1569
1691
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-split-colorpicker.e-split-btn, .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
1570
1692
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-split-colorpicker.e-split-btn,
@@ -1618,8 +1740,8 @@
1618
1740
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-dropdown-btn .e-caret,
1619
1741
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-dropdown-btn .e-caret {
1620
1742
  font-size: 16px;
1621
- padding: 3px 5px;
1622
1743
  line-height: 16px;
1744
+ padding: 3px 5px;
1623
1745
  margin: 0;
1624
1746
  }
1625
1747
 
@@ -1634,9 +1756,9 @@
1634
1756
 
1635
1757
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header,
1636
1758
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
1759
+ font-size: 16px;
1637
1760
  line-height: 22px;
1638
1761
  height: 28px;
1639
- font-size: 16px;
1640
1762
  }
1641
1763
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-dropdown-btn .e-caret,
1642
1764
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-dropdown-btn .e-caret {
@@ -1660,8 +1782,9 @@
1660
1782
  }
1661
1783
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:has(.e-colorpicker-wrapper),
1662
1784
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item:has(.e-colorpicker-wrapper) {
1663
- -ms-flex-align: center;
1664
- align-items: center;
1785
+ -webkit-box-align: center;
1786
+ -ms-flex-align: center;
1787
+ align-items: center;
1665
1788
  }
1666
1789
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-combobox-label,
1667
1790
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-colorpicker-label,
@@ -1694,8 +1817,13 @@
1694
1817
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1695
1818
  padding: 11px 10px 11px 16px;
1696
1819
  }
1697
- .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper,
1698
- .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1820
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1821
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1822
+ padding-left: 44px;
1823
+ }
1824
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper, .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper,
1825
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper,
1826
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper {
1699
1827
  margin-left: 44px;
1700
1828
  }
1701
1829
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
@@ -1718,8 +1846,13 @@
1718
1846
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1719
1847
  padding: 11px 16px 11px 10px;
1720
1848
  }
1721
- .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper,
1722
- .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper {
1849
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1850
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1851
+ padding-right: 44px;
1852
+ }
1853
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper, .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper,
1854
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-colorpicker-label)) .e-colorpicker-wrapper,
1855
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item:not(:has(.e-ribbon-combobox-label)) .e-input-group.e-control-wrapper {
1723
1856
  margin-right: 44px;
1724
1857
  }
1725
1858
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
@@ -1807,19 +1940,28 @@
1807
1940
  .e-bigger .e-ribbon-gallery-popup.e-popup,
1808
1941
  .e-bigger.e-ribbon-gallery-dropdown.e-popup,
1809
1942
  .e-bigger .e-ribbon-gallery-dropdown.e-popup {
1810
- padding: 0 16px 16px;
1943
+ padding: 12px 16px 16px;
1811
1944
  }
1812
1945
  .e-bigger.e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
1813
1946
  .e-bigger .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
1814
1947
  .e-bigger.e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-header,
1815
1948
  .e-bigger .e-ribbon-gallery-dropdown.e-popup .e-ribbon-gallery-header {
1816
- padding-bottom: 12px 0 8px;
1817
1949
  font-size: 16px;
1818
1950
  line-height: 24px;
1951
+ padding: 12px 0 8px;
1952
+ }
1953
+
1954
+ .e-bigger.e-ribbon-keytip,
1955
+ .e-bigger .e-ribbon-keytip {
1956
+ font-size: 14px;
1957
+ line-height: 18px;
1958
+ min-width: 20px;
1959
+ height: 20px;
1819
1960
  }
1820
1961
 
1821
1962
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header {
1822
1963
  border-color: unset;
1964
+ background: #131313;
1823
1965
  }
1824
1966
  .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-toolbar-item.e-ribbon-contextual-tab {
1825
1967
  background: #131313;
@@ -1869,8 +2011,8 @@
1869
2011
  }
1870
2012
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu,
1871
2013
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-backstage {
1872
- color: #f0f0f0;
1873
2014
  background: #131313;
2015
+ color: #f0f0f0;
1874
2016
  border-color: unset;
1875
2017
  }
1876
2018
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active,
@@ -1888,6 +2030,7 @@
1888
2030
  }
1889
2031
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-help-template {
1890
2032
  border-color: unset;
2033
+ background: #131313;
1891
2034
  }
1892
2035
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-template:focus-visible {
1893
2036
  background: #313131;
@@ -1898,8 +2041,8 @@
1898
2041
  color: #f0f0f0;
1899
2042
  }
1900
2043
  .e-ribbon.e-rbn .e-ribbon-collapse-btn {
1901
- color: #f0f0f0;
1902
2044
  background: #131313;
2045
+ color: #f0f0f0;
1903
2046
  border-color: transparent;
1904
2047
  }
1905
2048
  .e-ribbon.e-rbn .e-ribbon-collapse-btn:hover, .e-ribbon.e-rbn .e-ribbon-collapse-btn:focus-visible {
@@ -1909,7 +2052,8 @@
1909
2052
  }
1910
2053
 
1911
2054
  .e-ribbon-backstage-popup {
1912
- box-shadow: 0 6px 12px rgba(26, 26, 26, 0.175);
2055
+ -webkit-box-shadow: 0 6px 12px rgba(26, 26, 26, 0.175);
2056
+ box-shadow: 0 6px 12px rgba(26, 26, 26, 0.175);
1913
2057
  }
1914
2058
  .e-ribbon-backstage-popup .e-ribbon-backstage-wrapper {
1915
2059
  background: #248aff;
@@ -1951,24 +2095,24 @@
1951
2095
  }
1952
2096
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:focus, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:focus {
1953
2097
  background: #248aff;
1954
- border-color: #001124;
1955
2098
  color: #f0f0f0;
2099
+ border-color: #001124;
1956
2100
  }
1957
2101
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:focus .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:focus .e-menu-icon {
1958
2102
  color: #f0f0f0;
1959
2103
  }
1960
2104
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-selected, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:hover, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-selected, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:hover {
1961
2105
  background: #00408a;
1962
- border-color: unset;
1963
2106
  color: #f0f0f0;
2107
+ border-color: unset;
1964
2108
  }
1965
2109
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-selected .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item:hover .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-selected .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item:hover .e-menu-icon {
1966
2110
  color: #f0f0f0;
1967
2111
  }
1968
2112
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-selected:focus, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-selected:focus {
1969
2113
  background: #248aff;
1970
- border-color: #001124;
1971
2114
  color: #f0f0f0;
2115
+ border-color: #001124;
1972
2116
  }
1973
2117
  .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-selected:focus .e-menu-icon, .e-ribbon-backstage-popup .e-ribbon-backstage-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-selected:focus .e-menu-icon {
1974
2118
  color: #f0f0f0;
@@ -1992,11 +2136,10 @@
1992
2136
  color: rgba(240, 240, 240, 0.3);
1993
2137
  }
1994
2138
  .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-hover, .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-open,
2139
+ .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-hover,
2140
+ .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-open,
1995
2141
  .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-hover,
1996
- .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-open {
1997
- border-color: #313131;
1998
- }
1999
- .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-hover, .e-ribbon.e-rbn .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-open,
2142
+ .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-colorpicker-wrapper.e-ribbon-open,
2000
2143
  .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-hover,
2001
2144
  .e-ribbon-group-overflow-ddb .e-ribbon-item:not(.e-disabled) .e-split-btn-wrapper.e-ribbon-open {
2002
2145
  border-color: #313131;
@@ -2012,6 +2155,7 @@
2012
2155
  .e-ribbon.e-rbn .e-ribbon-item:has(.e-ribbon-gallery-container),
2013
2156
  .e-ribbon-group-overflow-ddb .e-ribbon-item:has(.e-ribbon-gallery-container) {
2014
2157
  border-color: #414141;
2158
+ background: #1a1a1a;
2015
2159
  }
2016
2160
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu),
2017
2161
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button,
@@ -2036,8 +2180,8 @@
2036
2180
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button,
2037
2181
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type),
2038
2182
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn {
2039
- color: #f0f0f0;
2040
2183
  background: #131313;
2184
+ color: #f0f0f0;
2041
2185
  border-color: transparent;
2042
2186
  }
2043
2187
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu) .e-btn-icon,
@@ -2117,98 +2261,105 @@
2117
2261
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn:hover .e-btn-icon {
2118
2262
  color: #f0f0f0;
2119
2263
  }
2120
- .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active, .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2264
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active,
2121
2265
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2122
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2123
2266
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2124
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2125
2267
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn.e-active,
2126
- .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn:active,
2127
2268
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2128
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2129
2269
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2130
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2131
2270
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2132
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2133
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active,
2134
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn:active, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2271
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2135
2272
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2136
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2137
2273
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2138
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2139
2274
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-active,
2140
- .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn:active,
2141
2275
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active,
2142
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2143
2276
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2144
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2145
2277
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2146
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2147
2278
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn.e-active,
2148
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn:active,
2149
2279
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2150
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2151
2280
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2152
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2153
2281
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2154
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2155
2282
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active,
2156
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn:active,
2157
2283
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active,
2158
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2159
2284
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active,
2160
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2161
2285
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active,
2286
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active {
2287
+ background: #313131;
2288
+ color: #f0f0f0;
2289
+ }
2290
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2291
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2292
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2293
+ .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2294
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2295
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2296
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2297
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2298
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2299
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2300
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2301
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2302
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2303
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2304
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2305
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2306
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2307
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2308
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2309
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2310
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2311
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2312
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon {
2313
+ color: #f0f0f0;
2314
+ }
2315
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2316
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2317
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2318
+ .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn:active,
2319
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2320
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2321
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2322
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn:active, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2323
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2324
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2325
+ .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn:active,
2326
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active,
2327
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active,
2328
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2329
+ .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn:active,
2330
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active,
2331
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2332
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2333
+ .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn:active,
2334
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active,
2335
+ .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active,
2162
2336
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active,
2163
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active,
2164
2337
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn:active {
2165
2338
  background: #313131;
2166
2339
  color: #f0f0f0;
2167
2340
  }
2168
- .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon, .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2169
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2341
+ .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2170
2342
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2171
- .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2172
2343
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2173
- .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2174
2344
  .e-ribbon.e-rbn .e-ribbon-item .e-ribbon-group-of-btn:active .e-btn-icon,
2175
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2176
2345
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2177
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2178
2346
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2179
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2180
2347
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2181
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2182
- .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn:active .e-btn-icon, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2183
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2348
+ .e-ribbon.e-rbn .e-ribbon-group-overflow .e-ribbon-group-of-btn:active .e-btn-icon, .e-ribbon.e-rbn.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2184
2349
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2185
- .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2186
2350
  .e-ribbon.e-rbn.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2187
- .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2188
2351
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn:active .e-btn-icon,
2189
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2190
2352
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2191
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2192
2353
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2193
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2194
2354
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2195
- .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn.e-active .e-btn-icon,
2196
2355
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-ribbon-group-of-btn:active .e-btn-icon,
2197
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2198
2356
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2199
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2200
2357
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2201
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2202
2358
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2203
- .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2204
2359
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow .e-ribbon-group-of-btn:active .e-btn-icon,
2205
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu).e-active .e-btn-icon,
2206
2360
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn:not(.e-ribbon-file-menu):active .e-btn-icon,
2207
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button.e-active .e-btn-icon,
2208
2361
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:active .e-btn-icon,
2209
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type).e-active .e-btn-icon,
2210
2362
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-btn-group .e-btn.e-ribbon-group-button:not(:first-of-type):not(:last-of-type):active .e-btn-icon,
2211
- .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn.e-active .e-btn-icon,
2212
2363
  .e-ribbon-group-overflow-ddb.e-ribbon-overflow .e-ribbon-group-of-btn:active .e-btn-icon {
2213
2364
  color: #f0f0f0;
2214
2365
  }
@@ -2238,6 +2389,8 @@
2238
2389
  background: #313131;
2239
2390
  color: #f0f0f0;
2240
2391
  border-color: unset;
2392
+ -webkit-box-shadow: none;
2393
+ box-shadow: none;
2241
2394
  }
2242
2395
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:not(.e-ribbon-file-menu):focus-visible .e-btn-icon,
2243
2396
  .e-ribbon.e-rbn .e-ribbon-item .e-btn-group .e-btn.e-ribbon-group-button:focus-visible .e-btn-icon,
@@ -2400,7 +2553,8 @@
2400
2553
  .e-ribbon-group-overflow-ddb.e-dropdown-popup,
2401
2554
  .e-ribbon-dropdown-group-button.e-dropdown-popup {
2402
2555
  background: #2a2a2a;
2403
- box-shadow: unset;
2556
+ -webkit-box-shadow: unset;
2557
+ box-shadow: unset;
2404
2558
  border-color: #acacac;
2405
2559
  }
2406
2560
  .e-ribbon-file-menu.e-dropdown-popup .e-btn:not(.e-ribbon-file-menu),
@@ -2418,33 +2572,19 @@
2418
2572
  background: transparent;
2419
2573
  }
2420
2574
 
2421
- .e-ribbon-gallery-item {
2575
+ .e-ribbon-gallery-button {
2576
+ border-color: #414141;
2422
2577
  background: transparent;
2423
- border-color: transparent;
2424
- }
2425
- .e-ribbon-gallery-item:hover {
2426
- background: #484848;
2427
- }
2428
- .e-ribbon-gallery-item.e-ribbon-gallery-selected {
2429
- background: #0070f0;
2430
- }
2431
- .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text {
2432
2578
  color: #fff;
2433
2579
  }
2434
- .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons {
2580
+ .e-ribbon-gallery-button.e-gallery-button-active {
2581
+ background: #313131;
2435
2582
  color: #fff;
2436
2583
  }
2437
- .e-ribbon-gallery-item.e-disabled {
2584
+
2585
+ .e-ribbon-gallery-item {
2438
2586
  background: transparent;
2439
- }
2440
- .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text {
2441
- color: #767676;
2442
- }
2443
- .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons {
2444
- color: #767676;
2445
- }
2446
- .e-ribbon-gallery-item:focus, .e-ribbon-gallery-item:focus-visible {
2447
- border-color: #484848;
2587
+ border-color: transparent;
2448
2588
  }
2449
2589
  .e-ribbon-gallery-item .e-ribbon-gallery-text {
2450
2590
  color: #f0f0f0;
@@ -2453,23 +2593,60 @@
2453
2593
  color: #f0f0f0;
2454
2594
  }
2455
2595
 
2456
- .e-ribbon-gallery-button {
2457
- border-color: #414141;
2458
- }
2459
- .e-ribbon-gallery-button.e-gallery-button-active {
2460
- background: #0070f0;
2461
- }
2462
-
2463
2596
  .e-ribbon-gallery-popup.e-popup,
2464
2597
  .e-dropdown-popup.e-ribbon-gallery-dropdown {
2465
2598
  background: #313131;
2466
- box-shadow: 0 6px 12px rgba(26, 26, 26, 0.175);
2599
+ -webkit-box-shadow: 0 6px 12px rgba(26, 26, 26, 0.175);
2600
+ box-shadow: 0 6px 12px rgba(26, 26, 26, 0.175);
2467
2601
  }
2468
2602
  .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-header,
2469
2603
  .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-header {
2470
2604
  color: #f0f0f0;
2471
2605
  }
2472
2606
 
2607
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item:hover,
2608
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item:hover,
2609
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item:hover {
2610
+ background: #484848;
2611
+ }
2612
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-ribbon-gallery-selected,
2613
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-ribbon-gallery-selected,
2614
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-ribbon-gallery-selected {
2615
+ background: #0070f0;
2616
+ }
2617
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text,
2618
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text,
2619
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-text {
2620
+ color: #fff;
2621
+ }
2622
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons,
2623
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons,
2624
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-ribbon-gallery-selected .e-ribbon-gallery-icons {
2625
+ color: #fff;
2626
+ }
2627
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-disabled,
2628
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-disabled,
2629
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-disabled {
2630
+ background: transparent;
2631
+ }
2632
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text,
2633
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text,
2634
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-text {
2635
+ color: #767676;
2636
+ }
2637
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons,
2638
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons,
2639
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item.e-disabled .e-ribbon-gallery-icons {
2640
+ color: #767676;
2641
+ }
2642
+ .e-ribbon-gallery-wrapper .e-ribbon-gallery-item:focus, .e-ribbon-gallery-wrapper .e-ribbon-gallery-item:focus-visible,
2643
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item:focus,
2644
+ .e-ribbon-gallery-popup.e-popup .e-ribbon-gallery-item:focus-visible,
2645
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item:focus,
2646
+ .e-dropdown-popup.e-ribbon-gallery-dropdown .e-ribbon-gallery-item:focus-visible {
2647
+ border-color: #484848;
2648
+ }
2649
+
2473
2650
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn-icon {
2474
2651
  color: #f0f0f0;
2475
2652
  }
@@ -2503,6 +2680,12 @@
2503
2680
  .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button.e-active .e-btn-icon {
2504
2681
  color: #f0f0f0;
2505
2682
  }
2683
+ .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button.e-icon-btn:active, .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button:active {
2684
+ background: #414141;
2685
+ }
2686
+ .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button.e-icon-btn:active .e-btn-icon, .e-dropdown-popup.e-ribbon-dropdown-group-button .e-btn.e-ribbon-group-button:active .e-btn-icon {
2687
+ color: #f0f0f0;
2688
+ }
2506
2689
 
2507
2690
  .e-ribbon-tooltip.e-tooltip-wrap.e-popup {
2508
2691
  background: #f0f0f0;