remons-markdown-editor 1.0.0-beta.10 → 1.0.0-beta.11
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/dist/index.cjs.map +1 -1
- package/dist/index.css +111 -59
- package/dist/index.js.map +1 -1
- package/package.json +79 -79
- package/readme.md +309 -309
package/dist/index.css
CHANGED
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
padding: 4px;
|
|
3
3
|
display: block;
|
|
4
4
|
min-width: 200px;
|
|
5
|
-
background:
|
|
6
|
-
border: 1px solid
|
|
5
|
+
background: var(--remons-md-editor-bg-picker);
|
|
6
|
+
border: 1px solid var(--remons-md-editor-color-border-light);
|
|
7
7
|
border-radius: 6px;
|
|
8
8
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
|
9
9
|
}
|
|
@@ -16,19 +16,19 @@
|
|
|
16
16
|
.index-module__grid___tCZ-r .index-module__cell___vTDQz {
|
|
17
17
|
width: 24px;
|
|
18
18
|
height: 24px;
|
|
19
|
-
border: 1px solid
|
|
19
|
+
border: 1px solid var(--remons-md-editor-color-border-light);
|
|
20
20
|
border-radius: 2px;
|
|
21
21
|
background: transparent;
|
|
22
22
|
cursor: pointer;
|
|
23
23
|
transition: all 0.1s ease;
|
|
24
24
|
}
|
|
25
25
|
.index-module__grid___tCZ-r .index-module__cell___vTDQz.index-module__cellActive___0EYvU {
|
|
26
|
-
border-color:
|
|
27
|
-
background:
|
|
26
|
+
border-color: var(--remons-md-editor-color-cell-active);
|
|
27
|
+
background: var(--remons-md-editor-bg-cell-active);
|
|
28
28
|
}
|
|
29
29
|
.index-module__hint___dTObk {
|
|
30
30
|
padding: 12px 16px;
|
|
31
|
-
color:
|
|
31
|
+
color: var(--remons-md-editor-color-hint);
|
|
32
32
|
font-size: 12px;
|
|
33
33
|
text-align: center;
|
|
34
34
|
cursor: pointer;
|
|
@@ -36,47 +36,98 @@
|
|
|
36
36
|
.index-module__label___2CmK1 {
|
|
37
37
|
margin-top: 8px;
|
|
38
38
|
font-size: 13px;
|
|
39
|
-
color:
|
|
39
|
+
color: var(--remons-md-editor-color-label);
|
|
40
40
|
font-weight: 500;
|
|
41
41
|
min-height: 20px;
|
|
42
42
|
text-align: center;
|
|
43
43
|
}
|
|
44
|
-
html,
|
|
45
|
-
body {
|
|
46
|
-
margin: 0;
|
|
47
|
-
padding: 0;
|
|
48
|
-
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
|
49
|
-
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
|
50
|
-
sans-serif;
|
|
51
|
-
-webkit-font-smoothing: antialiased;
|
|
52
|
-
-moz-osx-font-smoothing: grayscale;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
:
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
[data-theme="
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
--
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
44
|
+
html,
|
|
45
|
+
body {
|
|
46
|
+
margin: 0;
|
|
47
|
+
padding: 0;
|
|
48
|
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
|
49
|
+
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
|
50
|
+
sans-serif;
|
|
51
|
+
-webkit-font-smoothing: antialiased;
|
|
52
|
+
-moz-osx-font-smoothing: grayscale;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
:where(.css-dev-only-do-not-override-19u5a7b).ant-btn:not(:disabled):not(.ant-btn-disabled):hover {
|
|
56
|
+
border: none !important;
|
|
57
|
+
background-color: var(--remons-md-editor-bg-hover) !important;
|
|
58
|
+
color: var(--remons-md-editor-color-text-hover) !important;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
#markdown-editor {
|
|
62
|
+
height: 100vh;
|
|
63
|
+
width: 100vw;
|
|
64
|
+
overflow: hidden;
|
|
65
|
+
border-radius: 12px;
|
|
66
|
+
background: var(--remons-md-editor-bg-primary);
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
/* ===== CSS 自定义属性(主题变量) ===== */
|
|
70
|
+
/* 浅色主题(默认) */
|
|
71
|
+
:root,
|
|
72
|
+
[data-theme="light"] {
|
|
73
|
+
/* 背景色 */
|
|
74
|
+
--remons-md-editor-bg-primary: #f3f3f3;
|
|
75
|
+
--remons-md-editor-bg-white: rgba(255, 255, 255, 0.6);
|
|
76
|
+
--remons-md-editor-bg-hover: #e1e4e8;
|
|
77
|
+
--remons-md-editor-bg-active: #d0d7de;
|
|
78
|
+
--remons-md-editor-bg-fullscreen: #fff;
|
|
79
|
+
|
|
80
|
+
/* 文字颜色 */
|
|
81
|
+
--remons-md-editor-color-text: #24292f;
|
|
82
|
+
--remons-md-editor-color-text-hover: #0969da;
|
|
83
|
+
|
|
84
|
+
/* 边框 */
|
|
85
|
+
--remons-md-editor-color-border: rgba(255, 255, 255, 0.8);
|
|
86
|
+
--remons-md-editor-color-border-light: #d0d7de;
|
|
87
|
+
|
|
88
|
+
/* 焦点 */
|
|
89
|
+
--remons-md-editor-color-focus: #0969da;
|
|
90
|
+
--remons-md-editor-color-focus-shadow: rgba(9, 105, 218, 0.1);
|
|
91
|
+
|
|
92
|
+
/* 工具选择器 */
|
|
93
|
+
--remons-md-editor-bg-picker: #fff;
|
|
94
|
+
--remons-md-editor-bg-cell-active: #ddf4ff;
|
|
95
|
+
--remons-md-editor-color-cell-active: #91caff;
|
|
96
|
+
--remons-md-editor-color-hint: #999;
|
|
97
|
+
--remons-md-editor-color-label: #666;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
/* ===== 深色主题 ===== */
|
|
101
|
+
[data-theme="dark"] {
|
|
102
|
+
/* 背景色 */
|
|
103
|
+
--remons-md-editor-bg-primary: #1a1d23;
|
|
104
|
+
--remons-md-editor-bg-white: rgba(46, 51, 80, 0.8);
|
|
105
|
+
--remons-md-editor-bg-hover: #4a5163;
|
|
106
|
+
--remons-md-editor-bg-active: #5a6278;
|
|
107
|
+
--remons-md-editor-bg-fullscreen: #1a1d23;
|
|
108
|
+
|
|
109
|
+
/* 文字颜色 */
|
|
110
|
+
--remons-md-editor-color-text: #c9d1d9;
|
|
111
|
+
--remons-md-editor-color-text-hover: #58a6ff;
|
|
112
|
+
|
|
113
|
+
/* 边框 */
|
|
114
|
+
--remons-md-editor-color-border: rgba(255, 255, 255, 0.1);
|
|
115
|
+
--remons-md-editor-color-border-light: #3a3f4b;
|
|
116
|
+
|
|
117
|
+
/* 焦点 */
|
|
118
|
+
--remons-md-editor-color-focus: #58a6ff;
|
|
119
|
+
--remons-md-editor-color-focus-shadow: rgba(88, 166, 255, 0.15);
|
|
120
|
+
|
|
121
|
+
/* 工具选择器 */
|
|
122
|
+
--remons-md-editor-bg-picker: #2e3350;
|
|
123
|
+
--remons-md-editor-bg-cell-active: #1a3a5c;
|
|
124
|
+
--remons-md-editor-color-cell-active: #58a6ff;
|
|
125
|
+
--remons-md-editor-color-hint: #8b949e;
|
|
126
|
+
--remons-md-editor-color-label: #8b949e;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
.ant-anchor-link-title {
|
|
130
|
+
white-space: inherit !important;
|
|
80
131
|
}@font-face {
|
|
81
132
|
font-family: 'Inter';
|
|
82
133
|
font-style: normal;
|
|
@@ -137,7 +188,6 @@ body {
|
|
|
137
188
|
height: 100%;
|
|
138
189
|
display: flex;
|
|
139
190
|
flex-direction: column;
|
|
140
|
-
background: #f3f3f3;
|
|
141
191
|
border: 1px solid var(--markdown-editor-color-border);
|
|
142
192
|
}
|
|
143
193
|
.markdown-editor-app.fullscreen {
|
|
@@ -147,7 +197,7 @@ body {
|
|
|
147
197
|
right: 0;
|
|
148
198
|
bottom: 0;
|
|
149
199
|
z-index: 9999;
|
|
150
|
-
background:
|
|
200
|
+
background: var(--remons-md-editor-bg-fullscreen);
|
|
151
201
|
width: 100vw;
|
|
152
202
|
height: 100vh;
|
|
153
203
|
}
|
|
@@ -156,8 +206,8 @@ body {
|
|
|
156
206
|
display: flex;
|
|
157
207
|
align-items: center;
|
|
158
208
|
padding: 4px 8px;
|
|
159
|
-
background: var(--
|
|
160
|
-
border-bottom: 1px solid
|
|
209
|
+
background: var(--remons-md-editor-bg-white);
|
|
210
|
+
border-bottom: 1px solid var(--remons-md-editor-color-border-light);
|
|
161
211
|
gap: 4px;
|
|
162
212
|
overflow-x: auto;
|
|
163
213
|
}
|
|
@@ -179,7 +229,7 @@ body {
|
|
|
179
229
|
cursor: pointer;
|
|
180
230
|
font-size: 16px;
|
|
181
231
|
font-weight: 500;
|
|
182
|
-
color:
|
|
232
|
+
color: var(--remons-md-editor-color-text);
|
|
183
233
|
transition: background-color 0.15s, color 0.15s;
|
|
184
234
|
white-space: nowrap;
|
|
185
235
|
}
|
|
@@ -188,11 +238,11 @@ body {
|
|
|
188
238
|
height: 16px;
|
|
189
239
|
}
|
|
190
240
|
.toolbar-button:hover {
|
|
191
|
-
background:
|
|
192
|
-
color:
|
|
241
|
+
background: var(--remons-md-editor-bg-hover);
|
|
242
|
+
color: var(--remons-md-editor-color-text-hover);
|
|
193
243
|
}
|
|
194
244
|
.toolbar-button:active {
|
|
195
|
-
background:
|
|
245
|
+
background: var(--remons-md-editor-bg-active);
|
|
196
246
|
}
|
|
197
247
|
.toolbar-button.ant-btn {
|
|
198
248
|
min-width: 32px;
|
|
@@ -202,8 +252,8 @@ body {
|
|
|
202
252
|
box-shadow: none !important;
|
|
203
253
|
}
|
|
204
254
|
.toolbar-button.ant-btn:hover {
|
|
205
|
-
background:
|
|
206
|
-
color:
|
|
255
|
+
background: var(--remons-md-editor-bg-hover);
|
|
256
|
+
color: var(--remons-md-editor-color-text-hover);
|
|
207
257
|
border-color: transparent !important;
|
|
208
258
|
box-shadow: none !important;
|
|
209
259
|
}
|
|
@@ -213,11 +263,13 @@ body {
|
|
|
213
263
|
}
|
|
214
264
|
:where(.css-dev-only-do-not-override-u6izyw).ant-btn:not(:disabled):not(.ant-btn-disabled):hover {
|
|
215
265
|
border: none !important;
|
|
266
|
+
background-color: var(--remons-md-editor-bg-hover) !important;
|
|
267
|
+
color: var(--remons-md-editor-color-text-hover) !important;
|
|
216
268
|
}
|
|
217
269
|
.toolbar-separator {
|
|
218
270
|
width: 1px;
|
|
219
271
|
height: 24px;
|
|
220
|
-
background:
|
|
272
|
+
background: var(--remons-md-editor-color-border-light);
|
|
221
273
|
margin: 0 4px;
|
|
222
274
|
}
|
|
223
275
|
.split-panels {
|
|
@@ -248,7 +300,7 @@ body {
|
|
|
248
300
|
.md-container {
|
|
249
301
|
margin: 16px 0;
|
|
250
302
|
border-radius: 6px;
|
|
251
|
-
border: 1px solid
|
|
303
|
+
border: 1px solid var(--remons-md-editor-color-border-light);
|
|
252
304
|
overflow: hidden;
|
|
253
305
|
}
|
|
254
306
|
/* 编辑弹窗样式 */
|
|
@@ -263,20 +315,20 @@ body {
|
|
|
263
315
|
margin-bottom: 6px;
|
|
264
316
|
font-size: 14px;
|
|
265
317
|
font-weight: 500;
|
|
266
|
-
color:
|
|
318
|
+
color: var(--remons-md-editor-color-text);
|
|
267
319
|
}
|
|
268
320
|
.edit-dialog-input {
|
|
269
321
|
width: 100%;
|
|
270
322
|
padding: 6px 10px;
|
|
271
323
|
font-size: 14px;
|
|
272
|
-
border: 1px solid
|
|
324
|
+
border: 1px solid var(--remons-md-editor-color-border-light);
|
|
273
325
|
border-radius: 6px;
|
|
274
326
|
outline: none;
|
|
275
327
|
transition: border-color 0.15s;
|
|
276
328
|
}
|
|
277
329
|
.edit-dialog-input:focus {
|
|
278
|
-
border-color:
|
|
279
|
-
box-shadow: 0 0 0 3px
|
|
330
|
+
border-color: var(--remons-md-editor-color-focus);
|
|
331
|
+
box-shadow: 0 0 0 3px var(--remons-md-editor-color-focus-shadow);
|
|
280
332
|
}
|
|
281
333
|
.edit-dialog-textarea {
|
|
282
334
|
resize: vertical;
|