@_sh/strapi-plugin-ckeditor 1.0.9 → 1.1.0
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/README.md +78 -105
- package/admin/src/components/CKEditor/build/ckeditor.js +1 -1
- package/admin/src/components/CKEditor/build/ckeditor.js.map +1 -1
- package/admin/src/components/CKEditor/index.js +140 -134
- package/admin/src/components/CKEditor/styles.js +12 -62
- package/admin/src/components/CKEditor/theme.js +282 -0
- package/package.json +1 -1
|
@@ -0,0 +1,282 @@
|
|
|
1
|
+
const theme = `
|
|
2
|
+
.ck.ck-editor__main .ck-blurred{
|
|
3
|
+
max-height: 200px;
|
|
4
|
+
}
|
|
5
|
+
.ck.ck-editor__main .ck-focused{
|
|
6
|
+
max-height: 900px;
|
|
7
|
+
}
|
|
8
|
+
.ck.ck-sticky-panel .ck-sticky-panel__content_sticky{ top:64px }
|
|
9
|
+
.ck.ck-reset.ck-dropdown__panel.ck-dropdown__panel_sw.ck-dropdown__panel-visible{
|
|
10
|
+
border-radius:4px;
|
|
11
|
+
}
|
|
12
|
+
.ck.ck-editor__main .ck-focused, .ck-blurred{
|
|
13
|
+
overflow-y: auto;
|
|
14
|
+
overflow-x: hidden;
|
|
15
|
+
transition: max-height 0.5s ease-in-out;
|
|
16
|
+
::-webkit-scrollbar {
|
|
17
|
+
width: 7px;
|
|
18
|
+
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
::-webkit-scrollbar-track {
|
|
22
|
+
background: var(--ck-scroll-track-background);
|
|
23
|
+
border: none;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
::-webkit-scrollbar-thumb {
|
|
27
|
+
transition:background 2s;
|
|
28
|
+
background: var(--ck-scroll-thumb-background);
|
|
29
|
+
border: 1px solid var(--ck-scroll-thumb-border-color);
|
|
30
|
+
}
|
|
31
|
+
::-webkit-scrollbar-thumb:hover {
|
|
32
|
+
transition:background 2s;
|
|
33
|
+
background: var(--ck-scroll-thumb-hover-background);
|
|
34
|
+
}
|
|
35
|
+
::-webkit-scrollbar-thumb:active {
|
|
36
|
+
background: var(--ck-scroll-thumb-active-background);
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
html[data-theme='light'] {
|
|
41
|
+
|
|
42
|
+
--ck-scroll-track-background:rgb(242,242,242);
|
|
43
|
+
--ck-scroll-thumb-background:rgb(236,236,236);
|
|
44
|
+
--ck-scroll-thumb-border-color:#cdcdf8;
|
|
45
|
+
--ck-scroll-thumb-hover-background:#F0F0FF;
|
|
46
|
+
--ck-scroll-thumb-active-background:#D9D8FF;
|
|
47
|
+
|
|
48
|
+
--ck-color-editor-base-text:#1A1A1A;
|
|
49
|
+
/* Overrides the border radius setting in the theme. */
|
|
50
|
+
--ck-border-radius: 4px;
|
|
51
|
+
|
|
52
|
+
/* Helper variables to avoid duplication in the colors. */
|
|
53
|
+
--ck-color-base-border: #DCDCE4;
|
|
54
|
+
--ck-color-base-background:#ffffff;
|
|
55
|
+
--ck-custom-background: #ffffff;
|
|
56
|
+
--ck-custom-foreground: #dedede;
|
|
57
|
+
--ck-custom-border: #DCDCE4;
|
|
58
|
+
--ck-custom-white: hsl(0, 0%, 100%);
|
|
59
|
+
|
|
60
|
+
--ck-color-focus-outer-shadow:#F6F6F9;
|
|
61
|
+
|
|
62
|
+
--ck-color-base-focus: #bbbaf1;
|
|
63
|
+
--ck-color-base-active: #F0F0FF;
|
|
64
|
+
--ck-color-base-active-focus: #e2e2fd;
|
|
65
|
+
/* -- Overrides generic colors. ------------------------------------------------------------- */
|
|
66
|
+
|
|
67
|
+
--ck-color-base-foreground: var(--ck-custom-background);
|
|
68
|
+
--ck-color-focus-border: #bdc8fc;
|
|
69
|
+
--ck-color-text: #32324D;
|
|
70
|
+
/* --ck-color-text: hsl(240, 18%, 33%); */
|
|
71
|
+
--ck-color-shadow-drop: hsla(250, 31%, 80%, 0.1);
|
|
72
|
+
--ck-color-shadow-inner: hsla(250, 31%, 80%, 0.1);
|
|
73
|
+
|
|
74
|
+
/* -- Overrides the default .ck-button class colors. ---------------------------------------- */
|
|
75
|
+
|
|
76
|
+
--ck-color-button-default-background: var(--ck-custom-background);
|
|
77
|
+
--ck-color-button-default-hover-background: #F0F0FF;
|
|
78
|
+
--ck-color-button-default-active-background: #F6F6F9;
|
|
79
|
+
--ck-color-button-default-active-shadow: #dedefb;
|
|
80
|
+
--ck-color-button-default-disabled-background: var(--ck-custom-background);
|
|
81
|
+
|
|
82
|
+
--ck-color-button-on-background: #F6F6F9;
|
|
83
|
+
--ck-color-button-on-hover-background: #F0F0FF;
|
|
84
|
+
--ck-color-button-on-active-background: #F6F6F9;
|
|
85
|
+
--ck-color-button-on-active-shadow: #cdcdf8;
|
|
86
|
+
--ck-color-button-on-disabled-background: var(--ck-custom-foreground);
|
|
87
|
+
|
|
88
|
+
--ck-color-button-action-background: hsl(168, 76%, 42%);
|
|
89
|
+
--ck-color-button-action-hover-background: hsl(168, 76%, 38%);
|
|
90
|
+
--ck-color-button-action-active-background: hsl(168, 76%, 36%);
|
|
91
|
+
--ck-color-button-action-active-shadow: hsl(168, 75%, 34%);
|
|
92
|
+
--ck-color-button-action-disabled-background: hsl(168, 76%, 42%);
|
|
93
|
+
--ck-color-button-action-text: var(--ck-custom-white);
|
|
94
|
+
|
|
95
|
+
--ck-color-button-save: hsl(120, 100%, 46%);
|
|
96
|
+
--ck-color-button-cancel: hsl(15, 100%, 56%);
|
|
97
|
+
|
|
98
|
+
/* -- Overrides the default .ck-dropdown class colors. -------------------------------------- */
|
|
99
|
+
|
|
100
|
+
--ck-color-dropdown-panel-background: var(--ck-custom-background);
|
|
101
|
+
--ck-color-dropdown-panel-border: var(--ck-custom-foreground);
|
|
102
|
+
|
|
103
|
+
/* -- Overrides the default .ck-splitbutton class colors. ----------------------------------- */
|
|
104
|
+
|
|
105
|
+
--ck-color-split-button-hover-background: var(--ck-color-button-default-hover-background);
|
|
106
|
+
--ck-color-split-button-hover-border: var(--ck-custom-foreground);
|
|
107
|
+
|
|
108
|
+
/* -- Overrides the default .ck-input class colors. ----------------------------------------- */
|
|
109
|
+
|
|
110
|
+
--ck-color-input-background: var(--ck-custom-background);
|
|
111
|
+
--ck-color-input-border: hsl(257, 3%, 43%);
|
|
112
|
+
--ck-color-input-text: hsl(0, 0%, 98%);
|
|
113
|
+
--ck-color-input-disabled-background: hsl(0, 0%, 97%);
|
|
114
|
+
--ck-color-input-disabled-border: rgb(214, 214, 214);
|
|
115
|
+
--ck-color-input-disabled-text: hsl(0, 0%, 78%);
|
|
116
|
+
|
|
117
|
+
/* -- Overrides the default .ck-labeled-field-view class colors. ---------------------------- */
|
|
118
|
+
|
|
119
|
+
--ck-color-labeled-field-label-background: var(--ck-custom-background);
|
|
120
|
+
|
|
121
|
+
/* -- Overrides the default .ck-list class colors. ------------------------------------------ */
|
|
122
|
+
|
|
123
|
+
--ck-color-list-background: var(--ck-custom-background);
|
|
124
|
+
--ck-color-list-button-hover-background: #f4f4fb;
|
|
125
|
+
--ck-color-list-button-on-background: var(--ck-color-base-active);
|
|
126
|
+
--ck-color-list-button-on-background-focus: var(--ck-color-base-active-focus);
|
|
127
|
+
--ck-color-list-button-on-text: #271FE2;
|
|
128
|
+
|
|
129
|
+
/* -- Overrides the default .ck-balloon-panel class colors. --------------------------------- */
|
|
130
|
+
|
|
131
|
+
--ck-color-panel-background: var(--ck-custom-background);
|
|
132
|
+
--ck-color-panel-border: var(--ck-custom-border);
|
|
133
|
+
|
|
134
|
+
/* -- Overrides the default .ck-toolbar class colors. --------------------------------------- */
|
|
135
|
+
|
|
136
|
+
--ck-color-toolbar-background: var(--ck-custom-background);
|
|
137
|
+
--ck-color-toolbar-border: var(--ck-custom-border);
|
|
138
|
+
|
|
139
|
+
/* -- Overrides the default .ck-tooltip class colors. --------------------------------------- */
|
|
140
|
+
|
|
141
|
+
--ck-color-tooltip-background: #3a3955;
|
|
142
|
+
--ck-color-tooltip-text: hsl(0, 0%, 93%);
|
|
143
|
+
|
|
144
|
+
/* -- Overrides the default colors used by the ckeditor5-image package. --------------------- */
|
|
145
|
+
|
|
146
|
+
--ck-color-image-caption-background: hsl(0, 0%, 97%);
|
|
147
|
+
--ck-color-image-caption-text: hsl(0, 0%, 20%);
|
|
148
|
+
|
|
149
|
+
/* -- Overrides the default colors used by the ckeditor5-widget package. -------------------- */
|
|
150
|
+
|
|
151
|
+
--ck-color-widget-blurred-border: #cfcffa;
|
|
152
|
+
--ck-color-widget-hover-border: #c9c9e4;
|
|
153
|
+
--ck-color-widget-editable-focus-background: var(--ck-custom-white);
|
|
154
|
+
|
|
155
|
+
/* -- Overrides the default colors used by the ckeditor5-link package. ---------------------- */
|
|
156
|
+
|
|
157
|
+
--ck-color-link-default: hsl(209, 89%, 33%);
|
|
158
|
+
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
html[data-theme='dark'] {
|
|
162
|
+
|
|
163
|
+
--ck-scroll-track-background:#3d3d57;
|
|
164
|
+
--ck-scroll-thumb-background:#181826;
|
|
165
|
+
--ck-scroll-thumb-border-color:rgb(70,70,70);
|
|
166
|
+
--ck-scroll-thumb-hover-background:#202033;
|
|
167
|
+
--ck-scroll-thumb-active-background:#2b2b45;
|
|
168
|
+
|
|
169
|
+
--ck-color-editor-base-text:rgb(236, 236, 236);
|
|
170
|
+
/* Overrides the border radius setting in the theme. */
|
|
171
|
+
--ck-border-radius: 4px;
|
|
172
|
+
|
|
173
|
+
/* Helper variables to avoid duplication in the colors. */
|
|
174
|
+
--ck-color-base-border: #4A4A6A;
|
|
175
|
+
/* --ck-color-base-background:#212134; */
|
|
176
|
+
/* --ck-color-base-background:#292943; */
|
|
177
|
+
--ck-color-base-background:#27273e;
|
|
178
|
+
--ck-custom-background: #181826;
|
|
179
|
+
--ck-custom-foreground: #26263b;
|
|
180
|
+
--ck-custom-border: #4A4A6A;
|
|
181
|
+
--ck-custom-white: hsl(0, 0%, 100%);
|
|
182
|
+
|
|
183
|
+
--ck-color-focus-outer-shadow:#212134;
|
|
184
|
+
|
|
185
|
+
--ck-color-base-focus: #bbbaf1;
|
|
186
|
+
--ck-color-base-active: #8280fc;
|
|
187
|
+
--ck-color-base-active-focus: #7B79FF;
|
|
188
|
+
/* -- Overrides generic colors. ------------------------------------------------------------- */
|
|
189
|
+
|
|
190
|
+
--ck-color-base-foreground: var(--ck-custom-background);
|
|
191
|
+
--ck-color-focus-border: #6765bd;
|
|
192
|
+
--ck-color-text: hsl(0, 0%, 93%);
|
|
193
|
+
--ck-color-shadow-drop: hsla(0, 0%, 0%, 0.2);
|
|
194
|
+
--ck-color-shadow-inner: hsla(0, 0%, 0%, 0.1);
|
|
195
|
+
|
|
196
|
+
/* -- Overrides the default .ck-button class colors. ---------------------------------------- */
|
|
197
|
+
|
|
198
|
+
--ck-color-button-default-background: var(--ck-custom-background);
|
|
199
|
+
--ck-color-button-default-hover-background: #262630;
|
|
200
|
+
--ck-color-button-default-active-background: #7B79FF;
|
|
201
|
+
--ck-color-button-default-active-shadow: #7B79FF;
|
|
202
|
+
--ck-color-button-default-disabled-background: var(--ck-custom-background);
|
|
203
|
+
|
|
204
|
+
--ck-color-button-on-background: #7776da;
|
|
205
|
+
--ck-color-button-on-hover-background: #7B79FF;
|
|
206
|
+
--ck-color-button-on-active-background: #8280fc;
|
|
207
|
+
--ck-color-button-on-active-shadow: #807ed3;
|
|
208
|
+
--ck-color-button-on-disabled-background: var(--ck-custom-foreground);
|
|
209
|
+
|
|
210
|
+
--ck-color-button-action-background: hsl(168, 76%, 42%);
|
|
211
|
+
--ck-color-button-action-hover-background: hsl(168, 76%, 38%);
|
|
212
|
+
--ck-color-button-action-active-background: hsl(168, 76%, 36%);
|
|
213
|
+
--ck-color-button-action-active-shadow: hsl(168, 75%, 34%);
|
|
214
|
+
--ck-color-button-action-disabled-background: hsl(168, 76%, 42%);
|
|
215
|
+
--ck-color-button-action-text: var(--ck-custom-white);
|
|
216
|
+
|
|
217
|
+
--ck-color-button-save: hsl(120, 100%, 46%);
|
|
218
|
+
--ck-color-button-cancel: hsl(15, 100%, 56%);
|
|
219
|
+
|
|
220
|
+
/* -- Overrides the default .ck-dropdown class colors. -------------------------------------- */
|
|
221
|
+
|
|
222
|
+
--ck-color-dropdown-panel-background: var(--ck-custom-background);
|
|
223
|
+
--ck-color-dropdown-panel-border: var(--ck-custom-foreground);
|
|
224
|
+
|
|
225
|
+
/* -- Overrides the default .ck-splitbutton class colors. ----------------------------------- */
|
|
226
|
+
|
|
227
|
+
--ck-color-split-button-hover-background: var(--ck-color-button-default-hover-background);
|
|
228
|
+
--ck-color-split-button-hover-border: var(--ck-custom-foreground);
|
|
229
|
+
|
|
230
|
+
/* -- Overrides the default .ck-input class colors. ----------------------------------------- */
|
|
231
|
+
|
|
232
|
+
--ck-color-input-background: var(--ck-custom-background);
|
|
233
|
+
--ck-color-input-border: hsl(257, 3%, 43%);
|
|
234
|
+
--ck-color-input-text: hsl(0, 0%, 98%);
|
|
235
|
+
--ck-color-input-disabled-background: hsl(255, 4%, 21%);
|
|
236
|
+
--ck-color-input-disabled-border: hsl(250, 3%, 38%);
|
|
237
|
+
--ck-color-input-disabled-text: hsl(0, 0%, 78%);
|
|
238
|
+
|
|
239
|
+
/* -- Overrides the default .ck-labeled-field-view class colors. ---------------------------- */
|
|
240
|
+
|
|
241
|
+
--ck-color-labeled-field-label-background: var(--ck-custom-background);
|
|
242
|
+
|
|
243
|
+
/* -- Overrides the default .ck-list class colors. ------------------------------------------ */
|
|
244
|
+
|
|
245
|
+
--ck-color-list-background: var(--ck-custom-background);
|
|
246
|
+
--ck-color-list-button-hover-background: #3d3d56;
|
|
247
|
+
--ck-color-list-button-on-background: var(--ck-color-base-active);
|
|
248
|
+
--ck-color-list-button-on-background-focus: var(--ck-color-base-active-focus);
|
|
249
|
+
--ck-color-list-button-on-text: #ffffff;
|
|
250
|
+
|
|
251
|
+
/* -- Overrides the default .ck-balloon-panel class colors. --------------------------------- */
|
|
252
|
+
|
|
253
|
+
--ck-color-panel-background: var(--ck-custom-background);
|
|
254
|
+
--ck-color-panel-border: var(--ck-custom-border);
|
|
255
|
+
|
|
256
|
+
/* -- Overrides the default .ck-toolbar class colors. --------------------------------------- */
|
|
257
|
+
|
|
258
|
+
--ck-color-toolbar-background: var(--ck-custom-background);
|
|
259
|
+
--ck-color-toolbar-border: var(--ck-custom-border);
|
|
260
|
+
|
|
261
|
+
/* -- Overrides the default .ck-tooltip class colors. --------------------------------------- */
|
|
262
|
+
|
|
263
|
+
--ck-color-tooltip-background: #3a3955;
|
|
264
|
+
--ck-color-tooltip-text: hsl(0, 0%, 93%);
|
|
265
|
+
|
|
266
|
+
/* -- Overrides the default colors used by the ckeditor5-image package. --------------------- */
|
|
267
|
+
|
|
268
|
+
--ck-color-image-caption-background: hsl(0, 0%, 97%);
|
|
269
|
+
--ck-color-image-caption-text: hsl(0, 0%, 20%);
|
|
270
|
+
|
|
271
|
+
/* -- Overrides the default colors used by the ckeditor5-widget package. -------------------- */
|
|
272
|
+
|
|
273
|
+
--ck-color-widget-blurred-border: #7c7c96;
|
|
274
|
+
--ck-color-widget-hover-border: #666687;
|
|
275
|
+
--ck-color-widget-editable-focus-background: var(--ck-custom-white);
|
|
276
|
+
|
|
277
|
+
/* -- Overrides the default colors used by the ckeditor5-link package. ---------------------- */
|
|
278
|
+
|
|
279
|
+
--ck-color-link-default: hsl(216, 100%, 75%);
|
|
280
|
+
}
|
|
281
|
+
`;
|
|
282
|
+
export default theme
|
package/package.json
CHANGED