l-min-components 1.0.800 → 1.0.805
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/package.json
CHANGED
|
@@ -49,6 +49,33 @@ export const ControlInput = styled.input`
|
|
|
49
49
|
}
|
|
50
50
|
`;
|
|
51
51
|
|
|
52
|
+
// export const DropDownContent = styled.ul`
|
|
53
|
+
// position: absolute;
|
|
54
|
+
// top: 35px;
|
|
55
|
+
// left: 0;
|
|
56
|
+
// list-style-type: none;
|
|
57
|
+
// padding-left: 25px;
|
|
58
|
+
// padding-bottom: 0px;
|
|
59
|
+
// width: 100%;
|
|
60
|
+
// max-height: 200px;
|
|
61
|
+
// overflow-y: scroll;
|
|
62
|
+
// scrollbar-width: thin;
|
|
63
|
+
// scrollbar-color: transparent transparent;
|
|
64
|
+
|
|
65
|
+
// &::-webkit-scrollbar {
|
|
66
|
+
// width: 6px;
|
|
67
|
+
// background-color: transparent;
|
|
68
|
+
// }
|
|
69
|
+
|
|
70
|
+
// &::-webkit-scrollbar-thumb {
|
|
71
|
+
// background-color: transparent;
|
|
72
|
+
// }
|
|
73
|
+
|
|
74
|
+
// .loader {
|
|
75
|
+
// margin-bottom: 20px;
|
|
76
|
+
// }
|
|
77
|
+
// `;
|
|
78
|
+
|
|
52
79
|
export const DropDownContent = styled.ul`
|
|
53
80
|
position: absolute;
|
|
54
81
|
top: 35px;
|
|
@@ -57,18 +84,27 @@ export const DropDownContent = styled.ul`
|
|
|
57
84
|
padding-left: 25px;
|
|
58
85
|
padding-bottom: 0px;
|
|
59
86
|
width: 100%;
|
|
60
|
-
max-height:
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
scrollbar-color: transparent transparent;
|
|
87
|
+
max-height: 100px;
|
|
88
|
+
/* height: 142px; */
|
|
89
|
+
overflow-y: auto;
|
|
64
90
|
|
|
91
|
+
/* Added for Firefox */
|
|
92
|
+
scrollbar-width: thin;
|
|
93
|
+
scrollbar-color: #888 #f5f7f7;
|
|
94
|
+
|
|
95
|
+
/* Added for Chrome, Safari, and Opera */
|
|
65
96
|
&::-webkit-scrollbar {
|
|
66
|
-
width: 6px;
|
|
67
|
-
background-color: transparent;
|
|
97
|
+
width: 6px;
|
|
68
98
|
}
|
|
69
99
|
|
|
70
100
|
&::-webkit-scrollbar-thumb {
|
|
71
|
-
background
|
|
101
|
+
background: #888;
|
|
102
|
+
border-radius: 10px;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
&::-webkit-scrollbar-track {
|
|
106
|
+
background: #f5f7f7;
|
|
107
|
+
border-radius: 10px;
|
|
72
108
|
}
|
|
73
109
|
|
|
74
110
|
.loader {
|
|
@@ -76,6 +112,7 @@ export const DropDownContent = styled.ul`
|
|
|
76
112
|
}
|
|
77
113
|
`;
|
|
78
114
|
|
|
115
|
+
|
|
79
116
|
export const DropDownItem = styled.li`
|
|
80
117
|
font-family: "Nunito", sans-serif;
|
|
81
118
|
padding: 4px 10px;
|
|
@@ -6,14 +6,14 @@
|
|
|
6
6
|
.editor {
|
|
7
7
|
display: flex;
|
|
8
8
|
gap: 13px;
|
|
9
|
-
|
|
9
|
+
|
|
10
10
|
.editor-wrapper {
|
|
11
11
|
width: 100%;
|
|
12
12
|
position: relative;
|
|
13
13
|
background: #e5e5e5;
|
|
14
14
|
border-radius: 15px;
|
|
15
15
|
|
|
16
|
-
.emoji_picker{
|
|
16
|
+
.emoji_picker {
|
|
17
17
|
position: absolute;
|
|
18
18
|
z-index: 1;
|
|
19
19
|
transform: translate(10px, 10px);
|
|
@@ -22,20 +22,20 @@
|
|
|
22
22
|
|
|
23
23
|
@media only screen and (max-width: 1700px) {
|
|
24
24
|
margin-top: -19%;
|
|
25
|
-
}
|
|
25
|
+
}
|
|
26
26
|
@media only screen and (max-width: 1600px) {
|
|
27
27
|
margin-top: -21%;
|
|
28
|
-
}
|
|
28
|
+
}
|
|
29
29
|
@media only screen and (max-width: 1500px) {
|
|
30
30
|
margin-top: -24%;
|
|
31
|
-
}
|
|
31
|
+
}
|
|
32
32
|
}
|
|
33
33
|
|
|
34
|
-
.editor_area{
|
|
34
|
+
.editor_area {
|
|
35
35
|
background: #fff;
|
|
36
36
|
border-radius: 15px;
|
|
37
37
|
|
|
38
|
-
input{
|
|
38
|
+
input {
|
|
39
39
|
border-radius: 12px;
|
|
40
40
|
background: #fff;
|
|
41
41
|
outline: none;
|
|
@@ -47,7 +47,6 @@
|
|
|
47
47
|
padding-left: 30px;
|
|
48
48
|
border: "none";
|
|
49
49
|
margin-top: 20px;
|
|
50
|
-
|
|
51
50
|
}
|
|
52
51
|
.editable {
|
|
53
52
|
border-radius: 25px;
|
|
@@ -56,16 +55,15 @@
|
|
|
56
55
|
// background: #e5e5e5;
|
|
57
56
|
min-height: 193px;
|
|
58
57
|
}
|
|
59
|
-
|
|
60
58
|
}
|
|
61
|
-
|
|
62
|
-
.bottom{
|
|
59
|
+
|
|
60
|
+
.bottom {
|
|
63
61
|
display: flex;
|
|
64
62
|
justify-content: center;
|
|
65
63
|
align-items: center;
|
|
66
64
|
width: 80%;
|
|
67
65
|
|
|
68
|
-
.emoji_button{
|
|
66
|
+
.emoji_button {
|
|
69
67
|
background-color: white;
|
|
70
68
|
border: none;
|
|
71
69
|
cursor: pointer;
|
|
@@ -74,183 +72,174 @@
|
|
|
74
72
|
margin-right: 20px;
|
|
75
73
|
border-radius: 50%;
|
|
76
74
|
// opacity: 0.6;
|
|
77
|
-
|
|
78
|
-
|
|
79
75
|
}
|
|
80
76
|
|
|
81
|
-
.emoji_button_active{
|
|
77
|
+
.emoji_button_active {
|
|
82
78
|
background-color: #fff;
|
|
83
|
-
color: #
|
|
79
|
+
color: #00c2c2;
|
|
84
80
|
border: none;
|
|
85
81
|
cursor: pointer;
|
|
86
82
|
padding: 3px;
|
|
87
83
|
margin-top: 6px;
|
|
88
84
|
margin-right: 20px;
|
|
89
85
|
// border-radius: 50%;
|
|
90
|
-
svg path{
|
|
91
|
-
stroke: #
|
|
86
|
+
svg path {
|
|
87
|
+
stroke: #00c2c2;
|
|
92
88
|
}
|
|
93
89
|
// border-radius: 20px;
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
90
|
}
|
|
98
91
|
|
|
99
|
-
|
|
100
|
-
& > button{
|
|
92
|
+
& > button {
|
|
101
93
|
@media only screen and (max-width: 1400px) {
|
|
102
94
|
font-size: 17px !important;
|
|
103
95
|
font-weight: 700;
|
|
104
|
-
}
|
|
96
|
+
}
|
|
105
97
|
@media only screen and (max-width: 1366px) {
|
|
106
98
|
font-size: 15px !important;
|
|
107
99
|
font-weight: 600;
|
|
108
|
-
}
|
|
100
|
+
}
|
|
109
101
|
}
|
|
110
102
|
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
103
|
+
.tool-bar {
|
|
104
|
+
display: flex;
|
|
105
|
+
margin: auto;
|
|
106
|
+
margin-top: 16px;
|
|
107
|
+
margin-right: 20px;
|
|
108
|
+
padding: 16px;
|
|
109
|
+
background: #fff;
|
|
110
|
+
border: 0px solid c.$neutral-20;
|
|
111
|
+
border-radius: 12px;
|
|
112
|
+
width: 70%;
|
|
113
|
+
height: 60px;
|
|
114
|
+
// gap: 5px;
|
|
125
115
|
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
// grid-template-columns: 1fr 1fr;
|
|
129
|
-
gap: 2px;
|
|
130
|
-
& > div {
|
|
116
|
+
align-items: center;
|
|
117
|
+
.list {
|
|
131
118
|
display: grid;
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
119
|
+
// grid-template-columns: 1fr 1fr;
|
|
120
|
+
gap: 2px;
|
|
121
|
+
& > div {
|
|
122
|
+
display: grid;
|
|
123
|
+
cursor: pointer;
|
|
124
|
+
}
|
|
125
|
+
.active {
|
|
126
|
+
color: #00c2c2;
|
|
127
|
+
svg path {
|
|
128
|
+
// stroke: #00C2C2;
|
|
129
|
+
stroke: #00c2c2;
|
|
130
|
+
}
|
|
139
131
|
}
|
|
140
132
|
}
|
|
141
|
-
}
|
|
142
133
|
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
134
|
+
.active {
|
|
135
|
+
opacity: 1;
|
|
136
|
+
}
|
|
146
137
|
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
138
|
+
.font {
|
|
139
|
+
.font-dd {
|
|
140
|
+
div {
|
|
141
|
+
border-width: 0px;
|
|
142
|
+
min-width: 215px;
|
|
143
|
+
}
|
|
144
|
+
p {
|
|
145
|
+
margin-right: 25px;
|
|
146
|
+
font-weight: 700;
|
|
147
|
+
}
|
|
156
148
|
}
|
|
157
149
|
}
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
150
|
+
.font-size {
|
|
151
|
+
.sizes {
|
|
152
|
+
div {
|
|
153
|
+
border-width: 0px;
|
|
154
|
+
// z-index: 999;
|
|
155
|
+
.iVkqGn {
|
|
156
|
+
padding: 11px 10px;
|
|
157
|
+
}
|
|
158
|
+
}
|
|
159
|
+
p {
|
|
160
|
+
margin-right: 25px;
|
|
161
|
+
font-weight: 700;
|
|
166
162
|
}
|
|
167
|
-
}
|
|
168
|
-
p {
|
|
169
|
-
margin-right: 25px;
|
|
170
|
-
font-weight: 700;
|
|
171
163
|
}
|
|
172
164
|
}
|
|
173
|
-
}
|
|
174
|
-
align-items: center;
|
|
175
|
-
& > div {
|
|
176
|
-
border-right: 1px solid c.$neutral-10;
|
|
177
|
-
padding: 0 6px;
|
|
178
|
-
}
|
|
179
|
-
.font-style {
|
|
180
|
-
display: flex;
|
|
181
|
-
gap: 5px;
|
|
182
165
|
& > div {
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
// svg{
|
|
186
|
-
// fill: #00C2C2;
|
|
187
|
-
// }
|
|
166
|
+
border-right: 1px solid c.$neutral-10;
|
|
167
|
+
padding: 0 6px;
|
|
188
168
|
}
|
|
169
|
+
.font-style {
|
|
170
|
+
display: flex;
|
|
171
|
+
gap: 5px;
|
|
172
|
+
& > div {
|
|
173
|
+
display: grid;
|
|
174
|
+
cursor: pointer;
|
|
175
|
+
// svg{
|
|
176
|
+
// fill: #00C2C2;
|
|
177
|
+
// }
|
|
178
|
+
}
|
|
189
179
|
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
180
|
+
.active {
|
|
181
|
+
color: #00c2c2;
|
|
182
|
+
svg path {
|
|
183
|
+
// fill: #00C2C2;
|
|
184
|
+
stroke: #00c2c2;
|
|
185
|
+
}
|
|
195
186
|
}
|
|
196
187
|
}
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
188
|
+
.color-box {
|
|
189
|
+
.wrap {
|
|
190
|
+
position: relative;
|
|
191
|
+
cursor: pointer;
|
|
192
|
+
display: flex;
|
|
193
|
+
align-items: center;
|
|
194
|
+
gap: 7px;
|
|
195
|
+
input {
|
|
196
|
+
position: absolute;
|
|
197
|
+
pointer-events: none;
|
|
198
|
+
opacity: 0;
|
|
199
|
+
}
|
|
200
|
+
.indicator {
|
|
201
|
+
width: 24px;
|
|
202
|
+
height: 24px;
|
|
203
|
+
border-radius: 50%;
|
|
204
|
+
}
|
|
214
205
|
}
|
|
215
206
|
}
|
|
216
|
-
|
|
217
|
-
.alignments {
|
|
218
|
-
display: grid;
|
|
219
|
-
grid-template-columns: 1fr 1fr 1fr;
|
|
220
|
-
gap: 16px;
|
|
221
|
-
cursor: pointer;
|
|
222
|
-
& > div {
|
|
207
|
+
.alignments {
|
|
223
208
|
display: grid;
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
209
|
+
grid-template-columns: 1fr 1fr 1fr;
|
|
210
|
+
gap: 16px;
|
|
211
|
+
cursor: pointer;
|
|
212
|
+
& > div {
|
|
213
|
+
display: grid;
|
|
214
|
+
}
|
|
215
|
+
.active {
|
|
216
|
+
color: #00c2c2;
|
|
217
|
+
svg path {
|
|
218
|
+
// fill: #00C2C2;
|
|
219
|
+
stroke: #00c2c2;
|
|
220
|
+
}
|
|
230
221
|
}
|
|
231
222
|
}
|
|
232
|
-
|
|
233
223
|
}
|
|
234
224
|
}
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
min-width: 40px;
|
|
238
|
-
display: grid;
|
|
239
|
-
align-content: start;
|
|
240
|
-
gap: 20px;
|
|
241
|
-
span {
|
|
242
|
-
width: 40px;
|
|
243
|
-
height: 40px;
|
|
244
|
-
border-radius: 50%;
|
|
225
|
+
.options {
|
|
226
|
+
min-width: 40px;
|
|
245
227
|
display: grid;
|
|
246
|
-
align-content:
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
228
|
+
align-content: start;
|
|
229
|
+
gap: 20px;
|
|
230
|
+
span {
|
|
231
|
+
width: 40px;
|
|
232
|
+
height: 40px;
|
|
233
|
+
border-radius: 50%;
|
|
234
|
+
display: grid;
|
|
235
|
+
align-content: center;
|
|
236
|
+
justify-items: center;
|
|
237
|
+
background-color: c.$error;
|
|
238
|
+
cursor: pointer;
|
|
239
|
+
&:nth-of-type(1) {
|
|
240
|
+
background-color: c.$primary-color-main;
|
|
241
|
+
}
|
|
252
242
|
}
|
|
253
243
|
}
|
|
254
244
|
}
|
|
255
245
|
}
|
|
256
|
-
}
|