@wangeditor-next/editor 5.3.1 → 5.3.2

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