@syncfusion/ej2-richtexteditor 24.2.4 → 24.2.8

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 (100) hide show
  1. package/CHANGELOG.md +34 -0
  2. package/dist/ej2-richtexteditor.min.js +2 -2
  3. package/dist/ej2-richtexteditor.umd.min.js +2 -2
  4. package/dist/ej2-richtexteditor.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-richtexteditor.es2015.js +669 -272
  6. package/dist/es6/ej2-richtexteditor.es2015.js.map +1 -1
  7. package/dist/es6/ej2-richtexteditor.es5.js +662 -269
  8. package/dist/es6/ej2-richtexteditor.es5.js.map +1 -1
  9. package/dist/global/ej2-richtexteditor.min.js +2 -2
  10. package/dist/global/ej2-richtexteditor.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +12 -12
  13. package/src/common/util.js +4 -1
  14. package/src/editor-manager/plugin/dom-node.js +3 -1
  15. package/src/editor-manager/plugin/format-painter-actions.d.ts +1 -0
  16. package/src/editor-manager/plugin/format-painter-actions.js +18 -0
  17. package/src/editor-manager/plugin/formats.d.ts +1 -0
  18. package/src/editor-manager/plugin/formats.js +37 -2
  19. package/src/editor-manager/plugin/inserthtml.js +15 -2
  20. package/src/editor-manager/plugin/lists.js +85 -63
  21. package/src/editor-manager/plugin/ms-word-clean-up.js +87 -18
  22. package/src/editor-manager/plugin/nodecutter.js +1 -1
  23. package/src/editor-manager/plugin/selection-commands.d.ts +1 -0
  24. package/src/editor-manager/plugin/selection-commands.js +56 -1
  25. package/src/editor-manager/plugin/table.js +1 -1
  26. package/src/rich-text-editor/actions/base-quick-toolbar.js +4 -4
  27. package/src/rich-text-editor/actions/color-picker.d.ts +1 -0
  28. package/src/rich-text-editor/actions/color-picker.js +10 -0
  29. package/src/rich-text-editor/actions/enter-key.js +2 -2
  30. package/src/rich-text-editor/actions/html-editor.js +25 -12
  31. package/src/rich-text-editor/actions/paste-clean-up.d.ts +1 -0
  32. package/src/rich-text-editor/actions/paste-clean-up.js +26 -5
  33. package/src/rich-text-editor/actions/toolbar-action.js +1 -1
  34. package/src/rich-text-editor/actions/toolbar.js +4 -1
  35. package/src/rich-text-editor/base/constant.d.ts +5 -0
  36. package/src/rich-text-editor/base/constant.js +5 -0
  37. package/src/rich-text-editor/base/interface.d.ts +0 -8
  38. package/src/rich-text-editor/base/rich-text-editor-model.d.ts +1 -1
  39. package/src/rich-text-editor/base/rich-text-editor.d.ts +1 -1
  40. package/src/rich-text-editor/base/rich-text-editor.js +33 -7
  41. package/src/rich-text-editor/base/util.js +3 -0
  42. package/src/rich-text-editor/models/default-locale.js +3 -2
  43. package/src/rich-text-editor/renderer/dialog-renderer.js +5 -1
  44. package/src/rich-text-editor/renderer/iframe-content-renderer.js +1 -1
  45. package/src/rich-text-editor/renderer/image-module.js +31 -10
  46. package/src/rich-text-editor/renderer/table-module.d.ts +4 -1
  47. package/src/rich-text-editor/renderer/table-module.js +200 -131
  48. package/src/rich-text-editor/renderer/toolbar-renderer.js +13 -13
  49. package/styles/bootstrap-dark.css +57 -22
  50. package/styles/bootstrap.css +61 -29
  51. package/styles/bootstrap4.css +48 -17
  52. package/styles/bootstrap5-dark.css +47 -18
  53. package/styles/bootstrap5.css +47 -18
  54. package/styles/fabric-dark.css +43 -12
  55. package/styles/fabric.css +43 -12
  56. package/styles/fluent-dark.css +51 -14
  57. package/styles/fluent.css +51 -14
  58. package/styles/highcontrast-light.css +43 -12
  59. package/styles/highcontrast.css +46 -12
  60. package/styles/material-dark.css +47 -12
  61. package/styles/material.css +47 -12
  62. package/styles/material3-dark.css +45 -14
  63. package/styles/material3.css +45 -14
  64. package/styles/rich-text-editor/_bootstrap-dark-definition.scss +12 -10
  65. package/styles/rich-text-editor/_bootstrap-definition.scss +18 -16
  66. package/styles/rich-text-editor/_bootstrap4-definition.scss +8 -6
  67. package/styles/rich-text-editor/_bootstrap5-definition.scss +4 -2
  68. package/styles/rich-text-editor/_fabric-dark-definition.scss +4 -2
  69. package/styles/rich-text-editor/_fabric-definition.scss +4 -2
  70. package/styles/rich-text-editor/_fluent-definition.scss +5 -3
  71. package/styles/rich-text-editor/_fusionnew-definition.scss +4 -2
  72. package/styles/rich-text-editor/_highcontrast-definition.scss +4 -2
  73. package/styles/rich-text-editor/_highcontrast-light-definition.scss +4 -2
  74. package/styles/rich-text-editor/_layout.scss +46 -6
  75. package/styles/rich-text-editor/_material-dark-definition.scss +4 -2
  76. package/styles/rich-text-editor/_material-definition.scss +4 -2
  77. package/styles/rich-text-editor/_material3-definition.scss +6 -4
  78. package/styles/rich-text-editor/_tailwind-definition.scss +21 -19
  79. package/styles/rich-text-editor/_theme.scss +65 -16
  80. package/styles/rich-text-editor/bootstrap-dark.css +57 -22
  81. package/styles/rich-text-editor/bootstrap.css +61 -29
  82. package/styles/rich-text-editor/bootstrap4.css +48 -17
  83. package/styles/rich-text-editor/bootstrap5-dark.css +47 -18
  84. package/styles/rich-text-editor/bootstrap5.css +47 -18
  85. package/styles/rich-text-editor/fabric-dark.css +43 -12
  86. package/styles/rich-text-editor/fabric.css +43 -12
  87. package/styles/rich-text-editor/fluent-dark.css +51 -14
  88. package/styles/rich-text-editor/fluent.css +51 -14
  89. package/styles/rich-text-editor/highcontrast-light.css +43 -12
  90. package/styles/rich-text-editor/highcontrast.css +46 -12
  91. package/styles/rich-text-editor/material-dark.css +47 -12
  92. package/styles/rich-text-editor/material.css +47 -12
  93. package/styles/rich-text-editor/material3-dark.css +45 -14
  94. package/styles/rich-text-editor/material3.css +45 -14
  95. package/styles/rich-text-editor/tailwind-dark.css +98 -35
  96. package/styles/rich-text-editor/tailwind.css +98 -35
  97. package/styles/tailwind-dark.css +98 -35
  98. package/styles/tailwind.css +98 -35
  99. package/.github/PULL_REQUEST_TEMPLATE/Bug.md +0 -41
  100. package/.github/PULL_REQUEST_TEMPLATE/Feature.md +0 -27
@@ -532,6 +532,14 @@
532
532
  .e-richtexteditor.e-bigger .e-rte-content .e-content {
533
533
  font-size: 16px;
534
534
  }
535
+ .e-bigger .e-richtexteditor .e-dialog .e-img-uploadwrap.e-droparea .e-browsebtn,
536
+ .e-bigger .e-richtexteditor .e-dialog .e-aud-uploadwrap.e-droparea .e-browsebtn,
537
+ .e-bigger .e-richtexteditor .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
538
+ .e-richtexteditor.e-bigger .e-dialog .e-img-uploadwrap.e-droparea .e-browsebtn,
539
+ .e-richtexteditor.e-bigger .e-dialog .e-aud-uploadwrap.e-droparea .e-browsebtn,
540
+ .e-richtexteditor.e-bigger .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn {
541
+ top: -120px;
542
+ }
535
543
 
536
544
  .e-richtexteditor {
537
545
  color: #fff;
@@ -1179,6 +1187,8 @@
1179
1187
  .e-rte-image.e-imginline,
1180
1188
  .e-rte-audio.e-audio-inline,
1181
1189
  .e-rte-video.e-video-inline {
1190
+ margin-left: 5px;
1191
+ margin-right: 5px;
1182
1192
  display: inline-block;
1183
1193
  float: none;
1184
1194
  max-width: calc(100% - 10px);
@@ -1236,19 +1246,19 @@
1236
1246
  }
1237
1247
 
1238
1248
  .e-rte-img-caption.e-imgcenter {
1239
- display: block;
1249
+ display: contents;
1240
1250
  margin-left: auto;
1241
1251
  margin-right: auto;
1242
1252
  }
1243
1253
 
1244
1254
  .e-rte-img-caption.e-imgright {
1245
- display: block;
1255
+ display: contents;
1246
1256
  margin-left: auto;
1247
1257
  margin-right: 0;
1248
1258
  }
1249
1259
 
1250
1260
  .e-rte-img-caption.e-imgleft {
1251
- display: block;
1261
+ display: contents;
1252
1262
  margin-left: 0;
1253
1263
  margin-right: auto;
1254
1264
  }
@@ -1265,7 +1275,7 @@
1265
1275
  }
1266
1276
 
1267
1277
  .e-img-caption.e-rte-img-caption.e-imgbreak {
1268
- display: block;
1278
+ display: contents;
1269
1279
  }
1270
1280
 
1271
1281
  .e-rte-table {
@@ -1450,13 +1460,13 @@
1450
1460
  margin: 0 auto;
1451
1461
  padding: 0 18px;
1452
1462
  position: relative;
1453
- top: -50px;
1463
+ top: -120px;
1454
1464
  }
1455
1465
  .e-richtexteditor .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
1456
1466
  .e-richtexteditor .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn,
1457
1467
  .e-rte-elements .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
1458
1468
  .e-rte-elements .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {
1459
- top: -130px;
1469
+ top: -120px;
1460
1470
  }
1461
1471
  .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap.e-droparea .e-browsebtn,
1462
1472
  .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap.e-droparea .e-browsebtn,
@@ -1773,6 +1783,14 @@
1773
1783
  .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar {
1774
1784
  min-height: 48px;
1775
1785
  }
1786
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content,
1787
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret {
1788
+ height: 36px;
1789
+ }
1790
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content:hover,
1791
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret:hover {
1792
+ height: 36px;
1793
+ }
1776
1794
  .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items:not(.e-tbar-pos) {
1777
1795
  margin: 0 6px;
1778
1796
  min-height: 48px;
@@ -2650,7 +2668,7 @@
2650
2668
  margin: 0 auto;
2651
2669
  padding: 0 18px;
2652
2670
  position: relative;
2653
- top: -50px;
2671
+ top: -120px;
2654
2672
  }
2655
2673
  .e-rte-elements.e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
2656
2674
  .e-rte-elements.e-dialog .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {
@@ -2670,9 +2688,6 @@
2670
2688
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-overlay .e-tbar-btn .e-icons {
2671
2689
  color: #adb5bd;
2672
2690
  }
2673
- .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:focus .e-icons {
2674
- color: #fff;
2675
- }
2676
2691
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn, .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn:focus {
2677
2692
  background: #565e64;
2678
2693
  border: 1px solid #51585e;
@@ -2687,9 +2702,6 @@
2687
2702
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:hover .e-icons {
2688
2703
  color: #fff;
2689
2704
  }
2690
- .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:focus .e-icons {
2691
- color: #fff;
2692
- }
2693
2705
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-dropdown-btn.e-active {
2694
2706
  background: #565e64;
2695
2707
  border-color: #51585e;
@@ -2773,9 +2785,6 @@
2773
2785
  .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover .e-icons {
2774
2786
  color: #fff;
2775
2787
  }
2776
- .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:focus .e-icons {
2777
- color: #fff;
2778
- }
2779
2788
  .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn .e-icons {
2780
2789
  color: #fff;
2781
2790
  }
@@ -2962,6 +2971,16 @@
2962
2971
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items {
2963
2972
  background: #343a40;
2964
2973
  }
2974
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content {
2975
+ padding-top: 1px;
2976
+ height: 30px;
2977
+ }
2978
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content:hover {
2979
+ background: #7b848d;
2980
+ }
2981
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret:hover {
2982
+ background: #7b848d;
2983
+ }
2965
2984
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-separator {
2966
2985
  border: 0.5px solid #444c54;
2967
2986
  }
@@ -3015,6 +3034,10 @@
3015
3034
  border-color: #343a40;
3016
3035
  }
3017
3036
 
3037
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content {
3038
+ padding-top: 8px;
3039
+ }
3040
+
3018
3041
  .e-dialog .e-img-uploadwrap .e-droptext,
3019
3042
  .e-dialog .e-aud-uploadwrap .e-droptext,
3020
3043
  .e-dialog .e-vid-uploadwrap .e-droptext,
@@ -3025,14 +3048,20 @@
3025
3048
  display: block;
3026
3049
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
3027
3050
  font-size: 14px;
3028
- height: 185px;
3051
+ height: 128px;
3029
3052
  margin: 0 auto;
3030
3053
  text-align: center;
3031
3054
  width: auto;
3032
3055
  }
3033
3056
 
3034
3057
  .e-dialog .e-vid-uploadwrap .e-droptext {
3035
- height: 108px;
3058
+ height: 128px;
3059
+ }
3060
+
3061
+ .e-bigger .e-richtexteditor .e-dialog .e-img-uploadwrap .e-droptext,
3062
+ .e-bigger .e-richtexteditor .e-dialog .e-aud-uploadwrap .e-droptext,
3063
+ .e-bigger .e-richtexteditor .e-dialog .e-vid-uploadwrap .e-droptext {
3064
+ height: 140px;
3036
3065
  }
3037
3066
 
3038
3067
  .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
@@ -532,6 +532,14 @@
532
532
  .e-richtexteditor.e-bigger .e-rte-content .e-content {
533
533
  font-size: 16px;
534
534
  }
535
+ .e-bigger .e-richtexteditor .e-dialog .e-img-uploadwrap.e-droparea .e-browsebtn,
536
+ .e-bigger .e-richtexteditor .e-dialog .e-aud-uploadwrap.e-droparea .e-browsebtn,
537
+ .e-bigger .e-richtexteditor .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
538
+ .e-richtexteditor.e-bigger .e-dialog .e-img-uploadwrap.e-droparea .e-browsebtn,
539
+ .e-richtexteditor.e-bigger .e-dialog .e-aud-uploadwrap.e-droparea .e-browsebtn,
540
+ .e-richtexteditor.e-bigger .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn {
541
+ top: -120px;
542
+ }
535
543
 
536
544
  .e-richtexteditor {
537
545
  color: #212529;
@@ -1179,6 +1187,8 @@
1179
1187
  .e-rte-image.e-imginline,
1180
1188
  .e-rte-audio.e-audio-inline,
1181
1189
  .e-rte-video.e-video-inline {
1190
+ margin-left: 5px;
1191
+ margin-right: 5px;
1182
1192
  display: inline-block;
1183
1193
  float: none;
1184
1194
  max-width: calc(100% - 10px);
@@ -1236,19 +1246,19 @@
1236
1246
  }
1237
1247
 
1238
1248
  .e-rte-img-caption.e-imgcenter {
1239
- display: block;
1249
+ display: contents;
1240
1250
  margin-left: auto;
1241
1251
  margin-right: auto;
1242
1252
  }
1243
1253
 
1244
1254
  .e-rte-img-caption.e-imgright {
1245
- display: block;
1255
+ display: contents;
1246
1256
  margin-left: auto;
1247
1257
  margin-right: 0;
1248
1258
  }
1249
1259
 
1250
1260
  .e-rte-img-caption.e-imgleft {
1251
- display: block;
1261
+ display: contents;
1252
1262
  margin-left: 0;
1253
1263
  margin-right: auto;
1254
1264
  }
@@ -1265,7 +1275,7 @@
1265
1275
  }
1266
1276
 
1267
1277
  .e-img-caption.e-rte-img-caption.e-imgbreak {
1268
- display: block;
1278
+ display: contents;
1269
1279
  }
1270
1280
 
1271
1281
  .e-rte-table {
@@ -1450,13 +1460,13 @@
1450
1460
  margin: 0 auto;
1451
1461
  padding: 0 18px;
1452
1462
  position: relative;
1453
- top: -50px;
1463
+ top: -120px;
1454
1464
  }
1455
1465
  .e-richtexteditor .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
1456
1466
  .e-richtexteditor .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn,
1457
1467
  .e-rte-elements .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
1458
1468
  .e-rte-elements .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {
1459
- top: -130px;
1469
+ top: -120px;
1460
1470
  }
1461
1471
  .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap.e-droparea .e-browsebtn,
1462
1472
  .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap.e-droparea .e-browsebtn,
@@ -1773,6 +1783,14 @@
1773
1783
  .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar {
1774
1784
  min-height: 48px;
1775
1785
  }
1786
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content,
1787
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret {
1788
+ height: 36px;
1789
+ }
1790
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content:hover,
1791
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret:hover {
1792
+ height: 36px;
1793
+ }
1776
1794
  .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items:not(.e-tbar-pos) {
1777
1795
  margin: 0 6px;
1778
1796
  min-height: 48px;
@@ -2650,7 +2668,7 @@
2650
2668
  margin: 0 auto;
2651
2669
  padding: 0 18px;
2652
2670
  position: relative;
2653
- top: -50px;
2671
+ top: -120px;
2654
2672
  }
2655
2673
  .e-rte-elements.e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
2656
2674
  .e-rte-elements.e-dialog .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {
@@ -2670,9 +2688,6 @@
2670
2688
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-overlay .e-tbar-btn .e-icons {
2671
2689
  color: #adb5bd;
2672
2690
  }
2673
- .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:focus .e-icons {
2674
- color: #fff;
2675
- }
2676
2691
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn, .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn:focus {
2677
2692
  background: #565e64;
2678
2693
  border: 1px solid #51585e;
@@ -2687,9 +2702,6 @@
2687
2702
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:hover .e-icons {
2688
2703
  color: #fff;
2689
2704
  }
2690
- .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:focus .e-icons {
2691
- color: #fff;
2692
- }
2693
2705
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-dropdown-btn.e-active {
2694
2706
  background: #565e64;
2695
2707
  border-color: #51585e;
@@ -2773,9 +2785,6 @@
2773
2785
  .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover .e-icons {
2774
2786
  color: #fff;
2775
2787
  }
2776
- .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:focus .e-icons {
2777
- color: #fff;
2778
- }
2779
2788
  .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn .e-icons {
2780
2789
  color: #fff;
2781
2790
  }
@@ -2962,6 +2971,16 @@
2962
2971
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items {
2963
2972
  background: #e9ecef;
2964
2973
  }
2974
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content {
2975
+ padding-top: 1px;
2976
+ height: 30px;
2977
+ }
2978
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content:hover {
2979
+ background: #6c757d;
2980
+ }
2981
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret:hover {
2982
+ background: #6c757d;
2983
+ }
2965
2984
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-separator {
2966
2985
  border: 0.5px solid #dee2e6;
2967
2986
  }
@@ -3015,6 +3034,10 @@
3015
3034
  border-color: #e9ecef;
3016
3035
  }
3017
3036
 
3037
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content {
3038
+ padding-top: 8px;
3039
+ }
3040
+
3018
3041
  .e-dialog .e-img-uploadwrap .e-droptext,
3019
3042
  .e-dialog .e-aud-uploadwrap .e-droptext,
3020
3043
  .e-dialog .e-vid-uploadwrap .e-droptext,
@@ -3025,14 +3048,20 @@
3025
3048
  display: block;
3026
3049
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
3027
3050
  font-size: 14px;
3028
- height: 185px;
3051
+ height: 128px;
3029
3052
  margin: 0 auto;
3030
3053
  text-align: center;
3031
3054
  width: auto;
3032
3055
  }
3033
3056
 
3034
3057
  .e-dialog .e-vid-uploadwrap .e-droptext {
3035
- height: 108px;
3058
+ height: 128px;
3059
+ }
3060
+
3061
+ .e-bigger .e-richtexteditor .e-dialog .e-img-uploadwrap .e-droptext,
3062
+ .e-bigger .e-richtexteditor .e-dialog .e-aud-uploadwrap .e-droptext,
3063
+ .e-bigger .e-richtexteditor .e-dialog .e-vid-uploadwrap .e-droptext {
3064
+ height: 140px;
3036
3065
  }
3037
3066
 
3038
3067
  .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
@@ -522,6 +522,14 @@
522
522
  .e-richtexteditor.e-bigger .e-rte-content .e-content {
523
523
  font-size: 16px;
524
524
  }
525
+ .e-bigger .e-richtexteditor .e-dialog .e-img-uploadwrap.e-droparea .e-browsebtn,
526
+ .e-bigger .e-richtexteditor .e-dialog .e-aud-uploadwrap.e-droparea .e-browsebtn,
527
+ .e-bigger .e-richtexteditor .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
528
+ .e-richtexteditor.e-bigger .e-dialog .e-img-uploadwrap.e-droparea .e-browsebtn,
529
+ .e-richtexteditor.e-bigger .e-dialog .e-aud-uploadwrap.e-droparea .e-browsebtn,
530
+ .e-richtexteditor.e-bigger .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn {
531
+ top: -120px;
532
+ }
525
533
 
526
534
  .e-richtexteditor {
527
535
  color: #dadada;
@@ -1161,6 +1169,8 @@
1161
1169
  .e-rte-image.e-imginline,
1162
1170
  .e-rte-audio.e-audio-inline,
1163
1171
  .e-rte-video.e-video-inline {
1172
+ margin-left: 5px;
1173
+ margin-right: 5px;
1164
1174
  display: inline-block;
1165
1175
  float: none;
1166
1176
  max-width: calc(100% - 10px);
@@ -1218,19 +1228,19 @@
1218
1228
  }
1219
1229
 
1220
1230
  .e-rte-img-caption.e-imgcenter {
1221
- display: block;
1231
+ display: contents;
1222
1232
  margin-left: auto;
1223
1233
  margin-right: auto;
1224
1234
  }
1225
1235
 
1226
1236
  .e-rte-img-caption.e-imgright {
1227
- display: block;
1237
+ display: contents;
1228
1238
  margin-left: auto;
1229
1239
  margin-right: 0;
1230
1240
  }
1231
1241
 
1232
1242
  .e-rte-img-caption.e-imgleft {
1233
- display: block;
1243
+ display: contents;
1234
1244
  margin-left: 0;
1235
1245
  margin-right: auto;
1236
1246
  }
@@ -1247,7 +1257,7 @@
1247
1257
  }
1248
1258
 
1249
1259
  .e-img-caption.e-rte-img-caption.e-imgbreak {
1250
- display: block;
1260
+ display: contents;
1251
1261
  }
1252
1262
 
1253
1263
  .e-rte-table {
@@ -1432,13 +1442,13 @@
1432
1442
  margin: 0 auto;
1433
1443
  padding: 0 18px;
1434
1444
  position: relative;
1435
- top: -50px;
1445
+ top: -120px;
1436
1446
  }
1437
1447
  .e-richtexteditor .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
1438
1448
  .e-richtexteditor .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn,
1439
1449
  .e-rte-elements .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
1440
1450
  .e-rte-elements .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {
1441
- top: -130px;
1451
+ top: -120px;
1442
1452
  }
1443
1453
  .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap.e-droparea .e-browsebtn,
1444
1454
  .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap.e-droparea .e-browsebtn,
@@ -1755,6 +1765,14 @@
1755
1765
  .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar {
1756
1766
  min-height: 48px;
1757
1767
  }
1768
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content,
1769
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret {
1770
+ height: 48px;
1771
+ }
1772
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content:hover,
1773
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret:hover {
1774
+ height: 48px;
1775
+ }
1758
1776
  .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items:not(.e-tbar-pos) {
1759
1777
  margin: 0 6px;
1760
1778
  min-height: 48px;
@@ -2587,7 +2605,7 @@
2587
2605
  margin: 0 auto;
2588
2606
  padding: 0 18px;
2589
2607
  position: relative;
2590
- top: -50px;
2608
+ top: -120px;
2591
2609
  }
2592
2610
  .e-rte-elements.e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
2593
2611
  .e-rte-elements.e-dialog .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {
@@ -2694,9 +2712,6 @@
2694
2712
  .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover .e-icons {
2695
2713
  color: #dadada;
2696
2714
  }
2697
- .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:focus .e-icons {
2698
- color: #dadada;
2699
- }
2700
2715
  .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn .e-icons {
2701
2716
  color: #fff;
2702
2717
  }
@@ -2879,6 +2894,16 @@
2879
2894
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items {
2880
2895
  background: #333232;
2881
2896
  }
2897
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content {
2898
+ padding-top: 1px;
2899
+ height: 40px;
2900
+ }
2901
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content:hover {
2902
+ background: #514f4f;
2903
+ }
2904
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret:hover {
2905
+ background: #514f4f;
2906
+ }
2882
2907
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-separator {
2883
2908
  border: 0.5px solid #414040;
2884
2909
  }
@@ -2936,14 +2961,20 @@
2936
2961
  display: block;
2937
2962
  font-family: "Segoe UI", "GeezaPro", "DejaVu Serif", sans-serif, "-apple-system", "BlinkMacSystemFont";
2938
2963
  font-size: 14px;
2939
- height: 185px;
2964
+ height: 128px;
2940
2965
  margin: 0 auto;
2941
2966
  text-align: center;
2942
2967
  width: auto;
2943
2968
  }
2944
2969
 
2945
2970
  .e-dialog .e-vid-uploadwrap .e-droptext {
2946
- height: 108px;
2971
+ height: 128px;
2972
+ }
2973
+
2974
+ .e-bigger .e-richtexteditor .e-dialog .e-img-uploadwrap .e-droptext,
2975
+ .e-bigger .e-richtexteditor .e-dialog .e-aud-uploadwrap .e-droptext,
2976
+ .e-bigger .e-richtexteditor .e-dialog .e-vid-uploadwrap .e-droptext {
2977
+ height: 140px;
2947
2978
  }
2948
2979
 
2949
2980
  .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
package/styles/fabric.css CHANGED
@@ -522,6 +522,14 @@
522
522
  .e-richtexteditor.e-bigger .e-rte-content .e-content {
523
523
  font-size: 16px;
524
524
  }
525
+ .e-bigger .e-richtexteditor .e-dialog .e-img-uploadwrap.e-droparea .e-browsebtn,
526
+ .e-bigger .e-richtexteditor .e-dialog .e-aud-uploadwrap.e-droparea .e-browsebtn,
527
+ .e-bigger .e-richtexteditor .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
528
+ .e-richtexteditor.e-bigger .e-dialog .e-img-uploadwrap.e-droparea .e-browsebtn,
529
+ .e-richtexteditor.e-bigger .e-dialog .e-aud-uploadwrap.e-droparea .e-browsebtn,
530
+ .e-richtexteditor.e-bigger .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn {
531
+ top: -120px;
532
+ }
525
533
 
526
534
  .e-richtexteditor {
527
535
  color: #333;
@@ -1161,6 +1169,8 @@
1161
1169
  .e-rte-image.e-imginline,
1162
1170
  .e-rte-audio.e-audio-inline,
1163
1171
  .e-rte-video.e-video-inline {
1172
+ margin-left: 5px;
1173
+ margin-right: 5px;
1164
1174
  display: inline-block;
1165
1175
  float: none;
1166
1176
  max-width: calc(100% - 10px);
@@ -1218,19 +1228,19 @@
1218
1228
  }
1219
1229
 
1220
1230
  .e-rte-img-caption.e-imgcenter {
1221
- display: block;
1231
+ display: contents;
1222
1232
  margin-left: auto;
1223
1233
  margin-right: auto;
1224
1234
  }
1225
1235
 
1226
1236
  .e-rte-img-caption.e-imgright {
1227
- display: block;
1237
+ display: contents;
1228
1238
  margin-left: auto;
1229
1239
  margin-right: 0;
1230
1240
  }
1231
1241
 
1232
1242
  .e-rte-img-caption.e-imgleft {
1233
- display: block;
1243
+ display: contents;
1234
1244
  margin-left: 0;
1235
1245
  margin-right: auto;
1236
1246
  }
@@ -1247,7 +1257,7 @@
1247
1257
  }
1248
1258
 
1249
1259
  .e-img-caption.e-rte-img-caption.e-imgbreak {
1250
- display: block;
1260
+ display: contents;
1251
1261
  }
1252
1262
 
1253
1263
  .e-rte-table {
@@ -1432,13 +1442,13 @@
1432
1442
  margin: 0 auto;
1433
1443
  padding: 0 18px;
1434
1444
  position: relative;
1435
- top: -50px;
1445
+ top: -120px;
1436
1446
  }
1437
1447
  .e-richtexteditor .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
1438
1448
  .e-richtexteditor .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn,
1439
1449
  .e-rte-elements .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
1440
1450
  .e-rte-elements .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {
1441
- top: -130px;
1451
+ top: -120px;
1442
1452
  }
1443
1453
  .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap.e-droparea .e-browsebtn,
1444
1454
  .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap.e-droparea .e-browsebtn,
@@ -1755,6 +1765,14 @@
1755
1765
  .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar {
1756
1766
  min-height: 48px;
1757
1767
  }
1768
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content,
1769
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret {
1770
+ height: 48px;
1771
+ }
1772
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content:hover,
1773
+ .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret:hover {
1774
+ height: 48px;
1775
+ }
1758
1776
  .e-bigger .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items:not(.e-tbar-pos) {
1759
1777
  margin: 0 6px;
1760
1778
  min-height: 48px;
@@ -2587,7 +2605,7 @@
2587
2605
  margin: 0 auto;
2588
2606
  padding: 0 18px;
2589
2607
  position: relative;
2590
- top: -50px;
2608
+ top: -120px;
2591
2609
  }
2592
2610
  .e-rte-elements.e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
2593
2611
  .e-rte-elements.e-dialog .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {
@@ -2694,9 +2712,6 @@
2694
2712
  .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover .e-icons {
2695
2713
  color: #000;
2696
2714
  }
2697
- .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:focus .e-icons {
2698
- color: #000;
2699
- }
2700
2715
  .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn .e-icons {
2701
2716
  color: #000;
2702
2717
  }
@@ -2879,6 +2894,16 @@
2879
2894
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items {
2880
2895
  background: #fff;
2881
2896
  }
2897
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content {
2898
+ padding-top: 1px;
2899
+ height: 40px;
2900
+ }
2901
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-rte-color-content:hover {
2902
+ background: #eaeaea;
2903
+ }
2904
+ .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-rte-backgroundcolor-dropdown .e-caret:hover {
2905
+ background: #eaeaea;
2906
+ }
2882
2907
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-separator {
2883
2908
  border: 0.5px solid rgba(0, 0, 0, 0.05);
2884
2909
  }
@@ -2936,14 +2961,20 @@
2936
2961
  display: block;
2937
2962
  font-family: "Segoe UI", "GeezaPro", "DejaVu Serif", sans-serif, "-apple-system", "BlinkMacSystemFont";
2938
2963
  font-size: 14px;
2939
- height: 185px;
2964
+ height: 128px;
2940
2965
  margin: 0 auto;
2941
2966
  text-align: center;
2942
2967
  width: auto;
2943
2968
  }
2944
2969
 
2945
2970
  .e-dialog .e-vid-uploadwrap .e-droptext {
2946
- height: 108px;
2971
+ height: 128px;
2972
+ }
2973
+
2974
+ .e-bigger .e-richtexteditor .e-dialog .e-img-uploadwrap .e-droptext,
2975
+ .e-bigger .e-richtexteditor .e-dialog .e-aud-uploadwrap .e-droptext,
2976
+ .e-bigger .e-richtexteditor .e-dialog .e-vid-uploadwrap .e-droptext {
2977
+ height: 140px;
2947
2978
  }
2948
2979
 
2949
2980
  .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,