@syncfusion/ej2-angular-richtexteditor 23.2.4 → 23.2.5-ngcc

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 (89) hide show
  1. package/@syncfusion/ej2-angular-richtexteditor.es5.js +343 -0
  2. package/@syncfusion/ej2-angular-richtexteditor.es5.js.map +1 -0
  3. package/@syncfusion/ej2-angular-richtexteditor.js +324 -0
  4. package/@syncfusion/ej2-angular-richtexteditor.js.map +1 -0
  5. package/CHANGELOG.md +1501 -0
  6. package/dist/ej2-angular-richtexteditor.umd.js +827 -0
  7. package/dist/ej2-angular-richtexteditor.umd.js.map +1 -0
  8. package/dist/ej2-angular-richtexteditor.umd.min.js +11 -0
  9. package/dist/ej2-angular-richtexteditor.umd.min.js.map +1 -0
  10. package/ej2-angular-richtexteditor.d.ts +5 -0
  11. package/ej2-angular-richtexteditor.metadata.json +1 -0
  12. package/package.json +14 -28
  13. package/postinstall/tagchange.js +18 -0
  14. package/schematics/utils/lib-details.d.ts +2 -2
  15. package/schematics/utils/lib-details.js +2 -2
  16. package/schematics/utils/lib-details.ts +2 -2
  17. package/src/rich-text-editor/richtexteditor-all.module.d.ts +0 -6
  18. package/src/rich-text-editor/richtexteditor.component.d.ts +0 -3
  19. package/src/rich-text-editor/richtexteditor.module.d.ts +0 -6
  20. package/styles/material3-dark.scss +0 -1
  21. package/styles/material3.scss +0 -1
  22. package/styles/rich-text-editor/bootstrap-dark.scss +1 -4
  23. package/styles/rich-text-editor/bootstrap.scss +1 -4
  24. package/styles/rich-text-editor/bootstrap4.scss +1 -4
  25. package/styles/rich-text-editor/bootstrap5-dark.scss +1 -4
  26. package/styles/rich-text-editor/bootstrap5.scss +1 -4
  27. package/styles/rich-text-editor/fabric-dark.scss +1 -4
  28. package/styles/rich-text-editor/fabric.scss +1 -4
  29. package/styles/rich-text-editor/fluent-dark.scss +1 -4
  30. package/styles/rich-text-editor/fluent.scss +1 -4
  31. package/styles/rich-text-editor/highcontrast-light.scss +1 -4
  32. package/styles/rich-text-editor/highcontrast.scss +1 -4
  33. package/styles/rich-text-editor/material-dark.scss +1 -4
  34. package/styles/rich-text-editor/material.scss +1 -4
  35. package/styles/rich-text-editor/material3-dark.scss +1 -4
  36. package/styles/rich-text-editor/material3.scss +1 -4
  37. package/styles/rich-text-editor/tailwind-dark.scss +1 -4
  38. package/styles/rich-text-editor/tailwind.scss +1 -4
  39. package/esm2020/public_api.mjs +0 -3
  40. package/esm2020/src/index.mjs +0 -5
  41. package/esm2020/src/rich-text-editor/richtexteditor-all.module.mjs +0 -71
  42. package/esm2020/src/rich-text-editor/richtexteditor.component.mjs +0 -197
  43. package/esm2020/src/rich-text-editor/richtexteditor.module.mjs +0 -25
  44. package/esm2020/syncfusion-ej2-angular-richtexteditor.mjs +0 -5
  45. package/fesm2015/syncfusion-ej2-angular-richtexteditor.mjs +0 -293
  46. package/fesm2015/syncfusion-ej2-angular-richtexteditor.mjs.map +0 -1
  47. package/fesm2020/syncfusion-ej2-angular-richtexteditor.mjs +0 -293
  48. package/fesm2020/syncfusion-ej2-angular-richtexteditor.mjs.map +0 -1
  49. package/styles/_all.scss +0 -1
  50. package/styles/rich-text-editor/_all.scss +0 -2
  51. package/styles/rich-text-editor/_bootstrap-dark-definition.scss +0 -277
  52. package/styles/rich-text-editor/_bootstrap-definition.scss +0 -334
  53. package/styles/rich-text-editor/_bootstrap4-definition.scss +0 -460
  54. package/styles/rich-text-editor/_bootstrap5-dark-definition.scss +0 -1
  55. package/styles/rich-text-editor/_bootstrap5-definition.scss +0 -262
  56. package/styles/rich-text-editor/_fabric-dark-definition.scss +0 -259
  57. package/styles/rich-text-editor/_fabric-definition.scss +0 -257
  58. package/styles/rich-text-editor/_fluent-dark-definition.scss +0 -1
  59. package/styles/rich-text-editor/_fluent-definition.scss +0 -263
  60. package/styles/rich-text-editor/_fusionnew-definition.scss +0 -261
  61. package/styles/rich-text-editor/_highcontrast-definition.scss +0 -257
  62. package/styles/rich-text-editor/_highcontrast-light-definition.scss +0 -257
  63. package/styles/rich-text-editor/_layout.scss +0 -2072
  64. package/styles/rich-text-editor/_material-dark-definition.scss +0 -262
  65. package/styles/rich-text-editor/_material-definition.scss +0 -260
  66. package/styles/rich-text-editor/_material3-dark-definition.scss +0 -1
  67. package/styles/rich-text-editor/_material3-definition.scss +0 -262
  68. package/styles/rich-text-editor/_tailwind-dark-definition.scss +0 -1
  69. package/styles/rich-text-editor/_tailwind-definition.scss +0 -257
  70. package/styles/rich-text-editor/_theme.scss +0 -837
  71. package/styles/rich-text-editor/icons/_bootstrap-dark.scss +0 -349
  72. package/styles/rich-text-editor/icons/_bootstrap.scss +0 -349
  73. package/styles/rich-text-editor/icons/_bootstrap4.scss +0 -349
  74. package/styles/rich-text-editor/icons/_bootstrap5-dark.scss +0 -1
  75. package/styles/rich-text-editor/icons/_bootstrap5.scss +0 -348
  76. package/styles/rich-text-editor/icons/_fabric-dark.scss +0 -349
  77. package/styles/rich-text-editor/icons/_fabric.scss +0 -349
  78. package/styles/rich-text-editor/icons/_fluent-dark.scss +0 -1
  79. package/styles/rich-text-editor/icons/_fluent.scss +0 -348
  80. package/styles/rich-text-editor/icons/_fusionnew.scss +0 -348
  81. package/styles/rich-text-editor/icons/_highcontrast-light.scss +0 -349
  82. package/styles/rich-text-editor/icons/_highcontrast.scss +0 -349
  83. package/styles/rich-text-editor/icons/_material-dark.scss +0 -349
  84. package/styles/rich-text-editor/icons/_material.scss +0 -349
  85. package/styles/rich-text-editor/icons/_material3-dark.scss +0 -1
  86. package/styles/rich-text-editor/icons/_material3.scss +0 -348
  87. package/styles/rich-text-editor/icons/_tailwind-dark.scss +0 -1
  88. package/styles/rich-text-editor/icons/_tailwind.scss +0 -348
  89. package/syncfusion-ej2-angular-richtexteditor.d.ts +0 -5
@@ -1,837 +0,0 @@
1
- @include export-module('richtexteditor-theme') {
2
-
3
- /*! tab layout */
4
-
5
- .e-richtexteditor {
6
-
7
- .e-rte-toolbar {
8
- border: 1px solid $rte-border-color;
9
- border-bottom: 0;
10
-
11
- .e-toolbar-item {
12
-
13
- @if $skin-name != 'highcontrast' {
14
- &.e-overlay .e-tbar-btn .e-icons {
15
- color: $rte-ext-tbar-overlay-icons-color;
16
- }
17
- }
18
-
19
- @if $skin-name == 'bootstrap5' {
20
- .e-tbar-btn:focus .e-icons {
21
- color: $rte-quick-item-active-font-color;
22
- }
23
- }
24
-
25
- &.e-active .e-tbar-btn,
26
- &.e-active .e-tbar-btn:focus {
27
- background: $rte-tb-item-active-bg;
28
- border: $rte-tb-item-active-border;
29
-
30
- @if $skin-name == 'bootstrap5' {
31
- border: 0;
32
- }
33
- }
34
-
35
- &.e-active .e-tbar-btn .e-icons,
36
- &.e-active .e-tbar-btn:focus .e-icons {
37
- color: $rte-tb-active-font-color;
38
- }
39
-
40
- .e-icons {
41
- color: $rte-icons-color;
42
- }
43
-
44
- @if $skin-name == 'bootstrap5' {
45
- .e-tbar-btn:hover .e-icons {
46
- color: $rte-tb-hover-font-color;
47
- }
48
-
49
- .e-tbar-btn:focus .e-icons {
50
- color: $primary-text-focus;
51
- }
52
- }
53
-
54
- .e-dropdown-btn.e-active {
55
- background: $rte-drop-btn-active-bg;
56
- border-color: $rte-drop-btn-active-border-color;
57
-
58
- .e-icons,
59
- .e-rte-dropdown-btn-text {
60
- color: $rte-drop-btn-active-color;
61
- }
62
- }
63
-
64
- @if $skin-name == 'bootstrap5' {
65
- .e-tbar-btn:hover .e-rte-dropdown-btn-text {
66
- color: $rte-tb-hover-font-color;
67
- }
68
- }
69
-
70
- & .e-rte-backgroundcolor-dropdown,
71
- & .e-rte-fontcolor-dropdown,
72
- & .e-rte-numberformatlist-dropdown,
73
- & .e-rte-bulletformatlist-dropdown {
74
-
75
- &:hover .e-rte-color-content::after {
76
- background: $rte-split-btn-bar-bg;
77
- }
78
-
79
- &:active:hover {
80
-
81
- .e-icons {
82
- color: $rte-split-btn-color;
83
- }
84
-
85
- @if $skin-name == 'bootstrap5' or $skin-name == 'tailwind' {
86
- .e-icons {
87
- color: $rte-tb-hover-font-color;
88
- }
89
- }
90
-
91
- .e-caret:active.e-icons,
92
- .e-rte-color-content:active .e-icons,
93
- .e-rte-list-primary-content:active .e-icons {
94
- color: $rte-split-btn-active-color;
95
- }
96
- }
97
-
98
- &:hover {
99
- background: $rte-split-btn-hover-bg;
100
-
101
- .e-rte-color-content,
102
- .e-rte-list-primary-content {
103
-
104
- &:hover {
105
- background: $rte-split-btn-span-hover-bg;
106
- }
107
-
108
- &:focus {
109
- background: $rte-split-btn-span-focus-bg;
110
- }
111
-
112
- &:active {
113
- background: $rte-split-btn-span-active-bg;
114
- }
115
- }
116
-
117
- .e-caret {
118
-
119
- &:hover {
120
- background: $rte-split-btn-span-hover-bg;
121
- }
122
-
123
- &:focus {
124
- background: $rte-split-btn-span-focus-bg;
125
- }
126
-
127
- &:active {
128
- background: $rte-split-btn-span-active-bg;
129
- }
130
- }
131
- }
132
-
133
- &.e-active {
134
- background: $rte-split-btn-active-bg;
135
- border: $rte-split-btn-active-border;
136
-
137
- .e-rte-color-content::after {
138
- background: $rte-split-btn-active-bar-bg;
139
- }
140
-
141
- &:hover .e-caret:hover,
142
- &:hover .e-rte-color-content:hover,
143
- &:hover .e-rte-list-primary-content:hover {
144
- background: transparent;
145
- }
146
-
147
- .e-icons,
148
- &:active .e-icons {
149
- color: $rte-split-btn-active-color;
150
- }
151
- }
152
- }
153
- }
154
-
155
- .e-toolbar-extended {
156
-
157
- .e-toolbar-item .e-tbar-btn .e-icons {
158
- color: $rte-icons-color;
159
- }
160
- .e-toolbar-item .e-tbar-btn:hover .e-icons {
161
- color: $rte-hover-icons-color;
162
- }
163
- .e-toolbar-item .e-tbar-btn:focus .e-icons {
164
- color: $rte-hover-icons-color;
165
- }
166
- .e-toolbar-item.e-active .e-tbar-btn .e-icons {
167
- color: $rte-tb-active-font-color;
168
- }
169
-
170
- @if $skin-name != 'highcontrast' {
171
- .e-toolbar-item.e-overlay .e-tbar-btn .e-icons {
172
- color: $rte-ext-tbar-overlay-icons-color;
173
- }
174
- }
175
-
176
- .e-toolbar-item .e-dropdown-btn.e-active {
177
- background: $rte-drop-btn-active-bg;
178
- }
179
-
180
- @if $skin-name == 'bootstrap5' {
181
- .e-toolbar-item .e-tbar-btn:focus,
182
- .e-toolbar-item .e-tbar-btn:hover {
183
- border-radius: 4px;
184
- }
185
- }
186
- }
187
-
188
- &.e-rte-tb-float {
189
- border: 1px solid $rte-border-color;
190
- }
191
-
192
- &.e-tb-static {
193
- border-bottom: 1px solid $rte-border-color;
194
- }
195
- }
196
- .e-rte-tb-expand .e-rte-content:not(e-toolbar-wrapper) {
197
- border-top: 0 solid $rte-border-color;
198
- }
199
-
200
- .e-toolbar-wrapper .e-rte-toolbar:not(.e-rte-tb-float) {
201
- border-bottom: 1px solid $rte-border-color;
202
- }
203
- .e-toolbar-wrapper + .e-rte-toolbar:not(.e-rte-tb-float) {
204
- border: 0;
205
- }
206
-
207
- .e-toolbar-wrapper {
208
- background: $rte-tbar-default-bg;
209
- }
210
-
211
- img.e-img-focus::selection,
212
- audio.e-audio-focus::selection,
213
- .e-video-focus::selection {
214
- background: transparent;
215
- color: transparent;
216
- }
217
- @if $skin-name == 'Material3' {
218
- ::selection {
219
- color: $rte-selection-color;
220
- background: $rte-selection-bg;
221
- }
222
- }
223
- .e-rte-content,
224
- .e-source-content {
225
- background: $rte-content-bg;
226
- border: 1px solid $rte-border-color;
227
- color: $rte-content-color;
228
-
229
- .e-content blockquote {
230
- border-left: $rte-content-blockquote-border-left-color;
231
- }
232
-
233
- .e-content .e-img-focus:not(.e-resize),
234
- .e-content .e-video-focus:not(.e-resize) {
235
- border: $rte-img-border;
236
- }
237
-
238
- .e-content a {
239
- color: $rte-anchor-color;
240
- }
241
- }
242
-
243
- &.e-rtl {
244
- .e-rte-content .e-content blockquote {
245
- border-left: 0;
246
- border-right: $rte-content-blockquote-border-left-color;
247
- }
248
- }
249
-
250
- &.e-rte-resize {
251
- background: $rte-content-bg;
252
- }
253
-
254
- .e-input.e-rte-linkurl.e-error,
255
- .e-input.e-img-link.e-error {
256
- color: $rte-link-valid-color;
257
- }
258
-
259
- &.e-rte-full-screen {
260
- background: $rte-full-screen-bg;
261
- }
262
-
263
- &.e-rte-inline {
264
-
265
- .e-rte-content {
266
- border: 0;
267
- }
268
- }
269
-
270
- &:not(.e-rte-toolbar-enabled) {
271
- border: 1px solid $rte-border-color;
272
-
273
- .e-rte-content {
274
- border: 0;
275
- border-bottom: 0;
276
- border-top: 0;
277
- }
278
- }
279
-
280
- &.e-rte-tb-expand {
281
- border: 1px solid $rte-border-color;
282
-
283
- .e-rte-toolbar {
284
- border: 0;
285
-
286
- &.e-extended-toolbar,
287
- .e-toolbar-extended {
288
- border-bottom-left-radius: 0;
289
- border-bottom-right-radius: 0;
290
- border-top-left-radius: 0;
291
- border-top-right-radius: 0;
292
- }
293
-
294
- .e-toolbar-extended {
295
- border: 0;
296
- border-bottom: 0;
297
-
298
- &.e-popup-open {
299
- border-bottom: 1px solid $rte-border-color;
300
- }
301
- }
302
-
303
- &.e-expand-open + .e-rte-content {
304
- border-top: 0;
305
- }
306
-
307
- &.e-rte-tb-float {
308
- border-bottom: 1px solid $rte-border-color;
309
- border-right: 0 solid $rte-border-color;
310
- border-top: 1px solid $rte-border-color;
311
-
312
- &.e-expand-open {
313
- border-bottom: $rte-expand-tb-border-bottom;
314
-
315
- .e-toolbar-extended {
316
- border-bottom: 1px solid $rte-border-color;
317
- border-right: 0 solid $rte-border-color;
318
- }
319
- }
320
- }
321
- }
322
-
323
- .e-rte-content,
324
- .e-source-content {
325
- border: 0;
326
- border-bottom: 1px solid $rte-border-color;
327
- border-top: 1px solid $rte-border-color;
328
- }
329
-
330
- .e-toolbar-wrapper + .e-rte-content{
331
- border-top: 0 solid $rte-border-color;
332
- }
333
-
334
- .e-toolbar-extended.e-popup-open {
335
- border-bottom: 1px solid $rte-border-color;
336
- }
337
-
338
- &.e-rte-resize {
339
- .e-rte-content,
340
- .e-source-content {
341
- border-bottom: 0;
342
- }
343
- }
344
- }
345
-
346
- .e-audio-wrap,
347
- .e-embed-video-wrap {
348
- display: inline-block;
349
- }
350
-
351
- .e-clickelem,
352
- .e-video-clickelem {
353
- display: block;
354
- margin: 0;
355
- outline: none;
356
- padding: 0;
357
- position: relative;
358
- }
359
-
360
- .e-clickelem::after,
361
- .e-video-clickelem::after {
362
- background: transparent;
363
- bottom: 0;
364
- content: '';
365
- cursor: default;
366
- display: block;
367
- left: 0;
368
- position: absolute;
369
- right: 0;
370
- top: 0;
371
- z-index: 1;
372
- }
373
-
374
- .e-videoheader,
375
- .e-embed-videoheader,
376
- .e-video-url-wrap {
377
- padding-bottom: 5px;
378
- padding-top: 15px;
379
- }
380
-
381
- .e-video-url-wrap .e-radio-wrapper {
382
- padding: 5px;
383
- }
384
-
385
- .e-video-url-wrap textarea {
386
- height: 80px;
387
- }
388
- }
389
-
390
- .e-rte-quick-popup {
391
- border: $rte-quick-pop-border;
392
- border-radius: 2px;
393
- box-shadow: $rte-quick-pop-shadow;
394
-
395
- .e-rte-quick-toolbar {
396
- background: $rte-quick-pop-bg;
397
- border: $rte-quick-tb-border;
398
-
399
- .e-toolbar-items {
400
- background: $rte-quick-pop-bg;
401
-
402
- .e-separator {
403
- border: .5px solid $rte-quick-vr-line-color;
404
- }
405
-
406
- .e-tbar-btn {
407
- background: $rte-quick-pop-bg;
408
- border: $rte-quick-item-border;
409
- }
410
-
411
- .e-tbar-btn:hover {
412
- background: $rte-quick-tb-btn-hover;
413
- border-color: $rte-quick-item-hover-border-color;
414
- }
415
-
416
- .e-tbar-btn:focus {
417
- background: $rte-quick-pop-item-focus-bg;
418
- }
419
-
420
- .e-tbar-btn:active {
421
- background: $rte-quick-item-active-bg;
422
- border-color: $rte-quick-item-active-border-color;
423
-
424
- .e-icons {
425
- color: $rte-quick-item-active-font-color;
426
- }
427
- }
428
-
429
- .e-toolbar-item.e-active .e-tbar-btn,
430
- .e-toolbar-item.e-active .e-tbar-btn:focus {
431
- background: $rte-tb-item-active-bg;
432
- border: $rte-tb-item-active-border;
433
- }
434
-
435
- .e-toolbar-item.e-active .e-tbar-btn .e-icons,
436
- .e-toolbar-item.e-active .e-tbar-btn:focus .e-icons {
437
- color: $rte-tb-active-font-color;
438
- }
439
-
440
- .e-icons {
441
- color: $rte-icons-color;
442
- }
443
-
444
- @if $skin-name == 'bootstrap5' {
445
- .e-tbar-btn:hover .e-icons {
446
- color: $rte-tb-hover-font-color;
447
- }
448
-
449
- .e-tbar-btn:focus .e-icons {
450
- color: $primary-text-focus;
451
- }
452
- }
453
- }
454
-
455
- .e-toolbar-extended {
456
-
457
- .e-toolbar-item .e-tbar-btn .e-icons {
458
- color: $rte-icons-color;
459
- }
460
- }
461
- }
462
-
463
- .e-rte-dropdown-btn {
464
- background: $rte-quick-pop-bg;
465
- border-color: $rte-quick-drop-btn-border-color;
466
-
467
- &:focus,
468
- &:hover {
469
- background: $rte-quick-tb-btn-hover;
470
- }
471
-
472
- &:hover {
473
- border-color: $rte-quick-drop-btn-hover-border-color;
474
-
475
- @if $skin-name == 'highcontrast' {
476
- border-width: $rte-2px-border-size;
477
- }
478
- }
479
- }
480
- }
481
-
482
- .e-dialog .e-img-uploadwrap .e-droptext,
483
- .e-dialog .e-aud-uploadwrap .e-droptext,
484
- .e-dialog .e-vid-uploadwrap .e-droptext,
485
- .e-dialog.e-device .e-vid-uploadwrap .e-droptext {
486
- border: dashed 2px $rte-upload-drag-border-clr;
487
- border-radius: 4px;
488
- color: $rte-drop-text-clr;
489
- display: block;
490
- font-family: $rte-font-family;
491
- font-size: 14px;
492
- height: $rte-drop-text-height;
493
- margin: 0 auto;
494
- text-align: center;
495
- width: auto;
496
- }
497
-
498
- .e-dialog .e-vid-uploadwrap .e-droptext {
499
- height: 108px;
500
- }
501
-
502
- .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
503
- .e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap .e-droptext,
504
- .e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap .e-droptext {
505
- margin: 0 auto;
506
- width: $rte-drop-text-mobile-width;
507
- }
508
- .e-dialog.e-device .e-video-url-wrap .e-radio-wrapper {
509
- padding: 8px 4px;
510
- }
511
- .e-linkheader {
512
- color: $rte-img-header-clr;
513
- }
514
-
515
- .e-rte-img-popup.e-popup {
516
- background: $rte-full-screen-bg;
517
- border: $rte-img-popup-border;
518
- box-shadow: $rte-img-popup-box-shadow;
519
- color: $rte-img-popup-color;
520
- padding: 10px;
521
- }
522
-
523
- .e-rte-content .e-content img:not(.e-resize) {
524
- z-index: 1000;
525
- }
526
-
527
- span.e-rte-imageboxmark,
528
- span.e-rte-videoboxmark {
529
- background: $rte-img-resize-back-color;
530
- border: 1px solid $rte-img-resize-color;
531
- display: block;
532
- height: 10px;
533
- position: absolute;
534
- width: 10px;
535
- z-index: 1000;
536
- }
537
-
538
- .e-mob-rte span.e-rte-imageboxmark,
539
- .e-mob-rte span.e-rte-videoboxmark {
540
- background: $rte-img-resize-color;
541
- border: 1px solid $rte-img-resize-back-color;
542
- border-radius: 15px;
543
- height: 20px;
544
- width: 20px;
545
- }
546
-
547
- .e-mob-rte.e-mob-span span.e-rte-imageboxmark,
548
- .e-mob-rte.e-mob-span span.e-rte-videoboxmark {
549
- background: $rte-img-resize-back-color;
550
- border: 1px solid $rte-img-resize-color;
551
- }
552
-
553
- .e-rte-content .e-content img.e-resize,
554
- .e-rte-content .e-content video.e-resize {
555
- z-index: 1000;
556
- }
557
-
558
- #{if(&, '&', '*')}.e-disabled {
559
- user-select: none;
560
- .e-rte-toolbar .e-toolbar-item {
561
- cursor: default;
562
- & .e-tbar-btn.e-icon-btn,
563
- & .e-dropdown-btn.e-btn,
564
- & .e-colorpicker-wrapper .e-btn {
565
- &:hover,
566
- &:active,
567
- &:focus {
568
- background: transparent;
569
- cursor: default;
570
- }
571
- }
572
- }
573
- }
574
-
575
- .e-dropdown-popup {
576
- & ul {
577
- & .e-item.e-active {
578
- background-color: $rte-dropdown-selection-bgcolor;
579
- color: $rte-dropdown-selection-color;
580
- }
581
- }
582
- }
583
-
584
- .e-popup-overlay {
585
- background-color: $rte-overlay-color;
586
- }
587
-
588
- .e-rte-toolbar.e-extended-toolbar .e-toolbar-item.e-overlay .e-dropdown-btn {
589
- color: $rte-ext-tbar-overlay-dropdown-color;
590
- }
591
-
592
- .e-rte-table-popup.e-popup.e-popup-open {
593
- background-color: $rte-content-bg;
594
- color: $rte-item-color;
595
- }
596
-
597
- .e-richtexteditor .e-rte-toolbar .e-hor-nav:hover{
598
- border: solid rgba(0, 0, 0, .12);
599
- border-width: $rte-toolbar-hor-nav-border-width;
600
- padding-left: $rte-tb-expended-hover-padding-left;
601
- }
602
-
603
- @if $skin-name == 'bootstrap5' {
604
- .e-rte-table-popup.e-popup.e-popup-open {
605
- background-color: $rte-table-popup-bg;
606
- }
607
- }
608
-
609
- .e-rte-table-popup .e-span-border {
610
- @if $skin-name != 'Material3' {
611
- border: 1px solid $rte-border-color;
612
- }
613
- display: block;
614
- margin-bottom: 8px;
615
- margin-top: 12px;
616
- }
617
-
618
- .e-rte-table-popup .e-rte-popup-header {
619
- color: $rte-table-header-color;
620
- font-family: $rte-font-family;
621
- font-size: 14px;
622
- text-align: center;
623
- }
624
-
625
- .e-rte-table-popup.e-popup-open .e-rte-tablecell.e-default {
626
- background-color: $rte-table-span-bg-color;
627
- }
628
-
629
- .e-rte-table-popup.e-popup-open .e-rte-tablecell.e-active {
630
- background-color: $rte-table-span-active-bg-color;
631
- border: 1px solid $rte-table-span-active-border-color;
632
- }
633
-
634
- .e-rte-table.e-alternate-border tbody tr:nth-child(2n+0) {
635
- background-color: $rte-table-alternate-color;
636
- @if $skin-name == 'highcontrast' {
637
- color: $rte-img-popup-color;
638
- }
639
- }
640
-
641
- .e-rte-table th {
642
- background: $rte-table-header-bg;
643
- }
644
-
645
- .e-rte-table-popup.e-popup.e-popup-open {
646
- background-color: $rte-table-popup-bg;
647
- color: $rte-table-popup-color;
648
- }
649
-
650
- span.e-table-box {
651
- background-color: $rte-table-resize-back-color;
652
- border: 1px solid $rte-table-border-color;
653
- }
654
-
655
- span.e-table-box.e-rbox-select {
656
- background-color: $rte-table-border-color;
657
- border: 1px solid $rte-table-border-color;
658
- }
659
-
660
- .e-table-rhelper {
661
- background-color: $rte-table-span-active-border-color;
662
- }
663
-
664
- .e-rte-dialog-upload.e-upload.e-lib.e-keyboard {
665
- background: $rte-content-bg;
666
- }
667
-
668
- .e-rte-inline-popup .e-rte-quick-toolbar.e-rte-toolbar .e-toolbar-items .e-toolbar-item {
669
- &.e-active .e-tbar-btn .e-icons,
670
- & .e-tbar-btn:active .e-icons,
671
- & .e-tbar-btn:focus .e-icons,
672
- & .e-tbar-btn:hover .e-icons {
673
- color: $rte-quick-item-active-font-color;
674
- }
675
- }
676
- .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-active .e-icons {
677
- color: $rte-tlbar-expand-active;
678
- }
679
-
680
- .e-rte-emojipicker-popup.e-popup.e-popup-open {
681
- background: $rte-emoji-pop-background;
682
- box-shadow: $rte-emoji-pop-box-shadow;
683
- border: $rte-emoji-pop-border;
684
-
685
- @if $skin-name =='bootstrap5' or $skin-name =='botstrap5-dark' or $skin-name =='bootstrap' or $skin-name =='bootstrap-dark' or $skin-name =='bootstrap4' {
686
- filter: drop-shadow(0 0 6px rgba(0, 0, 0, .25));
687
- }
688
-
689
- @if $skin-name =='bootstrap5' or $skin-name =='botstrap5-dark' or $skin-name =='bootstrap4' {
690
- .e-toolbar .e-toolbar-item .e-tbar-btn.e-selected .e-icons {
691
- color: $rte-emoji-tbar-btn-selected-font-color;
692
- }
693
- }
694
-
695
- .e-toolbar .e-toolbar-item .e-tbar-btn {
696
- background: $rte-emoji-tbar-btn-bg;
697
-
698
- @if $skin-name =='bootstrap5' {
699
- &:focus{
700
- background: $rte-tbar-default-bg;
701
- }
702
- }
703
- &.e-selected {
704
- background: $rte-emoji-tbar-btn-select-bg;
705
- }
706
- }
707
-
708
- .e-toolbar .e-toolbar-item .e-tbar-btn:hover {
709
- background: $rte-emoji-tbar-btn-hover;
710
- }
711
-
712
- .e-rte-emojipicker-toolbar {
713
- background: transparent;
714
- border: none;
715
- box-shadow: none;
716
-
717
- & .e-toolbar-items {
718
- background: transparent;
719
-
720
- & .e-scroll-nav {
721
- border: none;
722
- }
723
- }
724
- }
725
-
726
- .e-rte-emojipicker-btn {
727
- .e-rte-emojipicker-group .e-rte-emojipickerbtn-group {
728
- .e-btn.e-control {
729
- @if $skin-name =='bootstrap4' {
730
- color: inherit;
731
- }
732
-
733
- &:not(:hover):not(:focus):not(:active) {
734
- background: transparent;
735
- }
736
- }
737
- }
738
-
739
- .e-rte-emojisearch-btn {
740
- .e-btn.e-control {
741
- @if $skin-name =='bootstrap4' {
742
- color: inherit;
743
- }
744
-
745
- &:not(:hover):not(:focus):not(:active) {
746
- background: transparent;
747
- }
748
- }
749
- }
750
- .e-rte-emojipicker-group .e-rte-emojipicker-name {
751
- color: $rte-emoji-headname-color;
752
- }
753
- }
754
- }
755
- @if $skin-name == 'tailwind' {
756
- .e-richtexteditor .e-rte-toolbar .e-toolbar-extended {
757
- background: $rte-extended-toolbar-background;
758
- }
759
-
760
- .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn .e-icons {
761
- color: $rte-icons-color;
762
- }
763
-
764
- .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover {
765
- border-radius: 4px;
766
- }
767
-
768
- .e-richtexteditor .e-toolbar .e-tbar-btn {
769
- border-bottom: 1px solid $transparent;
770
- border-top: 1px solid $transparent;
771
- }
772
-
773
- .e-richtexteditor .e-toolbar .e-tbar-btn:hover {
774
- background: $rte-tb-hover-bg-color;
775
- border: 1px solid $rte-quick-item-hover-border-color;
776
- }
777
-
778
- .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:hover {
779
- background: $rte-tb-hover-bg-color;
780
- border: 1px solid $rte-quick-item-hover-border-color;
781
- }
782
- }
783
-
784
- @if $skin-name == 'bootstrap5' {
785
- .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn:active {
786
- background: $rte-tb-item-active-bg;
787
- border-radius: 4px;
788
- }
789
-
790
- .e-richtexteditor .e-toolbar .e-insert-table-btn.e-btn:hover .e-icons {
791
- color: $rte-tb-hover-font-color;
792
- }
793
- }
794
-
795
- @if $skin-name == 'Material3' {
796
- .e-bigger .e-richtexteditor.e-rte-tb-expand {
797
- border-radius: 8px;
798
- }
799
- .e-bigger .e-richtexteditor .e-toolbar-wrapper {
800
- border-top-left-radius: $rte-border-top-left-radius;
801
- border-top-right-radius: $rte-border-top-right-radius;
802
- }
803
- .e-bigger .e-richtexteditor.e-rte-tb-expand .e-rte-toolbar.e-extended-toolbar,
804
- .e-bigger .e-richtexteditor.e-rte-tb-expand .e-rte-toolbar .e-toolbar-extended {
805
- border-top-left-radius: $rte-border-top-left-radius;
806
- border-top-right-radius: $rte-border-top-right-radius;
807
- }
808
- .e-bigger .e-rte-toolbar .e-toolbar-items {
809
- border-top-left-radius: $rte-border-top-left-radius;
810
- }
811
- .e-bigger .e-rte-toolbar .e-hor-nav {
812
- border-top-right-radius: $rte-border-top-right-radius;
813
- }
814
- .e-bigger .e-rtl .e-rte-toolbar .e-hor-nav {
815
- border-top-left-radius: $rte-border-top-left-radius;
816
- border-top-right-radius: 0;
817
- }
818
- .e-bigger .e-rtl .e-rte-toolbar .e-toolbar-items {
819
- border-top-right-radius: $rte-border-top-right-radius;
820
- }
821
- }
822
- // Blazor styles start
823
- .e-richtexteditor.e-rte-tb-expand .e-rte-content-border {
824
- border-bottom: 0;
825
- }
826
-
827
- @if $skin-name == 'bootstrap5' or $skin-name == 'tailwind' {
828
- .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn:active .e-icons,
829
- .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn:active .e-rte-dropdown-btn-text,
830
- .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn:focus .e-rte-dropdown-btn-text,
831
- .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-items .e-icon-button:focus .e-icons {
832
- color: $rte-quick-item-active-font-color;
833
- }
834
- }
835
-
836
- // Blazor styles end
837
- }