@wangeditor-kai/editor 5.6.38-beta.0 → 5.6.39

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.
@@ -1,787 +1,8 @@
1
- :root,
2
- :host {
3
- --w-e-textarea-bg-color: #fff;
4
- --w-e-textarea-color: #333;
5
- --w-e-textarea-border-color: #ccc;
6
- --w-e-textarea-slight-border-color: #e8e8e8;
7
- --w-e-textarea-slight-color: #d4d4d4;
8
- --w-e-textarea-slight-bg-color: #f5f2f0;
9
- --w-e-textarea-selected-border-color: #B4D5FF;
10
- --w-e-textarea-handler-bg-color: #4290f7;
11
- --w-e-toolbar-color: #595959;
12
- --w-e-toolbar-bg-color: #fff;
13
- --w-e-toolbar-active-color: #333;
14
- --w-e-toolbar-active-bg-color: #f1f1f1;
15
- --w-e-toolbar-disabled-color: #999;
16
- --w-e-toolbar-border-color: #e8e8e8;
17
- --w-e-modal-button-bg-color: #fafafa;
18
- --w-e-modal-button-border-color: #d9d9d9;
19
- }
1
+ :host,:root{--w-e-textarea-bg-color:#fff;--w-e-textarea-color:#333;--w-e-textarea-border-color:#ccc;--w-e-textarea-slight-border-color:#e8e8e8;--w-e-textarea-slight-color:#d4d4d4;--w-e-textarea-slight-bg-color:#f5f2f0;--w-e-textarea-selected-border-color:#b4d5ff;--w-e-textarea-handler-bg-color:#4290f7;--w-e-toolbar-color:#595959;--w-e-toolbar-bg-color:#fff;--w-e-toolbar-active-color:#333;--w-e-toolbar-active-bg-color:#f1f1f1;--w-e-toolbar-disabled-color:#999;--w-e-toolbar-border-color:#e8e8e8;--w-e-modal-button-bg-color:#fafafa;--w-e-modal-button-border-color:#d9d9d9}
2
+ .w-e-text-container *,.w-e-toolbar *{box-sizing:border-box;margin:0;outline:none;padding:0}.w-e-text-container blockquote,.w-e-text-container li,.w-e-text-container p,.w-e-text-container td,.w-e-text-container th,.w-e-toolbar *{line-height:1.5}.w-e-text-container{background-color:var(--w-e-textarea-bg-color);color:var(--w-e-textarea-color);height:100%;position:relative}.no-scroll{width:100%}.w-e-text-container .w-e-scroll{height:100%;-webkit-overflow-scrolling:touch}.w-e-text-container [data-slate-editor]{outline:0;white-space:pre-wrap;word-wrap:break-word;border-top:1px solid transparent;min-height:100%;padding:0 10px}.w-e-text-container [data-slate-editor] p{margin:15px 0}.w-e-text-container [data-slate-editor] h1,.w-e-text-container [data-slate-editor] h2,.w-e-text-container [data-slate-editor] h3,.w-e-text-container [data-slate-editor] h4,.w-e-text-container [data-slate-editor] h5{margin:20px 0}.w-e-text-container [data-slate-editor] img{cursor:default;display:inline!important;max-width:100%;min-height:20px;min-width:20px}.w-e-text-container [data-slate-editor] span{text-indent:0}.w-e-text-container [data-slate-editor] [data-selected=true]{box-shadow:0 0 0 2px var(--w-e-textarea-selected-border-color)}.w-e-text-placeholder{font-style:italic;left:10px;top:17px;width:90%}.w-e-max-length-info,.w-e-text-placeholder{color:var(--w-e-textarea-slight-color);pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none}.w-e-max-length-info{bottom:.5em;right:1em}.w-e-bar{background-color:var(--w-e-toolbar-bg-color);color:var(--w-e-toolbar-color);font-size:14px;padding:0 5px}.w-e-bar svg{height:14px;width:14px;fill:var(--w-e-toolbar-color)}.w-e-bar-show{display:flex}.w-e-bar-hidden{display:none}.w-e-hover-bar{border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 5px #0000001f;position:absolute}.w-e-toolbar{flex-wrap:wrap;position:relative}.w-e-bar-divider{background-color:var(--w-e-toolbar-border-color);display:inline-flex;height:40px;margin:0 5px;width:1px}.w-e-bar-item{display:flex;height:40px;padding:4px;position:relative;text-align:center}.w-e-bar-item,.w-e-bar-item button{align-items:center;justify-content:center}.w-e-bar-item button{background:transparent;border:none;color:var(--w-e-toolbar-color);cursor:pointer;display:inline-flex;height:32px;overflow:hidden;padding:0 8px;white-space:nowrap}.w-e-bar-item button:hover{background-color:var(--w-e-toolbar-active-bg-color);color:var(--w-e-toolbar-active-color)}.w-e-bar-item button .title{margin-left:5px}.w-e-bar-item .active{background-color:var(--w-e-toolbar-active-bg-color);color:var(--w-e-toolbar-active-color)}.w-e-bar-item .disabled{color:var(--w-e-toolbar-disabled-color);cursor:not-allowed}.w-e-bar-item .disabled svg{fill:var(--w-e-toolbar-disabled-color)}.w-e-bar-item .disabled:hover{background-color:var(--w-e-toolbar-bg-color);color:var(--w-e-toolbar-disabled-color)}.w-e-bar-item .disabled:hover svg{fill:var(--w-e-toolbar-disabled-color)}.w-e-menu-tooltip-v5:before{background-color:var(--w-e-toolbar-active-color);border-radius:5px;color:var(--w-e-toolbar-bg-color);content:attr(data-tooltip);font-size:.75em;padding:5px 10px;text-align:center;top:40px;white-space:pre;z-index:1}.w-e-menu-tooltip-v5:after,.w-e-menu-tooltip-v5:before{opacity:0;position:absolute;transition:opacity .6s;visibility:hidden}.w-e-menu-tooltip-v5:after{border-color:transparent transparent var(--w-e-toolbar-active-color) transparent;border-style:solid;border-width:5px;content:"";top:30px}.w-e-menu-tooltip-v5:hover:after,.w-e-menu-tooltip-v5:hover:before{opacity:1;visibility:visible}.w-e-menu-tooltip-v5.tooltip-right:before{left:100%;top:10px}.w-e-menu-tooltip-v5.tooltip-right:after{border-color:transparent var(--w-e-toolbar-active-color) transparent transparent;left:100%;margin-left:-10px;top:16px}.w-e-bar-item-group .w-e-bar-item-menus-container{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;display:none;left:0;margin-top:40px;position:absolute;top:0;z-index:1}.w-e-bar-item-group:hover .w-e-bar-item-menus-container{display:block}.w-e-select-list{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;left:0;margin-top:40px;max-height:350px;min-width:100px;overflow-y:auto;position:absolute;top:0;z-index:1}.w-e-select-list ul{line-height:1;list-style:none}.w-e-select-list ul .selected{background-color:var(--w-e-toolbar-active-bg-color)}.w-e-select-list ul li{cursor:pointer;padding:7px 0 7px 25px;position:relative;text-align:left;white-space:nowrap}.w-e-select-list ul li:hover{background-color:var(--w-e-toolbar-active-bg-color)}.w-e-select-list ul li svg{left:0;margin-left:5px;margin-top:-7px;position:absolute;top:50%}.w-e-bar-bottom .w-e-select-list{bottom:0;margin-bottom:40px;margin-top:0;top:inherit}.w-e-drop-panel{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;margin-top:40px;min-width:200px;padding:10px;position:absolute;top:0;z-index:1}.w-e-bar-bottom .w-e-drop-panel{bottom:0;margin-bottom:40px;margin-top:0;top:inherit}.w-e-modal{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;color:var(--w-e-toolbar-color);font-size:14px;min-height:40px;min-width:100px;padding:20px 15px 0;position:absolute;text-align:left;z-index:1}.w-e-modal .btn-close{cursor:pointer;line-height:1;padding:5px;position:absolute;right:8px;top:7px}.w-e-modal .btn-close svg{height:10px;width:10px;fill:var(--w-e-toolbar-color)}.w-e-modal .babel-container{display:block;margin-bottom:15px}.w-e-modal .babel-container span{display:block;margin-bottom:10px}.w-e-modal .button-container{margin-bottom:15px}.w-e-modal button{background-color:var(--w-e-modal-button-bg-color);cursor:pointer;font-weight:400;height:32px;padding:4.5px 15px;text-align:center;touch-action:manipulation;transition:all .3s cubic-bezier(.645,.045,.355,1);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.w-e-modal button,.w-e-modal input[type=number],.w-e-modal input[type=text],.w-e-modal textarea{border:1px solid var(--w-e-modal-button-border-color);border-radius:4px;color:var(--w-e-toolbar-color)}.w-e-modal input[type=number],.w-e-modal input[type=text],.w-e-modal textarea{background-color:var(--w-e-toolbar-bg-color);font-feature-settings:"tnum";font-variant:tabular-nums;padding:4.5px 11px;transition:all .3s;width:100%}.w-e-modal textarea{min-height:60px}body .w-e-modal,body .w-e-modal *{box-sizing:border-box}.w-e-progress-bar{background-color:var(--w-e-textarea-handler-bg-color);height:1px;position:absolute;transition:width .3s;width:0}.w-e-full-screen-container{bottom:0!important;display:flex!important;flex-direction:column!important;height:100%!important;left:0!important;margin:0!important;padding:0!important;position:fixed;right:0!important;top:0!important;width:100%!important}.w-e-full-screen-container [data-w-e-textarea=true]{flex:1!important}
3
+ .w-e-text-container [data-slate-editor] code{background-color:var(--w-e-textarea-slight-bg-color);border-radius:3px;font-family:monospace;padding:3px}.w-e-panel-content-color{list-style:none;text-align:left;width:230px}.w-e-panel-content-color li{border:1px solid var(--w-e-toolbar-bg-color);border-radius:3px 3px;cursor:pointer;display:inline-block;padding:2px}.w-e-panel-content-color li:hover{border-color:var(--w-e-toolbar-color)}.w-e-panel-content-color li .color-block{border:1px solid var(--w-e-toolbar-border-color);border-radius:3px 3px;height:17px;width:17px}.w-e-panel-content-color .active{border-color:var(--w-e-toolbar-color)}.w-e-panel-content-color .clear{line-height:1.5;margin-bottom:5px;width:100%}.w-e-panel-content-color .clear svg{height:16px;margin-bottom:-4px;width:16px}.w-e-text-container [data-slate-editor] blockquote{background-color:var(--w-e-textarea-slight-bg-color);border-left:8px solid var(--w-e-textarea-selected-border-color);display:block;font-size:100%;line-height:1.5;margin:10px 0;padding:10px}.w-e-panel-content-emotion{font-size:20px;list-style:none;text-align:left;width:300px}.w-e-panel-content-emotion li{border-radius:3px 3px;cursor:pointer;display:inline-block;padding:0 5px}.w-e-panel-content-emotion li:hover{background-color:var(--w-e-textarea-slight-bg-color)}.w-e-textarea-divider{border-radius:3px;margin:20px auto;padding:20px}.w-e-textarea-divider hr{background-color:var(--w-e-textarea-border-color);border:0;display:block;height:1px}.w-e-text-container [data-slate-editor] pre>code{background-color:var(--w-e-textarea-slight-bg-color);border:1px solid var(--w-e-textarea-slight-border-color);border-radius:4px 4px;display:block;font-size:14px;padding:10px;text-indent:0}.w-e-text-container [data-slate-editor] .w-e-image-container{display:inline-block;margin:0 3px}.w-e-text-container [data-slate-editor] .w-e-image-container:hover{box-shadow:0 0 0 2px var(--w-e-textarea-selected-border-color)}.w-e-text-container [data-slate-editor] .w-e-selected-image-container{overflow:hidden;position:relative}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .w-e-image-dragger{background-color:var(--w-e-textarea-handler-bg-color);height:7px;position:absolute;width:7px}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .left-top{cursor:nwse-resize;left:0;top:0}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .right-top{cursor:nesw-resize;right:0;top:0}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .left-bottom{bottom:0;cursor:nesw-resize;left:0}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .right-bottom{bottom:0;cursor:nwse-resize;right:0}.w-e-text-container [contenteditable=false] .w-e-image-container:hover,.w-e-text-container [data-slate-editor] .w-e-selected-image-container:hover{box-shadow:none}
20
4
 
21
- .w-e-text-container *,
22
- .w-e-toolbar * {
23
- padding: 0;
24
- margin: 0;
25
- box-sizing: border-box;
26
- outline: none;
27
- }
28
- .w-e-text-container p,
29
- .w-e-text-container li,
30
- .w-e-text-container td,
31
- .w-e-text-container th,
32
- .w-e-text-container blockquote {
33
- line-height: 1.5;
34
- }
35
- .w-e-toolbar * {
36
- line-height: 1.5;
37
- }
38
- .w-e-text-container {
39
- color: var(--w-e-textarea-color);
40
- background-color: var(--w-e-textarea-bg-color);
41
- position: relative;
42
- height: 100%;
43
- }
44
- .no-scroll {
45
- width: 100%;
46
- }
47
- .w-e-text-container .w-e-scroll {
48
- height: 100%;
49
- -webkit-overflow-scrolling: touch;
50
- }
51
- .w-e-text-container [data-slate-editor] {
52
- outline: 0;
53
- white-space: pre-wrap;
54
- /* 【重要】可以显示空格,在连续多空格的情况下 */
55
- word-wrap: break-word;
56
- padding: 0 10px;
57
- border-top: 1px solid transparent;
58
- min-height: 100%;
59
- }
60
- .w-e-text-container [data-slate-editor] p {
61
- margin: 15px 0;
62
- }
63
- .w-e-text-container [data-slate-editor] h1,
64
- .w-e-text-container [data-slate-editor] h2,
65
- .w-e-text-container [data-slate-editor] h3,
66
- .w-e-text-container [data-slate-editor] h4,
67
- .w-e-text-container [data-slate-editor] h5 {
68
- margin: 20px 0 20px 0;
69
- }
70
- .w-e-text-container [data-slate-editor] img {
71
- max-width: 100%;
72
- min-width: 20px;
73
- min-height: 20px;
74
- cursor: default;
75
- display: inline !important;
76
- }
77
- .w-e-text-container [data-slate-editor] span {
78
- text-indent: 0;
79
- }
80
- .w-e-text-container [data-slate-editor] [data-selected="true"] {
81
- box-shadow: 0 0 0 2px var(--w-e-textarea-selected-border-color);
82
- }
83
- .w-e-text-placeholder {
84
- color: var(--w-e-textarea-slight-color);
85
- position: absolute;
86
- font-style: italic;
87
- width: 90%;
88
- left: 10px;
89
- top: 17px;
90
- pointer-events: none;
91
- -webkit-user-select: none;
92
- -moz-user-select: none;
93
- user-select: none;
94
- }
95
- .w-e-max-length-info {
96
- position: absolute;
97
- color: var(--w-e-textarea-slight-color);
98
- bottom: 0.5em;
99
- right: 1em;
100
- pointer-events: none;
101
- -webkit-user-select: none;
102
- -moz-user-select: none;
103
- user-select: none;
104
- }
105
- .w-e-bar {
106
- background-color: var(--w-e-toolbar-bg-color);
107
- padding: 0 5px;
108
- font-size: 14px;
109
- color: var(--w-e-toolbar-color);
110
- }
111
- .w-e-bar svg {
112
- width: 14px;
113
- height: 14px;
114
- fill: var(--w-e-toolbar-color);
115
- }
116
- .w-e-bar-show {
117
- display: flex;
118
- }
119
- .w-e-bar-hidden {
120
- display: none;
121
- }
122
- .w-e-hover-bar {
123
- position: absolute;
124
- border: 1px solid var(--w-e-toolbar-border-color);
125
- border-radius: 3px;
126
- box-shadow: 0 2px 5px #0000001f;
127
- }
128
- .w-e-toolbar {
129
- flex-wrap: wrap;
130
- position: relative;
131
- }
132
- .w-e-bar-divider {
133
- display: inline-flex;
134
- width: 1px;
135
- height: 40px;
136
- background-color: var(--w-e-toolbar-border-color);
137
- margin: 0 5px;
138
- }
139
- .w-e-bar-item {
140
- position: relative;
141
- display: flex;
142
- align-items: center;
143
- justify-content: center;
144
- text-align: center;
145
- padding: 4px;
146
- height: 40px;
147
- }
148
- .w-e-bar-item button {
149
- border: none;
150
- background: transparent;
151
- height: calc(40px - 8px);
152
- padding: 0 8px;
153
- cursor: pointer;
154
- display: inline-flex;
155
- justify-content: center;
156
- align-items: center;
157
- color: var(--w-e-toolbar-color);
158
- white-space: nowrap;
159
- /* 不换行 */
160
- overflow: hidden;
161
- }
162
- .w-e-bar-item button:hover {
163
- background-color: var(--w-e-toolbar-active-bg-color);
164
- color: var(--w-e-toolbar-active-color);
165
- }
166
- .w-e-bar-item button .title {
167
- margin-left: 5px;
168
- }
169
- .w-e-bar-item .active {
170
- background-color: var(--w-e-toolbar-active-bg-color);
171
- color: var(--w-e-toolbar-active-color);
172
- }
173
- .w-e-bar-item .disabled {
174
- color: var(--w-e-toolbar-disabled-color);
175
- cursor: not-allowed;
176
- }
177
- .w-e-bar-item .disabled svg {
178
- fill: var(--w-e-toolbar-disabled-color);
179
- }
180
- .w-e-bar-item .disabled:hover {
181
- background-color: var(--w-e-toolbar-bg-color);
182
- color: var(--w-e-toolbar-disabled-color);
183
- }
184
- .w-e-bar-item .disabled:hover svg {
185
- fill: var(--w-e-toolbar-disabled-color);
186
- }
187
- .w-e-menu-tooltip-v5:before {
188
- content: attr(data-tooltip);
189
- position: absolute;
190
- background-color: var(--w-e-toolbar-active-color);
191
- color: var(--w-e-toolbar-bg-color);
192
- text-align: center;
193
- padding: 5px 10px;
194
- border-radius: 5px;
195
- z-index: 1;
196
- opacity: 0;
197
- transition: opacity 0.6s;
198
- font-size: 0.75em;
199
- visibility: hidden;
200
- top: 40px;
201
- white-space: pre;
202
- }
203
- .w-e-menu-tooltip-v5:after {
204
- content: "";
205
- position: absolute;
206
- border-width: 5px;
207
- border-style: solid;
208
- opacity: 0;
209
- transition: opacity 0.6s;
210
- border-color: transparent transparent var(--w-e-toolbar-active-color) transparent;
211
- visibility: hidden;
212
- top: 30px;
213
- }
214
- .w-e-menu-tooltip-v5:hover:before,
215
- .w-e-menu-tooltip-v5:hover:after {
216
- opacity: 1;
217
- visibility: visible;
218
- }
219
- .w-e-menu-tooltip-v5.tooltip-right:before {
220
- left: 100%;
221
- top: 10px;
222
- }
223
- .w-e-menu-tooltip-v5.tooltip-right:after {
224
- left: 100%;
225
- margin-left: -10px;
226
- top: 16px;
227
- border-color: transparent var(--w-e-toolbar-active-color) transparent transparent;
228
- }
229
- .w-e-bar-item-group .w-e-bar-item-menus-container {
230
- display: none;
231
- /* 默认隐藏 */
232
- z-index: 1;
233
- background-color: var(--w-e-toolbar-bg-color);
234
- position: absolute;
235
- top: 0;
236
- left: 0;
237
- margin-top: 40px;
238
- border: 1px solid var(--w-e-toolbar-border-color);
239
- border-radius: 3px;
240
- box-shadow: 0 2px 10px #0000001f;
241
- }
242
- .w-e-bar-item-group:hover {
243
- /* hover 时显示下级菜单 */
244
- }
245
- .w-e-bar-item-group:hover .w-e-bar-item-menus-container {
246
- display: block;
247
- }
248
- .w-e-select-list {
249
- z-index: 1;
250
- position: absolute;
251
- left: 0;
252
- top: 0;
253
- background-color: var(--w-e-toolbar-bg-color);
254
- margin-top: 40px;
255
- min-width: 100px;
256
- border: 1px solid var(--w-e-toolbar-border-color);
257
- border-radius: 3px;
258
- box-shadow: 0 2px 10px #0000001f;
259
- max-height: 350px;
260
- overflow-y: auto;
261
- }
262
- .w-e-select-list ul {
263
- list-style: none;
264
- line-height: 1;
265
- }
266
- .w-e-select-list ul .selected {
267
- background-color: var(--w-e-toolbar-active-bg-color);
268
- }
269
- .w-e-select-list ul li {
270
- cursor: pointer;
271
- padding: 7px 0 7px 25px;
272
- position: relative;
273
- text-align: left;
274
- white-space: nowrap;
275
- /* 不换行 */
276
- }
277
- .w-e-select-list ul li:hover {
278
- background-color: var(--w-e-toolbar-active-bg-color);
279
- }
280
- .w-e-select-list ul li svg {
281
- position: absolute;
282
- left: 0;
283
- margin-left: 5px;
284
- top: 50%;
285
- margin-top: -7px;
286
- }
287
- .w-e-bar-bottom .w-e-select-list {
288
- top: inherit;
289
- bottom: 0;
290
- margin-top: 0;
291
- margin-bottom: 40px;
292
- }
293
- .w-e-drop-panel {
294
- z-index: 1;
295
- background-color: var(--w-e-toolbar-bg-color);
296
- position: absolute;
297
- top: 0;
298
- border: 1px solid var(--w-e-toolbar-border-color);
299
- border-radius: 3px;
300
- box-shadow: 0 2px 10px #0000001f;
301
- margin-top: 40px;
302
- min-width: 200px;
303
- padding: 10px;
304
- }
305
- .w-e-bar-bottom .w-e-drop-panel {
306
- top: inherit;
307
- bottom: 0;
308
- margin-top: 0;
309
- margin-bottom: 40px;
310
- }
311
- .w-e-modal {
312
- z-index: 1;
313
- background-color: var(--w-e-toolbar-bg-color);
314
- position: absolute;
315
- padding: 20px 15px 0 15px;
316
- min-width: 100px;
317
- min-height: 40px;
318
- color: var(--w-e-toolbar-color);
319
- text-align: left;
320
- font-size: 14px;
321
- border: 1px solid var(--w-e-toolbar-border-color);
322
- border-radius: 3px;
323
- box-shadow: 0 2px 10px #0000001f;
324
- }
325
- .w-e-modal .btn-close {
326
- position: absolute;
327
- right: 8px;
328
- top: 7px;
329
- cursor: pointer;
330
- padding: 5px;
331
- line-height: 1;
332
- }
333
- .w-e-modal .btn-close svg {
334
- width: 10px;
335
- height: 10px;
336
- fill: var(--w-e-toolbar-color);
337
- }
338
- .w-e-modal .babel-container {
339
- display: block;
340
- margin-bottom: 15px;
341
- }
342
- .w-e-modal .babel-container span {
343
- display: block;
344
- margin-bottom: 10px;
345
- }
346
- .w-e-modal .button-container {
347
- margin-bottom: 15px;
348
- }
349
- .w-e-modal button {
350
- font-weight: 400;
351
- white-space: nowrap;
352
- cursor: pointer;
353
- transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
354
- -webkit-user-select: none;
355
- -moz-user-select: none;
356
- user-select: none;
357
- touch-action: manipulation;
358
- height: 32px;
359
- padding: 4.5px 15px;
360
- color: var(--w-e-toolbar-color);
361
- background-color: var(--w-e-modal-button-bg-color);
362
- text-align: center;
363
- border: 1px solid var(--w-e-modal-button-border-color);
364
- border-radius: 4px;
365
- }
366
- .w-e-modal textarea,
367
- .w-e-modal input[type="text"],
368
- .w-e-modal input[type="number"] {
369
- font-variant: tabular-nums;
370
- font-feature-settings: "tnum";
371
- padding: 4.5px 11px;
372
- color: var(--w-e-toolbar-color);
373
- background-color: var(--w-e-toolbar-bg-color);
374
- border: 1px solid var(--w-e-modal-button-border-color);
375
- border-radius: 4px;
376
- transition: all 0.3s;
377
- width: 100%;
378
- }
379
- .w-e-modal textarea {
380
- min-height: 60px;
381
- }
382
- body .w-e-modal {
383
- box-sizing: border-box;
384
- }
385
- body .w-e-modal * {
386
- box-sizing: border-box;
387
- }
388
- .w-e-progress-bar {
389
- position: absolute;
390
- width: 0;
391
- height: 1px;
392
- background-color: var(--w-e-textarea-handler-bg-color);
393
- transition: width 0.3s;
394
- }
395
- .w-e-full-screen-container {
396
- position: fixed;
397
- margin: 0 !important;
398
- padding: 0 !important;
399
- top: 0 !important;
400
- left: 0 !important;
401
- right: 0 !important;
402
- bottom: 0 !important;
403
- height: 100% !important;
404
- width: 100% !important;
405
- display: flex !important;
406
- flex-direction: column !important;
407
- }
408
- .w-e-full-screen-container [data-w-e-textarea="true"] {
409
- flex: 1 !important;
410
- }
5
+ .w-e-text-container [data-slate-editor] .table-container{border-radius:0;margin-top:10px;overflow-x:auto;padding:0;position:relative;width:100%}.w-e-text-container [data-slate-editor] table{border-collapse:collapse;table-layout:fixed}.w-e-text-container [data-slate-editor] table td,.w-e-text-container [data-slate-editor] table th{border:1px solid var(--w-e-textarea-border-color);line-height:1.5;min-width:30px;overflow:hidden;overflow-wrap:break-word;padding:3px 5px;white-space:pre-wrap;word-break:break-all}.w-e-text-container [data-slate-editor] table th{background-color:var(--w-e-textarea-slight-bg-color);font-weight:700;text-align:center}.w-e-text-container [data-slate-editor] table td.w-e-selected,.w-e-text-container [data-slate-editor] table th.w-e-selected{background-color:rgba(20,86,240,.18)}.w-e-text-container [data-slate-editor] table.table-selection-none ::-moz-selection{background:none}.w-e-text-container [data-slate-editor] table.table-selection-none ::selection{background:none}.w-e-text-container [data-slate-editor] .column-resizer{display:flex;height:0;left:0;position:absolute;top:0;width:0;z-index:1}.w-e-text-container [data-slate-editor] .column-resizer .column-resizer-item{position:relative}.w-e-text-container [data-slate-editor] .resizer-line-hotzone{cursor:col-resize;opacity:0;position:absolute;right:0;transition:opacity .2s ease,visibility .2s ease;visibility:hidden;width:6px}.w-e-text-container [data-slate-editor] .resizer-line-hotzone .resizer-line{background:rgba(20,86,240,.8);height:100%;margin-left:5px;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:2px}.w-e-text-container [data-slate-editor] .resizer-line-hotzone.visible{visibility:visible}.w-e-text-container [data-slate-editor] .resizer-line-hotzone.highlight{opacity:1}.w-e-panel-content-table{background-color:var(--w-e-toolbar-bg-color)}.w-e-panel-content-table table{border-collapse:collapse;table-layout:fixed}.w-e-panel-content-table td,.w-e-panel-content-table th{overflow:hidden;overflow-wrap:break-word;white-space:pre-wrap;word-break:break-all}.w-e-panel-content-table td{border:1px solid var(--w-e-toolbar-border-color);cursor:pointer;height:15px;padding:3px 5px;width:20px}.w-e-panel-content-table td.active{background-color:var(--w-e-toolbar-active-bg-color)}.w-e-modal .babel-container span.babel-container-border{display:flex}.w-e-modal .babel-container span.babel-container-border>*{border:1px solid var(--w-e-modal-button-border-color);border-radius:2px;height:28px}.w-e-modal .babel-container span.babel-container-border select{width:114px}.w-e-modal .babel-container span.babel-container-border>:nth-child(n+2){margin-left:8px}.w-e-modal .babel-container span.babel-container-border input:nth-child(3){width:100px}.w-e-modal .babel-container span.babel-container-background input{width:60px}.w-e-modal .babel-container .color-group,.w-e-modal .babel-container span.babel-container-algin select,.w-e-modal .babel-container span.babel-container-background input{border:1px solid var(--w-e-modal-button-border-color);border-radius:2px;height:28px}.w-e-modal .babel-container .color-group{cursor:pointer;position:relative;width:28px}.w-e-modal .babel-container .color-group .w-e-drop-panel{margin-top:28px}.w-e-modal .babel-container .color-group-block{display:block;height:80%;margin:10%;width:80%}.w-e-modal .babel-container .color-group-block svg{height:20px;margin:1px 0;width:20px}
6
+ .w-e-textarea-video-container{background-image:linear-gradient(45deg,#eee 25%,transparent 0,transparent 75%,#eee 0,#eee),linear-gradient(45deg,#eee 25%,#fff 0,#fff 75%,#eee 0,#eee);background-position:0 0,10px 10px;background-size:20px 20px;border:1px dashed var(--w-e-textarea-border-color);border-radius:5px;margin:10px auto 0;overflow:auto;padding:10px 0;text-align:center}
411
7
 
412
- .w-e-text-container [data-slate-editor] code {
413
- font-family: monospace;
414
- background-color: var(--w-e-textarea-slight-bg-color);
415
- padding: 3px;
416
- border-radius: 3px;
417
- }
418
- .w-e-panel-content-color {
419
- list-style: none;
420
- text-align: left;
421
- width: 230px;
422
- }
423
- .w-e-panel-content-color li {
424
- display: inline-block;
425
- padding: 2px;
426
- cursor: pointer;
427
- border-radius: 3px 3px;
428
- border: 1px solid var(--w-e-toolbar-bg-color);
429
- }
430
- .w-e-panel-content-color li:hover {
431
- border-color: var(--w-e-toolbar-color);
432
- }
433
- .w-e-panel-content-color li .color-block {
434
- width: 17px;
435
- height: 17px;
436
- border: 1px solid var(--w-e-toolbar-border-color);
437
- border-radius: 3px 3px;
438
- }
439
- .w-e-panel-content-color .active {
440
- border-color: var(--w-e-toolbar-color);
441
- }
442
- .w-e-panel-content-color .clear {
443
- width: 100%;
444
- line-height: 1.5;
445
- margin-bottom: 5px;
446
- }
447
- .w-e-panel-content-color .clear svg {
448
- width: 16px;
449
- height: 16px;
450
- margin-bottom: -4px;
451
- }
452
- .w-e-text-container [data-slate-editor] blockquote {
453
- display: block;
454
- border-left: 8px solid var(--w-e-textarea-selected-border-color);
455
- padding: 10px 10px;
456
- margin: 10px 0;
457
- line-height: 1.5;
458
- font-size: 100%;
459
- background-color: var(--w-e-textarea-slight-bg-color);
460
- }
461
- .w-e-panel-content-emotion {
462
- list-style: none;
463
- text-align: left;
464
- width: 300px;
465
- font-size: 20px;
466
- }
467
- .w-e-panel-content-emotion li {
468
- display: inline-block;
469
- padding: 0 5px;
470
- cursor: pointer;
471
- border-radius: 3px 3px;
472
- }
473
- .w-e-panel-content-emotion li:hover {
474
- background-color: var(--w-e-textarea-slight-bg-color);
475
- }
476
- .w-e-textarea-divider {
477
- padding: 20px 20px;
478
- margin: 20px auto;
479
- border-radius: 3px;
480
- }
481
- .w-e-textarea-divider hr {
482
- display: block;
483
- border: 0;
484
- height: 1px;
485
- background-color: var(--w-e-textarea-border-color);
486
- }
487
- .w-e-text-container [data-slate-editor] pre > code {
488
- display: block;
489
- border: 1px solid var(--w-e-textarea-slight-border-color);
490
- border-radius: 4px 4px;
491
- text-indent: 0;
492
- background-color: var(--w-e-textarea-slight-bg-color);
493
- padding: 10px;
494
- font-size: 14px;
495
- }
496
- .w-e-text-container [data-slate-editor] .w-e-image-container {
497
- display: inline-block;
498
- margin: 0 3px;
499
- }
500
- .w-e-text-container [data-slate-editor] .w-e-image-container:hover {
501
- box-shadow: 0 0 0 2px var(--w-e-textarea-selected-border-color);
502
- }
503
- .w-e-text-container [data-slate-editor] .w-e-selected-image-container {
504
- position: relative;
505
- overflow: hidden;
506
- }
507
- .w-e-text-container [data-slate-editor] .w-e-selected-image-container .w-e-image-dragger {
508
- width: 7px;
509
- height: 7px;
510
- background-color: var(--w-e-textarea-handler-bg-color);
511
- position: absolute;
512
- }
513
- .w-e-text-container [data-slate-editor] .w-e-selected-image-container .left-top {
514
- top: 0;
515
- left: 0;
516
- cursor: nwse-resize;
517
- }
518
- .w-e-text-container [data-slate-editor] .w-e-selected-image-container .right-top {
519
- top: 0;
520
- right: 0;
521
- cursor: nesw-resize;
522
- }
523
- .w-e-text-container [data-slate-editor] .w-e-selected-image-container .left-bottom {
524
- left: 0;
525
- bottom: 0;
526
- cursor: nesw-resize;
527
- }
528
- .w-e-text-container [data-slate-editor] .w-e-selected-image-container .right-bottom {
529
- right: 0;
530
- bottom: 0;
531
- cursor: nwse-resize;
532
- }
533
- .w-e-text-container [data-slate-editor] .w-e-selected-image-container:hover {
534
- box-shadow: none;
535
- }
536
- .w-e-text-container [contenteditable="false"] .w-e-image-container:hover {
537
- box-shadow: none;
538
- }
539
-
540
-
541
- .w-e-text-container [data-slate-editor] {
542
- /* 干掉 Chrome 默认选区样式*/
543
- /* 拖动 Style */
544
- }
545
- .w-e-text-container [data-slate-editor] .table-container {
546
- width: 100%;
547
- overflow-x: auto;
548
- padding: 0px;
549
- border-radius: 0px;
550
- margin-top: 10px;
551
- position: relative;
552
- }
553
- .w-e-text-container [data-slate-editor] table {
554
- border-collapse: collapse;
555
- table-layout: fixed;
556
- /* 选区拖影 */
557
- }
558
- .w-e-text-container [data-slate-editor] table td,
559
- .w-e-text-container [data-slate-editor] table th {
560
- border: 1px solid var(--w-e-textarea-border-color);
561
- padding: 3px 5px;
562
- min-width: 30px;
563
- line-height: 1.5;
564
- /* 强制换行,table column 宽度必须拖动增大 */
565
- overflow: hidden;
566
- overflow-wrap: break-word;
567
- word-break: break-all;
568
- white-space: pre-wrap;
569
- }
570
- .w-e-text-container [data-slate-editor] table th {
571
- background-color: var(--w-e-textarea-slight-bg-color);
572
- text-align: center;
573
- font-weight: bold;
574
- }
575
- .w-e-text-container [data-slate-editor] table td.w-e-selected,
576
- .w-e-text-container [data-slate-editor] table th.w-e-selected {
577
- background-color: rgba(20, 86, 240, 0.18);
578
- }
579
- .w-e-text-container [data-slate-editor] table.table-selection-none *::-moz-selection {
580
- background: none;
581
- }
582
- .w-e-text-container [data-slate-editor] table.table-selection-none *::selection {
583
- background: none;
584
- }
585
- .w-e-text-container [data-slate-editor] .column-resizer {
586
- position: absolute;
587
- display: flex;
588
- top: 0px;
589
- left: 0px;
590
- width: 0;
591
- height: 0;
592
- z-index: 1;
593
- }
594
- .w-e-text-container [data-slate-editor] .column-resizer .column-resizer-item {
595
- position: relative;
596
- }
597
- .w-e-text-container [data-slate-editor] .resizer-line-hotzone {
598
- cursor: col-resize;
599
- position: absolute;
600
- width: 6px;
601
- right: 0px;
602
- visibility: hidden;
603
- opacity: 0;
604
- transition: opacity 0.2s ease, visibility 0.2s ease;
605
- }
606
- .w-e-text-container [data-slate-editor] .resizer-line-hotzone .resizer-line {
607
- height: 100%;
608
- width: 2px;
609
- margin-left: 5px;
610
- background: rgba(20, 86, 240, 0.8);
611
- -webkit-user-select: none;
612
- -moz-user-select: none;
613
- user-select: none;
614
- }
615
- .w-e-text-container [data-slate-editor] .resizer-line-hotzone.visible {
616
- visibility: visible;
617
- }
618
- .w-e-text-container [data-slate-editor] .resizer-line-hotzone.highlight {
619
- opacity: 1;
620
- }
621
- .w-e-panel-content-table {
622
- background-color: var(--w-e-toolbar-bg-color);
623
- }
624
- .w-e-panel-content-table table {
625
- border-collapse: collapse;
626
- table-layout: fixed;
627
- }
628
- .w-e-panel-content-table th,
629
- .w-e-panel-content-table td {
630
- overflow: hidden;
631
- overflow-wrap: break-word;
632
- word-break: break-all;
633
- white-space: pre-wrap;
634
- }
635
- .w-e-panel-content-table td {
636
- border: 1px solid var(--w-e-toolbar-border-color);
637
- padding: 3px 5px;
638
- width: 20px;
639
- height: 15px;
640
- cursor: pointer;
641
- }
642
- .w-e-panel-content-table td.active {
643
- background-color: var(--w-e-toolbar-active-bg-color);
644
- }
645
- .w-e-modal .babel-container span.babel-container-border {
646
- display: flex;
647
- }
648
- .w-e-modal .babel-container span.babel-container-border > * {
649
- height: 28px;
650
- border: 1px solid var(--w-e-modal-button-border-color);
651
- border-radius: 2px;
652
- }
653
- .w-e-modal .babel-container span.babel-container-border select {
654
- width: 114px;
655
- }
656
- .w-e-modal .babel-container span.babel-container-border > :nth-child(n+2) {
657
- margin-left: 8px;
658
- }
659
- .w-e-modal .babel-container span.babel-container-border input:nth-child(3) {
660
- width: 100px;
661
- }
662
- .w-e-modal .babel-container span.babel-container-background input {
663
- height: 28px;
664
- border: 1px solid var(--w-e-modal-button-border-color);
665
- border-radius: 2px;
666
- width: 60px;
667
- }
668
- .w-e-modal .babel-container span.babel-container-algin select {
669
- height: 28px;
670
- border: 1px solid var(--w-e-modal-button-border-color);
671
- border-radius: 2px;
672
- }
673
- .w-e-modal .babel-container .color-group {
674
- position: relative;
675
- width: 28px;
676
- height: 28px;
677
- border: 1px solid var(--w-e-modal-button-border-color);
678
- border-radius: 2px;
679
- cursor: pointer;
680
- }
681
- .w-e-modal .babel-container .color-group .w-e-drop-panel {
682
- margin-top: 28px;
683
- }
684
- .w-e-modal .babel-container .color-group-block {
685
- display: block;
686
- width: 80%;
687
- height: 80%;
688
- margin: 10%;
689
- }
690
- .w-e-modal .babel-container .color-group-block svg {
691
- width: 20px;
692
- height: 20px;
693
- margin: 1px 0px;
694
- }
695
-
696
- .w-e-textarea-video-container {
697
- text-align: center;
698
- border: 1px dashed var(--w-e-textarea-border-color);
699
- padding: 10px 0;
700
- margin: 0 auto;
701
- margin-top: 10px;
702
- border-radius: 5px;
703
- overflow: auto;
704
- background-position: 0px 0px, 10px 10px;
705
- background-size: 20px 20px;
706
- background-image: linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee 100%), linear-gradient(45deg, #eee 25%, white 25%, white 75%, #eee 75%, #eee 100%);
707
- }
708
-
709
-
710
- .w-e-text-container [data-slate-editor] pre > code {
711
- text-shadow: 0 1px white;
712
- font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
713
- text-align: left;
714
- white-space: pre;
715
- word-spacing: normal;
716
- word-break: normal;
717
- word-wrap: normal;
718
- line-height: 1.5;
719
- -moz-tab-size: 4;
720
- -o-tab-size: 4;
721
- tab-size: 4;
722
- -webkit-hyphens: none;
723
- hyphens: none;
724
- padding: 1em;
725
- margin: 0.5em 0;
726
- overflow: auto;
727
- }
728
- .w-e-text-container [data-slate-editor] pre > code .token.comment,
729
- .w-e-text-container [data-slate-editor] pre > code .token.prolog,
730
- .w-e-text-container [data-slate-editor] pre > code .token.doctype,
731
- .w-e-text-container [data-slate-editor] pre > code .token.cdata {
732
- color: slategray;
733
- }
734
- .w-e-text-container [data-slate-editor] pre > code .token.punctuation {
735
- color: #999;
736
- }
737
- .w-e-text-container [data-slate-editor] pre > code .token.namespace {
738
- opacity: 0.7;
739
- }
740
- .w-e-text-container [data-slate-editor] pre > code .token.property,
741
- .w-e-text-container [data-slate-editor] pre > code .token.tag,
742
- .w-e-text-container [data-slate-editor] pre > code .token.boolean,
743
- .w-e-text-container [data-slate-editor] pre > code .token.number,
744
- .w-e-text-container [data-slate-editor] pre > code .token.constant,
745
- .w-e-text-container [data-slate-editor] pre > code .token.symbol,
746
- .w-e-text-container [data-slate-editor] pre > code .token.deleted {
747
- color: #905;
748
- }
749
- .w-e-text-container [data-slate-editor] pre > code .token.selector,
750
- .w-e-text-container [data-slate-editor] pre > code .token.attr-name,
751
- .w-e-text-container [data-slate-editor] pre > code .token.string,
752
- .w-e-text-container [data-slate-editor] pre > code .token.char,
753
- .w-e-text-container [data-slate-editor] pre > code .token.builtin,
754
- .w-e-text-container [data-slate-editor] pre > code .token.inserted {
755
- color: #690;
756
- }
757
- .w-e-text-container [data-slate-editor] pre > code .token.operator,
758
- .w-e-text-container [data-slate-editor] pre > code .token.entity,
759
- .w-e-text-container [data-slate-editor] pre > code .token.url,
760
- .w-e-text-container [data-slate-editor] pre > code .language-css .token.string,
761
- .w-e-text-container [data-slate-editor] pre > code .style .token.string {
762
- color: #9a6e3a;
763
- }
764
- .w-e-text-container [data-slate-editor] pre > code .token.atrule,
765
- .w-e-text-container [data-slate-editor] pre > code .token.attr-value,
766
- .w-e-text-container [data-slate-editor] pre > code .token.keyword {
767
- color: #07a;
768
- }
769
- .w-e-text-container [data-slate-editor] pre > code .token.function,
770
- .w-e-text-container [data-slate-editor] pre > code .token.class-name {
771
- color: #DD4A68;
772
- }
773
- .w-e-text-container [data-slate-editor] pre > code .token.regex,
774
- .w-e-text-container [data-slate-editor] pre > code .token.important,
775
- .w-e-text-container [data-slate-editor] pre > code .token.variable {
776
- color: #e90;
777
- }
778
- .w-e-text-container [data-slate-editor] pre > code .token.important,
779
- .w-e-text-container [data-slate-editor] pre > code .token.bold {
780
- font-weight: bold;
781
- }
782
- .w-e-text-container [data-slate-editor] pre > code .token.italic {
783
- font-style: italic;
784
- }
785
- .w-e-text-container [data-slate-editor] pre > code .token.entity {
786
- cursor: help;
787
- }
8
+ .w-e-text-container [data-slate-editor] pre>code{font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;text-align:left;text-shadow:0 1px #fff;white-space:pre;word-break:normal;word-spacing:normal;word-wrap:normal;-webkit-hyphens:none;hyphens:none;line-height:1.5;margin:.5em 0;overflow:auto;padding:1em;-moz-tab-size:4;-o-tab-size:4;tab-size:4}.w-e-text-container [data-slate-editor] pre>code .token.cdata,.w-e-text-container [data-slate-editor] pre>code .token.comment,.w-e-text-container [data-slate-editor] pre>code .token.doctype,.w-e-text-container [data-slate-editor] pre>code .token.prolog{color:#708090}.w-e-text-container [data-slate-editor] pre>code .token.punctuation{color:#999}.w-e-text-container [data-slate-editor] pre>code .token.namespace{opacity:.7}.w-e-text-container [data-slate-editor] pre>code .token.boolean,.w-e-text-container [data-slate-editor] pre>code .token.constant,.w-e-text-container [data-slate-editor] pre>code .token.deleted,.w-e-text-container [data-slate-editor] pre>code .token.number,.w-e-text-container [data-slate-editor] pre>code .token.property,.w-e-text-container [data-slate-editor] pre>code .token.symbol,.w-e-text-container [data-slate-editor] pre>code .token.tag{color:#905}.w-e-text-container [data-slate-editor] pre>code .token.attr-name,.w-e-text-container [data-slate-editor] pre>code .token.builtin,.w-e-text-container [data-slate-editor] pre>code .token.char,.w-e-text-container [data-slate-editor] pre>code .token.inserted,.w-e-text-container [data-slate-editor] pre>code .token.selector,.w-e-text-container [data-slate-editor] pre>code .token.string{color:#690}.w-e-text-container [data-slate-editor] pre>code .language-css .token.string,.w-e-text-container [data-slate-editor] pre>code .style .token.string,.w-e-text-container [data-slate-editor] pre>code .token.entity,.w-e-text-container [data-slate-editor] pre>code .token.operator,.w-e-text-container [data-slate-editor] pre>code .token.url{color:#9a6e3a}.w-e-text-container [data-slate-editor] pre>code .token.atrule,.w-e-text-container [data-slate-editor] pre>code .token.attr-value,.w-e-text-container [data-slate-editor] pre>code .token.keyword{color:#07a}.w-e-text-container [data-slate-editor] pre>code .token.class-name,.w-e-text-container [data-slate-editor] pre>code .token.function{color:#dd4a68}.w-e-text-container [data-slate-editor] pre>code .token.important,.w-e-text-container [data-slate-editor] pre>code .token.regex,.w-e-text-container [data-slate-editor] pre>code .token.variable{color:#e90}.w-e-text-container [data-slate-editor] pre>code .token.bold,.w-e-text-container [data-slate-editor] pre>code .token.important{font-weight:700}.w-e-text-container [data-slate-editor] pre>code .token.italic{font-style:italic}.w-e-text-container [data-slate-editor] pre>code .token.entity{cursor:help}