@syncfusion/ej2-richtexteditor 24.2.8 → 25.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 (134) 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 +955 -495
  6. package/dist/es6/ej2-richtexteditor.es2015.js.map +1 -1
  7. package/dist/es6/ej2-richtexteditor.es5.js +939 -484
  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 +13 -13
  13. package/src/common/config.d.ts +7 -0
  14. package/src/common/config.js +11 -0
  15. package/src/common/interface.d.ts +12 -0
  16. package/src/common/types.d.ts +6 -0
  17. package/src/editor-manager/plugin/dom-node.d.ts +5 -1
  18. package/src/editor-manager/plugin/dom-node.js +161 -12
  19. package/src/editor-manager/plugin/formats.js +1 -1
  20. package/src/editor-manager/plugin/image.js +12 -16
  21. package/src/editor-manager/plugin/inserthtml.d.ts +1 -0
  22. package/src/editor-manager/plugin/inserthtml.js +40 -1
  23. package/src/editor-manager/plugin/link.js +1 -1
  24. package/src/editor-manager/plugin/lists.js +24 -2
  25. package/src/editor-manager/plugin/ms-word-clean-up.d.ts +1 -0
  26. package/src/editor-manager/plugin/ms-word-clean-up.js +87 -58
  27. package/src/editor-manager/plugin/selection-commands.js +52 -3
  28. package/src/editor-manager/plugin/table.js +18 -3
  29. package/src/editor-manager/plugin/toolbar-status.d.ts +2 -2
  30. package/src/editor-manager/plugin/toolbar-status.js +17 -9
  31. package/src/rich-text-editor/actions/base-quick-toolbar.d.ts +3 -3
  32. package/src/rich-text-editor/actions/base-quick-toolbar.js +44 -10
  33. package/src/rich-text-editor/actions/base-toolbar.js +24 -30
  34. package/src/rich-text-editor/actions/dropdown-buttons.js +4 -4
  35. package/src/rich-text-editor/actions/emoji-picker.js +2 -2
  36. package/src/rich-text-editor/actions/enter-key.js +4 -3
  37. package/src/rich-text-editor/actions/full-screen.js +2 -2
  38. package/src/rich-text-editor/actions/html-editor.d.ts +0 -2
  39. package/src/rich-text-editor/actions/html-editor.js +18 -31
  40. package/src/rich-text-editor/actions/markdown-editor.js +3 -1
  41. package/src/rich-text-editor/actions/paste-clean-up.d.ts +1 -0
  42. package/src/rich-text-editor/actions/paste-clean-up.js +23 -0
  43. package/src/rich-text-editor/actions/quick-toolbar.d.ts +7 -0
  44. package/src/rich-text-editor/actions/quick-toolbar.js +24 -9
  45. package/src/rich-text-editor/actions/resize.js +2 -1
  46. package/src/rich-text-editor/actions/toolbar.d.ts +0 -2
  47. package/src/rich-text-editor/actions/toolbar.js +13 -85
  48. package/src/rich-text-editor/base/classes.d.ts +0 -5
  49. package/src/rich-text-editor/base/classes.js +0 -5
  50. package/src/rich-text-editor/base/constant.d.ts +5 -0
  51. package/src/rich-text-editor/base/constant.js +5 -0
  52. package/src/rich-text-editor/base/interface.d.ts +36 -2
  53. package/src/rich-text-editor/base/rich-text-editor-model.d.ts +2 -2
  54. package/src/rich-text-editor/base/rich-text-editor.d.ts +4 -3
  55. package/src/rich-text-editor/base/rich-text-editor.js +81 -58
  56. package/src/rich-text-editor/base/util.js +8 -2
  57. package/src/rich-text-editor/models/default-locale.js +15 -12
  58. package/src/rich-text-editor/models/toolbar-settings-model.d.ts +1 -1
  59. package/src/rich-text-editor/models/toolbar-settings.d.ts +1 -1
  60. package/src/rich-text-editor/models/toolbar-settings.js +1 -1
  61. package/src/rich-text-editor/renderer/iframe-content-renderer.js +2 -1
  62. package/src/rich-text-editor/renderer/image-module.d.ts +8 -1
  63. package/src/rich-text-editor/renderer/image-module.js +148 -155
  64. package/src/rich-text-editor/renderer/table-module.d.ts +2 -0
  65. package/src/rich-text-editor/renderer/table-module.js +71 -8
  66. package/src/rich-text-editor/renderer/toolbar-renderer.d.ts +3 -0
  67. package/src/rich-text-editor/renderer/toolbar-renderer.js +61 -2
  68. package/src/rich-text-editor/renderer/video-module.js +7 -4
  69. package/src/rich-text-editor/renderer/view-source.js +7 -4
  70. package/styles/bootstrap-dark.css +57 -17
  71. package/styles/bootstrap.css +58 -18
  72. package/styles/bootstrap4.css +58 -18
  73. package/styles/bootstrap5-dark.css +64 -17
  74. package/styles/bootstrap5.css +64 -17
  75. package/styles/fabric-dark.css +57 -17
  76. package/styles/fabric.css +58 -18
  77. package/styles/fluent-dark.css +57 -17
  78. package/styles/fluent.css +57 -17
  79. package/styles/highcontrast-light.css +57 -17
  80. package/styles/highcontrast.css +58 -18
  81. package/styles/material-dark.css +57 -17
  82. package/styles/material.css +57 -17
  83. package/styles/material3-dark.css +59 -19
  84. package/styles/material3.css +59 -19
  85. package/styles/rich-text-editor/_bds-definition.scss +279 -0
  86. package/styles/rich-text-editor/_bootstrap-dark-definition.scss +1 -0
  87. package/styles/rich-text-editor/_bootstrap-definition.scss +1 -1
  88. package/styles/rich-text-editor/_bootstrap4-definition.scss +3 -2
  89. package/styles/rich-text-editor/_bootstrap5-definition.scss +1 -0
  90. package/styles/rich-text-editor/_fabric-dark-definition.scss +1 -0
  91. package/styles/rich-text-editor/_fabric-definition.scss +2 -1
  92. package/styles/rich-text-editor/_fluent-definition.scss +1 -0
  93. package/styles/rich-text-editor/_fusionnew-definition.scss +1 -0
  94. package/styles/rich-text-editor/_highcontrast-definition.scss +2 -1
  95. package/styles/rich-text-editor/_highcontrast-light-definition.scss +1 -0
  96. package/styles/rich-text-editor/_layout.scss +47 -13
  97. package/styles/rich-text-editor/_material-dark-definition.scss +1 -0
  98. package/styles/rich-text-editor/_material-definition.scss +1 -0
  99. package/styles/rich-text-editor/_material3-definition.scss +1 -0
  100. package/styles/rich-text-editor/_tailwind-definition.scss +4 -3
  101. package/styles/rich-text-editor/_theme.scss +18 -5
  102. package/styles/rich-text-editor/bootstrap-dark.css +57 -17
  103. package/styles/rich-text-editor/bootstrap.css +58 -18
  104. package/styles/rich-text-editor/bootstrap4.css +58 -18
  105. package/styles/rich-text-editor/bootstrap5-dark.css +64 -17
  106. package/styles/rich-text-editor/bootstrap5.css +64 -17
  107. package/styles/rich-text-editor/fabric-dark.css +57 -17
  108. package/styles/rich-text-editor/fabric.css +58 -18
  109. package/styles/rich-text-editor/fluent-dark.css +57 -17
  110. package/styles/rich-text-editor/fluent.css +57 -17
  111. package/styles/rich-text-editor/highcontrast-light.css +57 -17
  112. package/styles/rich-text-editor/highcontrast.css +58 -18
  113. package/styles/rich-text-editor/icons/_bds.scss +351 -0
  114. package/styles/rich-text-editor/icons/_bootstrap-dark.scss +7 -4
  115. package/styles/rich-text-editor/icons/_bootstrap.scss +7 -4
  116. package/styles/rich-text-editor/icons/_bootstrap4.scss +7 -4
  117. package/styles/rich-text-editor/icons/_bootstrap5.scss +7 -4
  118. package/styles/rich-text-editor/icons/_fabric-dark.scss +7 -4
  119. package/styles/rich-text-editor/icons/_fabric.scss +7 -4
  120. package/styles/rich-text-editor/icons/_fluent.scss +7 -4
  121. package/styles/rich-text-editor/icons/_highcontrast-light.scss +7 -4
  122. package/styles/rich-text-editor/icons/_highcontrast.scss +7 -4
  123. package/styles/rich-text-editor/icons/_material-dark.scss +7 -4
  124. package/styles/rich-text-editor/icons/_material.scss +7 -4
  125. package/styles/rich-text-editor/icons/_material3.scss +7 -4
  126. package/styles/rich-text-editor/icons/_tailwind.scss +7 -4
  127. package/styles/rich-text-editor/material-dark.css +57 -17
  128. package/styles/rich-text-editor/material.css +57 -17
  129. package/styles/rich-text-editor/material3-dark.css +59 -19
  130. package/styles/rich-text-editor/material3.css +59 -19
  131. package/styles/rich-text-editor/tailwind-dark.css +61 -21
  132. package/styles/rich-text-editor/tailwind.css +61 -21
  133. package/styles/tailwind-dark.css +61 -21
  134. package/styles/tailwind.css +61 -21
@@ -129,12 +129,14 @@
129
129
  content: "\e895";
130
130
  }
131
131
  .e-rte-toolbar .e-replace::before,
132
+ .e-rte-dropdown-popup .e-replace::before {
133
+ content: "\e710";
134
+ }
132
135
  .e-rte-toolbar .e-audio-replace::before,
133
136
  .e-rte-toolbar .e-video-replace::before,
134
- .e-rte-dropdown-popup .e-replace::before,
135
137
  .e-rte-dropdown-popup .e-audio-replace::before,
136
138
  .e-rte-dropdown-popup .e-video-replace::before {
137
- content: "\e710";
139
+ content: "\e772";
138
140
  }
139
141
  .e-rte-toolbar .e-align::before,
140
142
  .e-rte-dropdown-popup .e-align::before {
@@ -224,11 +226,11 @@
224
226
  }
225
227
  .e-rte-toolbar .e-table-header::before,
226
228
  .e-rte-dropdown-popup .e-table-header::before {
227
- content: "\e7e9";
229
+ content: "\e8f4";
228
230
  }
229
231
  .e-rte-toolbar .e-table-remove::before,
230
232
  .e-rte-dropdown-popup .e-table-remove::before {
231
- content: "\e820";
233
+ content: "\e811";
232
234
  }
233
235
  .e-rte-toolbar .e-table-rows::before,
234
236
  .e-rte-dropdown-popup .e-table-rows::before {
@@ -455,7 +457,7 @@
455
457
  .e-richtexteditor.e-bigger .e-rte-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn.e-btn,
456
458
  .e-richtexteditor.e-bigger .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn.e-btn,
457
459
  .e-richtexteditor.e-bigger .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn.e-btn {
458
- padding: 0 6px;
460
+ padding: 0 8px;
459
461
  }
460
462
  .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-dropdown-btn .e-rte-color-content,
461
463
  .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-dropdown-btn .e-rte-color-content,
@@ -534,6 +536,14 @@
534
536
  .e-richtexteditor.e-bigger .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn {
535
537
  top: -120px;
536
538
  }
539
+ .e-bigger .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control,
540
+ .e-richtexteditor.e-bigger .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control {
541
+ padding: 0 8px;
542
+ }
543
+ .e-bigger .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control:hover,
544
+ .e-richtexteditor.e-bigger .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control:hover {
545
+ padding: 0 8px;
546
+ }
537
547
 
538
548
  .e-richtexteditor {
539
549
  color: #111827;
@@ -776,15 +786,6 @@
776
786
  display: block;
777
787
  z-index: 101;
778
788
  }
779
- .e-richtexteditor .e-rte-toolbar.e-rte-tb-float,
780
- .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar.e-rte-tb-float {
781
- position: fixed;
782
- top: 0;
783
- }
784
- .e-richtexteditor .e-rte-toolbar.e-rte-tb-float.e-rte-tb-abs-float,
785
- .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar.e-rte-tb-float.e-rte-tb-abs-float {
786
- position: absolute;
787
- }
788
789
  .e-richtexteditor .rte-placeholder {
789
790
  color: #111827;
790
791
  line-height: 1.5;
@@ -810,6 +811,8 @@
810
811
  }
811
812
  .e-richtexteditor .e-rte-content .e-content,
812
813
  .e-richtexteditor .e-source-content .e-content {
814
+ width: 100%;
815
+ float: left;
813
816
  background: unset;
814
817
  box-sizing: border-box;
815
818
  height: 100%;
@@ -830,6 +833,12 @@
830
833
  .e-richtexteditor .e-source-content .e-content li {
831
834
  margin-bottom: 10px;
832
835
  }
836
+ .e-richtexteditor .e-rte-content .e-content li ol,
837
+ .e-richtexteditor .e-rte-content .e-content li ul,
838
+ .e-richtexteditor .e-source-content .e-content li ol,
839
+ .e-richtexteditor .e-source-content .e-content li ul {
840
+ margin-block-start: 10px;
841
+ }
833
842
  .e-richtexteditor .e-rte-content .e-content h1,
834
843
  .e-richtexteditor .e-source-content .e-content h1 {
835
844
  font-size: 2.17em;
@@ -936,6 +945,7 @@
936
945
  position: absolute;
937
946
  right: 0;
938
947
  z-index: 100;
948
+ pointer-events: none;
939
949
  }
940
950
  .e-richtexteditor .e-rte-character-count.e-warning {
941
951
  color: #c2410c;
@@ -1258,13 +1268,11 @@
1258
1268
  }
1259
1269
 
1260
1270
  .e-rte-img-caption .e-rte-image.e-imgright {
1261
- float: none;
1262
1271
  margin-left: auto;
1263
1272
  margin-right: 0;
1264
1273
  }
1265
1274
 
1266
1275
  .e-rte-img-caption .e-rte-image.e-imgleft {
1267
- float: none;
1268
1276
  margin: 0;
1269
1277
  }
1270
1278
 
@@ -1283,6 +1291,7 @@
1283
1291
  height: 20px;
1284
1292
  min-width: 20px;
1285
1293
  padding: 2px 5px;
1294
+ box-sizing: border-box;
1286
1295
  }
1287
1296
 
1288
1297
  .e-rte-table.e-dashed-border td,
@@ -1303,13 +1312,20 @@
1303
1312
  }
1304
1313
 
1305
1314
  .e-rte-img-caption.e-imgleft .e-img-inner {
1315
+ float: left;
1306
1316
  text-align: left;
1307
1317
  }
1308
1318
 
1309
1319
  .e-rte-img-caption.e-imgright .e-img-inner {
1320
+ float: right;
1310
1321
  text-align: right;
1311
1322
  }
1312
1323
 
1324
+ .e-rte-img-caption.e-imgleft .e-img-wrap,
1325
+ .e-rte-img-caption.e-imgright .e-img-wrap {
1326
+ display: contents;
1327
+ }
1328
+
1313
1329
  .e-rte-img-caption .e-img-wrap {
1314
1330
  display: inline-block;
1315
1331
  margin: auto;
@@ -1564,7 +1580,7 @@
1564
1580
  .e-rte-elements .e-rte-content .e-content table td.e-cell-select,
1565
1581
  .e-rte-elements .e-rte-content .e-content table th.e-cell-select {
1566
1582
  border: 1px double #4f46e5;
1567
- height: 24.67px;
1583
+ height: inherit;
1568
1584
  }
1569
1585
  .e-richtexteditor span.e-table-box,
1570
1586
  .e-rte-elements span.e-table-box {
@@ -2646,6 +2662,27 @@
2646
2662
  visibility: hidden;
2647
2663
  }
2648
2664
 
2665
+ .e-richtexteditor .e-toolbar-wrapper.e-rte-tb-float,
2666
+ .e-richtexteditor .e-toolbar-container.e-rte-tb-float {
2667
+ position: sticky;
2668
+ top: 0;
2669
+ overflow: visible;
2670
+ }
2671
+ .e-richtexteditor .e-toolbar-wrapper,
2672
+ .e-richtexteditor .e-toolbar-container {
2673
+ height: auto;
2674
+ z-index: 10;
2675
+ }
2676
+ .e-richtexteditor .e-toolbar .e-toolbar-pop.e-toolbar-extended {
2677
+ position: relative;
2678
+ width: 100%;
2679
+ top: 0 !important; /* stylelint-disable-line declaration-no-important */
2680
+ left: 0 !important; /* stylelint-disable-line declaration-no-important */
2681
+ }
2682
+ .e-richtexteditor .e-toolbar .e-toolbar-pop.e-toolbar-extended.e-popup-open {
2683
+ display: block;
2684
+ }
2685
+
2649
2686
  /*! tab layout */
2650
2687
  .e-richtexteditor .e-rte-toolbar {
2651
2688
  border: 1px solid #e5e7eb;
@@ -2656,7 +2693,7 @@
2656
2693
  }
2657
2694
  .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 {
2658
2695
  background: #e5e7eb;
2659
- border: 0 solid #d1d5db;
2696
+ border: 1px solid #d1d5db;
2660
2697
  }
2661
2698
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn .e-icons, .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn:focus .e-icons {
2662
2699
  color: #6b7280;
@@ -2727,7 +2764,7 @@
2727
2764
  }
2728
2765
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-backgroundcolor-dropdown.e-active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-fontcolor-dropdown.e-active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-numberformatlist-dropdown.e-active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-bulletformatlist-dropdown.e-active {
2729
2766
  background: #e5e7eb;
2730
- border: 1px solid #d1d5db;
2767
+ border: 0 solid #d1d5db;
2731
2768
  }
2732
2769
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-backgroundcolor-dropdown.e-active .e-rte-color-content::after, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-fontcolor-dropdown.e-active .e-rte-color-content::after, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-numberformatlist-dropdown.e-active .e-rte-color-content::after, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-bulletformatlist-dropdown.e-active .e-rte-color-content::after {
2733
2770
  background: #fff;
@@ -2765,6 +2802,9 @@
2765
2802
  .e-richtexteditor .e-toolbar-wrapper .e-rte-toolbar:not(.e-rte-tb-float) {
2766
2803
  border-bottom: 1px solid #e5e7eb;
2767
2804
  }
2805
+ .e-richtexteditor .e-toolbar-wrapper.e-rte-tb-float .e-rte-toolbar {
2806
+ border-top: 1px solid #e5e7eb;
2807
+ }
2768
2808
  .e-richtexteditor .e-toolbar-wrapper + .e-rte-toolbar:not(.e-rte-tb-float) {
2769
2809
  border: 0;
2770
2810
  }
@@ -2963,7 +3003,7 @@
2963
3003
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn,
2964
3004
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn:focus {
2965
3005
  background: #e5e7eb;
2966
- border: 0 solid #d1d5db;
3006
+ border: 1px solid #d1d5db;
2967
3007
  }
2968
3008
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn .e-icons,
2969
3009
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn:focus .e-icons {
@@ -3088,7 +3128,7 @@ span.e-rte-videoboxmark {
3088
3128
  }
3089
3129
 
3090
3130
  .e-dropdown-popup ul .e-item.e-active {
3091
- background-color: #e5e7eb;
3131
+ background: #e5e7eb;
3092
3132
  color: #111827;
3093
3133
  }
3094
3134
 
@@ -129,12 +129,14 @@
129
129
  content: "\e895";
130
130
  }
131
131
  .e-rte-toolbar .e-replace::before,
132
+ .e-rte-dropdown-popup .e-replace::before {
133
+ content: "\e710";
134
+ }
132
135
  .e-rte-toolbar .e-audio-replace::before,
133
136
  .e-rte-toolbar .e-video-replace::before,
134
- .e-rte-dropdown-popup .e-replace::before,
135
137
  .e-rte-dropdown-popup .e-audio-replace::before,
136
138
  .e-rte-dropdown-popup .e-video-replace::before {
137
- content: "\e710";
139
+ content: "\e772";
138
140
  }
139
141
  .e-rte-toolbar .e-align::before,
140
142
  .e-rte-dropdown-popup .e-align::before {
@@ -224,11 +226,11 @@
224
226
  }
225
227
  .e-rte-toolbar .e-table-header::before,
226
228
  .e-rte-dropdown-popup .e-table-header::before {
227
- content: "\e7e9";
229
+ content: "\e8f4";
228
230
  }
229
231
  .e-rte-toolbar .e-table-remove::before,
230
232
  .e-rte-dropdown-popup .e-table-remove::before {
231
- content: "\e820";
233
+ content: "\e811";
232
234
  }
233
235
  .e-rte-toolbar .e-table-rows::before,
234
236
  .e-rte-dropdown-popup .e-table-rows::before {
@@ -455,7 +457,7 @@
455
457
  .e-richtexteditor.e-bigger .e-rte-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn.e-btn,
456
458
  .e-richtexteditor.e-bigger .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn.e-btn,
457
459
  .e-richtexteditor.e-bigger .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn.e-btn {
458
- padding: 0 6px;
460
+ padding: 0 8px;
459
461
  }
460
462
  .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-dropdown-btn .e-rte-color-content,
461
463
  .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-dropdown-btn .e-rte-color-content,
@@ -534,6 +536,14 @@
534
536
  .e-richtexteditor.e-bigger .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn {
535
537
  top: -120px;
536
538
  }
539
+ .e-bigger .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control,
540
+ .e-richtexteditor.e-bigger .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control {
541
+ padding: 0 8px;
542
+ }
543
+ .e-bigger .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control:hover,
544
+ .e-richtexteditor.e-bigger .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control:hover {
545
+ padding: 0 8px;
546
+ }
537
547
 
538
548
  .e-richtexteditor {
539
549
  color: #fff;
@@ -776,15 +786,6 @@
776
786
  display: block;
777
787
  z-index: 101;
778
788
  }
779
- .e-richtexteditor .e-rte-toolbar.e-rte-tb-float,
780
- .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar.e-rte-tb-float {
781
- position: fixed;
782
- top: 0;
783
- }
784
- .e-richtexteditor .e-rte-toolbar.e-rte-tb-float.e-rte-tb-abs-float,
785
- .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar.e-rte-tb-float.e-rte-tb-abs-float {
786
- position: absolute;
787
- }
788
789
  .e-richtexteditor .rte-placeholder {
789
790
  color: #fff;
790
791
  line-height: 1.5;
@@ -810,6 +811,8 @@
810
811
  }
811
812
  .e-richtexteditor .e-rte-content .e-content,
812
813
  .e-richtexteditor .e-source-content .e-content {
814
+ width: 100%;
815
+ float: left;
813
816
  background: unset;
814
817
  box-sizing: border-box;
815
818
  height: 100%;
@@ -830,6 +833,12 @@
830
833
  .e-richtexteditor .e-source-content .e-content li {
831
834
  margin-bottom: 10px;
832
835
  }
836
+ .e-richtexteditor .e-rte-content .e-content li ol,
837
+ .e-richtexteditor .e-rte-content .e-content li ul,
838
+ .e-richtexteditor .e-source-content .e-content li ol,
839
+ .e-richtexteditor .e-source-content .e-content li ul {
840
+ margin-block-start: 10px;
841
+ }
833
842
  .e-richtexteditor .e-rte-content .e-content h1,
834
843
  .e-richtexteditor .e-source-content .e-content h1 {
835
844
  font-size: 2.17em;
@@ -936,6 +945,7 @@
936
945
  position: absolute;
937
946
  right: 0;
938
947
  z-index: 100;
948
+ pointer-events: none;
939
949
  }
940
950
  .e-richtexteditor .e-rte-character-count.e-warning {
941
951
  color: #f97316;
@@ -1258,13 +1268,11 @@
1258
1268
  }
1259
1269
 
1260
1270
  .e-rte-img-caption .e-rte-image.e-imgright {
1261
- float: none;
1262
1271
  margin-left: auto;
1263
1272
  margin-right: 0;
1264
1273
  }
1265
1274
 
1266
1275
  .e-rte-img-caption .e-rte-image.e-imgleft {
1267
- float: none;
1268
1276
  margin: 0;
1269
1277
  }
1270
1278
 
@@ -1283,6 +1291,7 @@
1283
1291
  height: 20px;
1284
1292
  min-width: 20px;
1285
1293
  padding: 2px 5px;
1294
+ box-sizing: border-box;
1286
1295
  }
1287
1296
 
1288
1297
  .e-rte-table.e-dashed-border td,
@@ -1303,13 +1312,20 @@
1303
1312
  }
1304
1313
 
1305
1314
  .e-rte-img-caption.e-imgleft .e-img-inner {
1315
+ float: left;
1306
1316
  text-align: left;
1307
1317
  }
1308
1318
 
1309
1319
  .e-rte-img-caption.e-imgright .e-img-inner {
1320
+ float: right;
1310
1321
  text-align: right;
1311
1322
  }
1312
1323
 
1324
+ .e-rte-img-caption.e-imgleft .e-img-wrap,
1325
+ .e-rte-img-caption.e-imgright .e-img-wrap {
1326
+ display: contents;
1327
+ }
1328
+
1313
1329
  .e-rte-img-caption .e-img-wrap {
1314
1330
  display: inline-block;
1315
1331
  margin: auto;
@@ -1564,7 +1580,7 @@
1564
1580
  .e-rte-elements .e-rte-content .e-content table td.e-cell-select,
1565
1581
  .e-rte-elements .e-rte-content .e-content table th.e-cell-select {
1566
1582
  border: 1px double #22d3ee;
1567
- height: 24.67px;
1583
+ height: inherit;
1568
1584
  }
1569
1585
  .e-richtexteditor span.e-table-box,
1570
1586
  .e-rte-elements span.e-table-box {
@@ -2646,6 +2662,27 @@
2646
2662
  visibility: hidden;
2647
2663
  }
2648
2664
 
2665
+ .e-richtexteditor .e-toolbar-wrapper.e-rte-tb-float,
2666
+ .e-richtexteditor .e-toolbar-container.e-rte-tb-float {
2667
+ position: sticky;
2668
+ top: 0;
2669
+ overflow: visible;
2670
+ }
2671
+ .e-richtexteditor .e-toolbar-wrapper,
2672
+ .e-richtexteditor .e-toolbar-container {
2673
+ height: auto;
2674
+ z-index: 10;
2675
+ }
2676
+ .e-richtexteditor .e-toolbar .e-toolbar-pop.e-toolbar-extended {
2677
+ position: relative;
2678
+ width: 100%;
2679
+ top: 0 !important; /* stylelint-disable-line declaration-no-important */
2680
+ left: 0 !important; /* stylelint-disable-line declaration-no-important */
2681
+ }
2682
+ .e-richtexteditor .e-toolbar .e-toolbar-pop.e-toolbar-extended.e-popup-open {
2683
+ display: block;
2684
+ }
2685
+
2649
2686
  /*! tab layout */
2650
2687
  .e-richtexteditor .e-rte-toolbar {
2651
2688
  border: 1px solid #4b5563;
@@ -2656,7 +2693,7 @@
2656
2693
  }
2657
2694
  .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 {
2658
2695
  background: #4b5563;
2659
- border: 0 solid #6b7280;
2696
+ border: 1px solid #6b7280;
2660
2697
  }
2661
2698
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn .e-icons, .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn:focus .e-icons {
2662
2699
  color: #d1d5db;
@@ -2727,7 +2764,7 @@
2727
2764
  }
2728
2765
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-backgroundcolor-dropdown.e-active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-fontcolor-dropdown.e-active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-numberformatlist-dropdown.e-active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-bulletformatlist-dropdown.e-active {
2729
2766
  background: #4b5563;
2730
- border: 1px solid #6b7280;
2767
+ border: 0 solid #6b7280;
2731
2768
  }
2732
2769
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-backgroundcolor-dropdown.e-active .e-rte-color-content::after, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-fontcolor-dropdown.e-active .e-rte-color-content::after, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-numberformatlist-dropdown.e-active .e-rte-color-content::after, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-bulletformatlist-dropdown.e-active .e-rte-color-content::after {
2733
2770
  background: #1f2937;
@@ -2765,6 +2802,9 @@
2765
2802
  .e-richtexteditor .e-toolbar-wrapper .e-rte-toolbar:not(.e-rte-tb-float) {
2766
2803
  border-bottom: 1px solid #4b5563;
2767
2804
  }
2805
+ .e-richtexteditor .e-toolbar-wrapper.e-rte-tb-float .e-rte-toolbar {
2806
+ border-top: 1px solid #4b5563;
2807
+ }
2768
2808
  .e-richtexteditor .e-toolbar-wrapper + .e-rte-toolbar:not(.e-rte-tb-float) {
2769
2809
  border: 0;
2770
2810
  }
@@ -2963,7 +3003,7 @@
2963
3003
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn,
2964
3004
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn:focus {
2965
3005
  background: #4b5563;
2966
- border: 0 solid #6b7280;
3006
+ border: 1px solid #6b7280;
2967
3007
  }
2968
3008
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn .e-icons,
2969
3009
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn:focus .e-icons {
@@ -3088,7 +3128,7 @@ span.e-rte-videoboxmark {
3088
3128
  }
3089
3129
 
3090
3130
  .e-dropdown-popup ul .e-item.e-active {
3091
- background-color: #4b5563;
3131
+ background: #4b5563;
3092
3132
  color: #fff;
3093
3133
  }
3094
3134
 
@@ -129,12 +129,14 @@
129
129
  content: "\e895";
130
130
  }
131
131
  .e-rte-toolbar .e-replace::before,
132
+ .e-rte-dropdown-popup .e-replace::before {
133
+ content: "\e710";
134
+ }
132
135
  .e-rte-toolbar .e-audio-replace::before,
133
136
  .e-rte-toolbar .e-video-replace::before,
134
- .e-rte-dropdown-popup .e-replace::before,
135
137
  .e-rte-dropdown-popup .e-audio-replace::before,
136
138
  .e-rte-dropdown-popup .e-video-replace::before {
137
- content: "\e710";
139
+ content: "\e772";
138
140
  }
139
141
  .e-rte-toolbar .e-align::before,
140
142
  .e-rte-dropdown-popup .e-align::before {
@@ -224,11 +226,11 @@
224
226
  }
225
227
  .e-rte-toolbar .e-table-header::before,
226
228
  .e-rte-dropdown-popup .e-table-header::before {
227
- content: "\e7e9";
229
+ content: "\e8f4";
228
230
  }
229
231
  .e-rte-toolbar .e-table-remove::before,
230
232
  .e-rte-dropdown-popup .e-table-remove::before {
231
- content: "\e820";
233
+ content: "\e811";
232
234
  }
233
235
  .e-rte-toolbar .e-table-rows::before,
234
236
  .e-rte-dropdown-popup .e-table-rows::before {
@@ -455,7 +457,7 @@
455
457
  .e-richtexteditor.e-bigger .e-rte-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn.e-btn,
456
458
  .e-richtexteditor.e-bigger .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn.e-btn,
457
459
  .e-richtexteditor.e-bigger .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-active .e-tbar-btn.e-btn {
458
- padding: 0 6px;
460
+ padding: 0 8px;
459
461
  }
460
462
  .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-dropdown-btn .e-rte-color-content,
461
463
  .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-dropdown-btn .e-rte-color-content,
@@ -534,6 +536,14 @@
534
536
  .e-richtexteditor.e-bigger .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn {
535
537
  top: -120px;
536
538
  }
539
+ .e-bigger .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control,
540
+ .e-richtexteditor.e-bigger .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control {
541
+ padding: 0 8px;
542
+ }
543
+ .e-bigger .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control:hover,
544
+ .e-richtexteditor.e-bigger .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-btn.e-control:hover {
545
+ padding: 0 8px;
546
+ }
537
547
 
538
548
  .e-richtexteditor {
539
549
  color: #111827;
@@ -776,15 +786,6 @@
776
786
  display: block;
777
787
  z-index: 101;
778
788
  }
779
- .e-richtexteditor .e-rte-toolbar.e-rte-tb-float,
780
- .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar.e-rte-tb-float {
781
- position: fixed;
782
- top: 0;
783
- }
784
- .e-richtexteditor .e-rte-toolbar.e-rte-tb-float.e-rte-tb-abs-float,
785
- .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar.e-rte-tb-float.e-rte-tb-abs-float {
786
- position: absolute;
787
- }
788
789
  .e-richtexteditor .rte-placeholder {
789
790
  color: #111827;
790
791
  line-height: 1.5;
@@ -810,6 +811,8 @@
810
811
  }
811
812
  .e-richtexteditor .e-rte-content .e-content,
812
813
  .e-richtexteditor .e-source-content .e-content {
814
+ width: 100%;
815
+ float: left;
813
816
  background: unset;
814
817
  box-sizing: border-box;
815
818
  height: 100%;
@@ -830,6 +833,12 @@
830
833
  .e-richtexteditor .e-source-content .e-content li {
831
834
  margin-bottom: 10px;
832
835
  }
836
+ .e-richtexteditor .e-rte-content .e-content li ol,
837
+ .e-richtexteditor .e-rte-content .e-content li ul,
838
+ .e-richtexteditor .e-source-content .e-content li ol,
839
+ .e-richtexteditor .e-source-content .e-content li ul {
840
+ margin-block-start: 10px;
841
+ }
833
842
  .e-richtexteditor .e-rte-content .e-content h1,
834
843
  .e-richtexteditor .e-source-content .e-content h1 {
835
844
  font-size: 2.17em;
@@ -936,6 +945,7 @@
936
945
  position: absolute;
937
946
  right: 0;
938
947
  z-index: 100;
948
+ pointer-events: none;
939
949
  }
940
950
  .e-richtexteditor .e-rte-character-count.e-warning {
941
951
  color: #c2410c;
@@ -1258,13 +1268,11 @@
1258
1268
  }
1259
1269
 
1260
1270
  .e-rte-img-caption .e-rte-image.e-imgright {
1261
- float: none;
1262
1271
  margin-left: auto;
1263
1272
  margin-right: 0;
1264
1273
  }
1265
1274
 
1266
1275
  .e-rte-img-caption .e-rte-image.e-imgleft {
1267
- float: none;
1268
1276
  margin: 0;
1269
1277
  }
1270
1278
 
@@ -1283,6 +1291,7 @@
1283
1291
  height: 20px;
1284
1292
  min-width: 20px;
1285
1293
  padding: 2px 5px;
1294
+ box-sizing: border-box;
1286
1295
  }
1287
1296
 
1288
1297
  .e-rte-table.e-dashed-border td,
@@ -1303,13 +1312,20 @@
1303
1312
  }
1304
1313
 
1305
1314
  .e-rte-img-caption.e-imgleft .e-img-inner {
1315
+ float: left;
1306
1316
  text-align: left;
1307
1317
  }
1308
1318
 
1309
1319
  .e-rte-img-caption.e-imgright .e-img-inner {
1320
+ float: right;
1310
1321
  text-align: right;
1311
1322
  }
1312
1323
 
1324
+ .e-rte-img-caption.e-imgleft .e-img-wrap,
1325
+ .e-rte-img-caption.e-imgright .e-img-wrap {
1326
+ display: contents;
1327
+ }
1328
+
1313
1329
  .e-rte-img-caption .e-img-wrap {
1314
1330
  display: inline-block;
1315
1331
  margin: auto;
@@ -1564,7 +1580,7 @@
1564
1580
  .e-rte-elements .e-rte-content .e-content table td.e-cell-select,
1565
1581
  .e-rte-elements .e-rte-content .e-content table th.e-cell-select {
1566
1582
  border: 1px double #4f46e5;
1567
- height: 24.67px;
1583
+ height: inherit;
1568
1584
  }
1569
1585
  .e-richtexteditor span.e-table-box,
1570
1586
  .e-rte-elements span.e-table-box {
@@ -2646,6 +2662,27 @@
2646
2662
  visibility: hidden;
2647
2663
  }
2648
2664
 
2665
+ .e-richtexteditor .e-toolbar-wrapper.e-rte-tb-float,
2666
+ .e-richtexteditor .e-toolbar-container.e-rte-tb-float {
2667
+ position: sticky;
2668
+ top: 0;
2669
+ overflow: visible;
2670
+ }
2671
+ .e-richtexteditor .e-toolbar-wrapper,
2672
+ .e-richtexteditor .e-toolbar-container {
2673
+ height: auto;
2674
+ z-index: 10;
2675
+ }
2676
+ .e-richtexteditor .e-toolbar .e-toolbar-pop.e-toolbar-extended {
2677
+ position: relative;
2678
+ width: 100%;
2679
+ top: 0 !important; /* stylelint-disable-line declaration-no-important */
2680
+ left: 0 !important; /* stylelint-disable-line declaration-no-important */
2681
+ }
2682
+ .e-richtexteditor .e-toolbar .e-toolbar-pop.e-toolbar-extended.e-popup-open {
2683
+ display: block;
2684
+ }
2685
+
2649
2686
  /*! tab layout */
2650
2687
  .e-richtexteditor .e-rte-toolbar {
2651
2688
  border: 1px solid #e5e7eb;
@@ -2656,7 +2693,7 @@
2656
2693
  }
2657
2694
  .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 {
2658
2695
  background: #e5e7eb;
2659
- border: 0 solid #d1d5db;
2696
+ border: 1px solid #d1d5db;
2660
2697
  }
2661
2698
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn .e-icons, .e-richtexteditor .e-rte-toolbar .e-toolbar-item.e-active .e-tbar-btn:focus .e-icons {
2662
2699
  color: #6b7280;
@@ -2727,7 +2764,7 @@
2727
2764
  }
2728
2765
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-backgroundcolor-dropdown.e-active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-fontcolor-dropdown.e-active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-numberformatlist-dropdown.e-active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-bulletformatlist-dropdown.e-active {
2729
2766
  background: #e5e7eb;
2730
- border: 1px solid #d1d5db;
2767
+ border: 0 solid #d1d5db;
2731
2768
  }
2732
2769
  .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-backgroundcolor-dropdown.e-active .e-rte-color-content::after, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-fontcolor-dropdown.e-active .e-rte-color-content::after, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-numberformatlist-dropdown.e-active .e-rte-color-content::after, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-bulletformatlist-dropdown.e-active .e-rte-color-content::after {
2733
2770
  background: #fff;
@@ -2765,6 +2802,9 @@
2765
2802
  .e-richtexteditor .e-toolbar-wrapper .e-rte-toolbar:not(.e-rte-tb-float) {
2766
2803
  border-bottom: 1px solid #e5e7eb;
2767
2804
  }
2805
+ .e-richtexteditor .e-toolbar-wrapper.e-rte-tb-float .e-rte-toolbar {
2806
+ border-top: 1px solid #e5e7eb;
2807
+ }
2768
2808
  .e-richtexteditor .e-toolbar-wrapper + .e-rte-toolbar:not(.e-rte-tb-float) {
2769
2809
  border: 0;
2770
2810
  }
@@ -2963,7 +3003,7 @@
2963
3003
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn,
2964
3004
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn:focus {
2965
3005
  background: #e5e7eb;
2966
- border: 0 solid #d1d5db;
3006
+ border: 1px solid #d1d5db;
2967
3007
  }
2968
3008
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn .e-icons,
2969
3009
  .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-toolbar-item.e-active .e-tbar-btn:focus .e-icons {
@@ -3088,7 +3128,7 @@ span.e-rte-videoboxmark {
3088
3128
  }
3089
3129
 
3090
3130
  .e-dropdown-popup ul .e-item.e-active {
3091
- background-color: #e5e7eb;
3131
+ background: #e5e7eb;
3092
3132
  color: #111827;
3093
3133
  }
3094
3134