vue-editify 0.2.3 → 0.2.5
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/examples/App.vue +35 -10
- package/lib/editify/editify.vue.d.ts +9 -0
- package/lib/editify/props.d.ts +4 -0
- package/lib/editify.es.js +29 -8
- package/lib/editify.umd.js +2 -2
- package/lib/index.d.ts +10 -1
- package/package.json +1 -1
- package/src/components/button/button.less +16 -16
- package/src/components/checkbox/checkbox.less +14 -14
- package/src/components/colors/colors.less +9 -9
- package/src/components/insertImage/insertImage.less +13 -13
- package/src/components/insertLink/insertLink.less +9 -9
- package/src/components/insertTable/insertTable.less +4 -4
- package/src/components/insertVideo/insertVideo.less +13 -13
- package/src/components/layer/layer.less +6 -6
- package/src/components/menu/menu.less +7 -7
- package/src/components/toolbar/toolbar.less +10 -10
- package/src/components/tooltip/tooltip.less +1 -1
- package/src/components/tooltip/tooltip.vue +4 -2
- package/src/components/triangle/triangle.less +11 -8
- package/src/css/hljs.less +8 -8
- package/src/css/var.less +81 -0
- package/src/editify/editify.less +56 -55
- package/src/editify/editify.vue +17 -0
- package/src/editify/props.ts +5 -0
- package/src/index.ts +3 -1
- package/src/plugins/attachment/insertAttachment/insertAttachment.less +19 -19
- package/src/plugins/mathformula/insertMathformula/insertMathformula.less +9 -9
- package/vite.config.ts +1 -2
- package/src/css/base.less +0 -32
@@ -20,7 +20,7 @@
|
|
20
20
|
border-radius: 2px;
|
21
21
|
left: 0;
|
22
22
|
bottom: 0;
|
23
|
-
transition: left
|
23
|
+
transition: left 300ms;
|
24
24
|
|
25
25
|
&.editify-upload {
|
26
26
|
left: 5px;
|
@@ -34,10 +34,10 @@
|
|
34
34
|
.editify-attachment-header-item {
|
35
35
|
display: block;
|
36
36
|
text-align: center;
|
37
|
-
font-size:
|
38
|
-
color:
|
37
|
+
font-size: var(--font-size);
|
38
|
+
color: var(--editify-font-color);
|
39
39
|
opacity: 0.8;
|
40
|
-
transition: all
|
40
|
+
transition: all 300ms;
|
41
41
|
width: 60px;
|
42
42
|
overflow: hidden;
|
43
43
|
white-space: nowrap;
|
@@ -54,7 +54,7 @@
|
|
54
54
|
|
55
55
|
&.editify-active {
|
56
56
|
opacity: 1;
|
57
|
-
color:
|
57
|
+
color: var(--editify-font-color-dark);
|
58
58
|
}
|
59
59
|
}
|
60
60
|
}
|
@@ -72,18 +72,18 @@
|
|
72
72
|
margin: 0 0 10px 0;
|
73
73
|
padding: 4px 2px;
|
74
74
|
border: none;
|
75
|
-
font-size:
|
76
|
-
color:
|
77
|
-
border-bottom: 1px solid
|
75
|
+
font-size: var(--font-size);
|
76
|
+
color: var(--editify-font-color);
|
77
|
+
border-bottom: 1px solid var(--editify-border-color);
|
78
78
|
line-height: 1.5;
|
79
|
-
transition: border-color
|
79
|
+
transition: border-color 300ms;
|
80
80
|
background-color: transparent;
|
81
81
|
outline: none;
|
82
82
|
box-sizing: border-box;
|
83
83
|
|
84
84
|
&::-webkit-input-placeholder,
|
85
85
|
&::placeholder {
|
86
|
-
color:
|
86
|
+
color: var(--editify-font-color-disabled);
|
87
87
|
font-family: inherit;
|
88
88
|
font-size: inherit;
|
89
89
|
vertical-align: middle;
|
@@ -95,9 +95,9 @@
|
|
95
95
|
justify-content: flex-end;
|
96
96
|
align-items: center;
|
97
97
|
width: 100%;
|
98
|
-
font-size:
|
98
|
+
font-size: var(--font-size);
|
99
99
|
opacity: 0.8;
|
100
|
-
transition: all
|
100
|
+
transition: all 300ms;
|
101
101
|
|
102
102
|
&:hover {
|
103
103
|
cursor: pointer;
|
@@ -122,11 +122,11 @@
|
|
122
122
|
margin: 0;
|
123
123
|
padding: 4px 2px;
|
124
124
|
border: none;
|
125
|
-
font-size:
|
126
|
-
color:
|
127
|
-
border-bottom: 1px solid
|
125
|
+
font-size: var(--font-size);
|
126
|
+
color: var(--editify-font-color);
|
127
|
+
border-bottom: 1px solid var(--editify-border-color);
|
128
128
|
line-height: 1.5;
|
129
|
-
transition: border-color
|
129
|
+
transition: border-color 300ms;
|
130
130
|
background-color: transparent;
|
131
131
|
outline: none;
|
132
132
|
box-sizing: border-box;
|
@@ -134,7 +134,7 @@
|
|
134
134
|
|
135
135
|
&::-webkit-input-placeholder,
|
136
136
|
&::placeholder {
|
137
|
-
color:
|
137
|
+
color: var(--editify-font-color-disabled);
|
138
138
|
font-family: inherit;
|
139
139
|
font-size: inherit;
|
140
140
|
vertical-align: middle;
|
@@ -146,8 +146,8 @@
|
|
146
146
|
font-size: 20px;
|
147
147
|
line-height: 1;
|
148
148
|
opacity: 0.8;
|
149
|
-
transition: all
|
150
|
-
color:
|
149
|
+
transition: all 300ms;
|
150
|
+
color: var(--editify-font-color);
|
151
151
|
border-radius: 2px;
|
152
152
|
padding: 2px;
|
153
153
|
margin-left: 15px;
|
@@ -7,8 +7,8 @@
|
|
7
7
|
display: block;
|
8
8
|
text-align: left;
|
9
9
|
margin-bottom: 10px;
|
10
|
-
font-size:
|
11
|
-
color:
|
10
|
+
font-size: var(--font-size);
|
11
|
+
color: var(--editify-font-color);
|
12
12
|
}
|
13
13
|
|
14
14
|
.editify-mathformula-textarea {
|
@@ -16,7 +16,7 @@
|
|
16
16
|
appearance: none;
|
17
17
|
-webkit-appearance: none;
|
18
18
|
-moz-appearance: none;
|
19
|
-
border: 1px solid
|
19
|
+
border: 1px solid var(--editify-border-color);
|
20
20
|
width: 100%;
|
21
21
|
height: 100px;
|
22
22
|
overflow-x: hidden;
|
@@ -24,10 +24,10 @@
|
|
24
24
|
border-radius: 2px;
|
25
25
|
margin: 0;
|
26
26
|
padding: 6px;
|
27
|
-
font-size:
|
28
|
-
color:
|
27
|
+
font-size: var(--font-size);
|
28
|
+
color: var(--editify-font-color);
|
29
29
|
line-height: 1.5;
|
30
|
-
transition: border-color
|
30
|
+
transition: border-color 300ms;
|
31
31
|
background-color: transparent;
|
32
32
|
outline: none;
|
33
33
|
box-sizing: border-box;
|
@@ -36,7 +36,7 @@
|
|
36
36
|
|
37
37
|
&::-webkit-input-placeholder,
|
38
38
|
&::placeholder {
|
39
|
-
color:
|
39
|
+
color: var(--editify-font-color-disabled);
|
40
40
|
font-family: inherit;
|
41
41
|
font-size: inherit;
|
42
42
|
vertical-align: middle;
|
@@ -53,8 +53,8 @@
|
|
53
53
|
span {
|
54
54
|
cursor: pointer;
|
55
55
|
opacity: 0.8;
|
56
|
-
transition: all
|
57
|
-
font-size:
|
56
|
+
transition: all 300ms;
|
57
|
+
font-size: var(--font-size);
|
58
58
|
|
59
59
|
&:hover {
|
60
60
|
opacity: 1;
|
package/vite.config.ts
CHANGED
package/src/css/base.less
DELETED
@@ -1,32 +0,0 @@
|
|
1
|
-
//三角图标大小
|
2
|
-
@triangle-size: 6px;
|
3
|
-
//编辑器内的默认字体大小
|
4
|
-
@font-size: 14px;
|
5
|
-
//较小的字体(工具提示等)
|
6
|
-
@font-size-small: 12px;
|
7
|
-
//字体颜色
|
8
|
-
@font-color: #555;
|
9
|
-
//较浅的字体颜色(副文本颜色)
|
10
|
-
@font-color-light: #888;
|
11
|
-
//更浅的字体颜色(placeholder和禁用字体颜色)
|
12
|
-
@font-color-disabled: #bbb;
|
13
|
-
//较深的字体颜色(编辑器内容区域字体颜色)
|
14
|
-
@font-color-dark: #333;
|
15
|
-
//链接字体颜色
|
16
|
-
@font-color-link: #079457;
|
17
|
-
//链接字体悬浮色
|
18
|
-
@font-color-link-dark: #05683d;
|
19
|
-
//边框颜色
|
20
|
-
@border-color: #dfdfdf;
|
21
|
-
//默认背景色
|
22
|
-
@background: #fff;
|
23
|
-
//较深的背景色
|
24
|
-
@background-dark: #f7f8fa;
|
25
|
-
//更深的背景色
|
26
|
-
@background-darker: #ebedf0;
|
27
|
-
//代码块背景色
|
28
|
-
@pre-background: #f2f6fb;
|
29
|
-
//反色调字体颜色
|
30
|
-
@reverse-color: #fff;
|
31
|
-
//反色调背景色
|
32
|
-
@reverse-background: #000;
|