@lets-events/react 12.2.2 → 12.2.4

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.
Files changed (99) hide show
  1. package/.eslintrc.json +2 -2
  2. package/.turbo/turbo-build.log +19 -21
  3. package/CHANGELOG.md +12 -0
  4. package/dist/index.css +138 -1023
  5. package/dist/index.js +12 -1
  6. package/dist/index.mjs +12 -1
  7. package/package.json +1 -1
  8. package/src/components/Alert.tsx +303 -303
  9. package/src/components/Avatar.tsx +55 -55
  10. package/src/components/Badge.tsx +125 -125
  11. package/src/components/Box.tsx +3 -3
  12. package/src/components/Button/index.tsx +16 -16
  13. package/src/components/Button/styledComponents.ts +300 -288
  14. package/src/components/ButtonGroup.tsx +484 -484
  15. package/src/components/Calendar/index.tsx +146 -146
  16. package/src/components/Calendar/styledComponents.ts +250 -250
  17. package/src/components/Card.tsx +48 -48
  18. package/src/components/CheckboxGroup.tsx +176 -176
  19. package/src/components/Container.tsx +39 -39
  20. package/src/components/Drawer/index.tsx +138 -138
  21. package/src/components/Drawer/styledComponents.ts +52 -52
  22. package/src/components/Dropdown.tsx +302 -302
  23. package/src/components/Filter.tsx +164 -164
  24. package/src/components/Flex.tsx +118 -118
  25. package/src/components/FormFields/AddressFormFields/CityFormField.tsx +111 -111
  26. package/src/components/FormFields/AddressFormFields/CountryFormField.tsx +33 -33
  27. package/src/components/FormFields/AddressFormFields/PostalCodeFormField.tsx +39 -39
  28. package/src/components/FormFields/AddressFormFields/StateFormField.tsx +32 -32
  29. package/src/components/FormFields/AddressFormFields/index.tsx +141 -141
  30. package/src/components/FormFields/BirthDateFormField.tsx +84 -84
  31. package/src/components/FormFields/CNPJFormField.tsx +87 -87
  32. package/src/components/FormFields/CPFFormField.tsx +78 -78
  33. package/src/components/FormFields/CalendarFormField.tsx +92 -92
  34. package/src/components/FormFields/CheckboxGroupFormField.tsx +91 -91
  35. package/src/components/FormFields/EmailFormField.tsx +27 -27
  36. package/src/components/FormFields/Form.tsx +39 -39
  37. package/src/components/FormFields/IdentityDocumentNumberFormField.tsx +32 -32
  38. package/src/components/FormFields/MultiSelectFormField.tsx +64 -64
  39. package/src/components/FormFields/PhoneFormField.tsx +40 -40
  40. package/src/components/FormFields/RadioGroupFormField.tsx +84 -84
  41. package/src/components/FormFields/RichEditorFormField.tsx +98 -98
  42. package/src/components/FormFields/SelectFormField.tsx +93 -93
  43. package/src/components/FormFields/SwitchFormField.tsx +46 -46
  44. package/src/components/FormFields/TextAreaFormField.tsx +57 -57
  45. package/src/components/FormFields/TextFormField.tsx +112 -112
  46. package/src/components/FormFields/TimePickerFormField.tsx +88 -88
  47. package/src/components/FormFields/subComponents/ErrorFormMessage.tsx +36 -36
  48. package/src/components/FormFields/subComponents/FormLabel.tsx +29 -29
  49. package/src/components/FormFields/utils/validation.ts +23 -23
  50. package/src/components/Grid.tsx +137 -137
  51. package/src/components/Icon.tsx +47 -47
  52. package/src/components/MenuDropdown/index.tsx +38 -38
  53. package/src/components/MenuDropdown/styledComponents.ts +31 -31
  54. package/src/components/Modal.tsx +90 -90
  55. package/src/components/MultiSelect/index.tsx +243 -243
  56. package/src/components/MultiSelect/styledComponents.ts +160 -160
  57. package/src/components/RadioGroup.tsx +210 -210
  58. package/src/components/RichEditor/QuillComponent.tsx +444 -444
  59. package/src/components/RichEditor/RichEditor.tsx +48 -48
  60. package/src/components/RichEditor/index.ts +2 -2
  61. package/src/components/RichEditor/styledComponents.ts +1151 -1151
  62. package/src/components/Section.tsx +33 -33
  63. package/src/components/Step.tsx +164 -164
  64. package/src/components/Switch.tsx +108 -108
  65. package/src/components/Text.tsx +38 -38
  66. package/src/components/TextField.tsx +372 -372
  67. package/src/components/TextareaField.tsx +127 -127
  68. package/src/components/TimePicker.tsx +328 -328
  69. package/src/components/Toast/components/ToastItem.tsx +41 -41
  70. package/src/components/Toast/components/ToastProvider.tsx +63 -63
  71. package/src/components/Toast/hooks/useToast.ts +12 -12
  72. package/src/components/Toast/index.tsx +5 -5
  73. package/src/components/Toast/styles/index.ts +135 -135
  74. package/src/components/Toast/types/index.ts +46 -46
  75. package/src/components/Tooltip/index.tsx +66 -66
  76. package/src/components/Tooltip/styles.ts +77 -77
  77. package/src/hooks/useCountries.ts +41 -41
  78. package/src/hooks/useImageUpload.ts +139 -139
  79. package/src/hooks/useOnClickOutside.tsx +42 -42
  80. package/src/index.tsx +68 -68
  81. package/src/styles/index.ts +38 -38
  82. package/src/types/typographyValues.ts +178 -178
  83. package/src/utils/getNestedValue.ts +3 -3
  84. package/src/utils/states.ts +29 -29
  85. package/src/utils/uploadService.ts +180 -180
  86. package/tsconfig.json +3 -3
  87. package/tsup.config.ts +38 -38
  88. package/dist/QuillComponent-2YO26WOT.mjs +0 -458
  89. package/dist/QuillComponent-36H54CRL.mjs +0 -451
  90. package/dist/QuillComponent-A5KIFPCL.mjs +0 -438
  91. package/dist/QuillComponent-C2NXFWIZ.mjs +0 -459
  92. package/dist/QuillComponent-EIWPUIIH.mjs +0 -456
  93. package/dist/QuillComponent-FPVFLYUK.mjs +0 -448
  94. package/dist/QuillComponent-O5RSHCDS.mjs +0 -459
  95. package/dist/QuillComponent-PPWKGS74.mjs +0 -452
  96. package/dist/QuillComponent-QFVVQA6K.mjs +0 -459
  97. package/dist/QuillComponent-TLIZCM6V.mjs +0 -458
  98. package/dist/QuillComponent-ZLQ2VKPD.mjs +0 -457
  99. package/dist/chunk-TU7LKUXZ.mjs +0 -1927
package/dist/index.css CHANGED
@@ -1,1056 +1,171 @@
1
- /* src/components/RichEditor/styles.css */
2
- .ql-container {
3
- box-sizing: border-box;
4
- font-family:
5
- Helvetica,
6
- Arial,
7
- sans-serif;
8
- font-size: 13px;
9
- height: 100%;
10
- margin: 0;
1
+ /* ../../node_modules/react-international-phone/dist/index.css */
2
+ .react-international-phone-country-selector {
11
3
  position: relative;
12
4
  }
13
- .ql-container.ql-disabled .ql-tooltip {
14
- visibility: hidden;
15
- }
16
- .ql-container:not(.ql-disabled) li[data-list=checked] > .ql-ui,
17
- .ql-container:not(.ql-disabled) li[data-list=unchecked] > .ql-ui {
18
- cursor: pointer;
19
- }
20
- .ql-clipboard {
21
- left: -100000px;
22
- height: 1px;
23
- overflow-y: hidden;
24
- position: absolute;
25
- top: 50%;
26
- }
27
- .ql-clipboard p {
28
- margin: 0;
29
- padding: 0;
30
- }
31
- .ql-editor {
5
+ .react-international-phone-country-selector-button {
6
+ display: flex;
7
+ height: var(--react-international-phone-height, 36px);
32
8
  box-sizing: border-box;
33
- counter-reset: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
34
- line-height: 1.42;
35
- height: 100%;
36
- outline: none;
37
- overflow-y: auto;
38
- padding: 12px 15px;
39
- tab-size: 4;
40
- -moz-tab-size: 4;
41
- text-align: left;
42
- white-space: pre-wrap;
43
- word-wrap: break-word;
44
- }
45
- .ql-editor > * {
46
- cursor: text;
47
- }
48
- .ql-editor p,
49
- .ql-editor ol,
50
- .ql-editor pre,
51
- .ql-editor blockquote,
52
- .ql-editor h1,
53
- .ql-editor h2,
54
- .ql-editor h3,
55
- .ql-editor h4,
56
- .ql-editor h5,
57
- .ql-editor h6 {
58
- margin: 0;
9
+ align-items: center;
10
+ justify-content: center;
59
11
  padding: 0;
60
- }
61
- @supports (counter-set:none) {
62
- .ql-editor p,
63
- .ql-editor h1,
64
- .ql-editor h2,
65
- .ql-editor h3,
66
- .ql-editor h4,
67
- .ql-editor h5,
68
- .ql-editor h6 {
69
- counter-set: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
70
- }
71
- }
72
- @supports not (counter-set:none) {
73
- .ql-editor p,
74
- .ql-editor h1,
75
- .ql-editor h2,
76
- .ql-editor h3,
77
- .ql-editor h4,
78
- .ql-editor h5,
79
- .ql-editor h6 {
80
- counter-reset: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
81
- }
82
- }
83
- .ql-editor table {
84
- border-collapse: collapse;
85
- }
86
- .ql-editor td {
87
- border: 1px solid #000;
88
- padding: 2px 5px;
89
- }
90
- .ql-editor ol {
91
- padding-left: 1.5em;
92
- }
93
- .ql-editor li {
94
- list-style-type: none;
95
- padding-left: 1.5em;
96
- position: relative;
97
- }
98
- .ql-editor li > .ql-ui:before {
99
- display: inline-block;
100
- margin-left: -1.5em;
101
- margin-right: .3em;
102
- text-align: right;
103
- white-space: nowrap;
104
- width: 1.2em;
105
- }
106
- .ql-editor li[data-list=checked] > .ql-ui,
107
- .ql-editor li[data-list=unchecked] > .ql-ui {
108
- color: #777;
109
- }
110
- .ql-editor li[data-list=bullet] > .ql-ui:before {
111
- content: "\2022";
112
- }
113
- .ql-editor li[data-list=checked] > .ql-ui:before {
114
- content: "\2611";
115
- }
116
- .ql-editor li[data-list=unchecked] > .ql-ui:before {
117
- content: "\2610";
118
- }
119
- @supports (counter-set:none) {
120
- .ql-editor li[data-list] {
121
- counter-set: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
122
- }
123
- }
124
- @supports not (counter-set:none) {
125
- .ql-editor li[data-list] {
126
- counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
127
- }
128
- }
129
- .ql-editor li[data-list=ordered] {
130
- counter-increment: list-0;
131
- }
132
- .ql-editor li[data-list=ordered] > .ql-ui:before {
133
- content: counter(list-0, decimal) ". ";
134
- }
135
- .ql-editor li[data-list=ordered].ql-indent-1 {
136
- counter-increment: list-1;
137
- }
138
- .ql-editor li[data-list=ordered].ql-indent-1 > .ql-ui:before {
139
- content: counter(list-1, lower-alpha) ". ";
140
- }
141
- @supports (counter-set:none) {
142
- .ql-editor li[data-list].ql-indent-1 {
143
- counter-set: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
144
- }
145
- }
146
- @supports not (counter-set:none) {
147
- .ql-editor li[data-list].ql-indent-1 {
148
- counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
149
- }
150
- }
151
- .ql-editor li[data-list=ordered].ql-indent-2 {
152
- counter-increment: list-2;
153
- }
154
- .ql-editor li[data-list=ordered].ql-indent-2 > .ql-ui:before {
155
- content: counter(list-2, lower-roman) ". ";
156
- }
157
- @supports (counter-set:none) {
158
- .ql-editor li[data-list].ql-indent-2 {
159
- counter-set: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
160
- }
161
- }
162
- @supports not (counter-set:none) {
163
- .ql-editor li[data-list].ql-indent-2 {
164
- counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
165
- }
166
- }
167
- .ql-editor li[data-list=ordered].ql-indent-3 {
168
- counter-increment: list-3;
169
- }
170
- .ql-editor li[data-list=ordered].ql-indent-3 > .ql-ui:before {
171
- content: counter(list-3, decimal) ". ";
172
- }
173
- @supports (counter-set:none) {
174
- .ql-editor li[data-list].ql-indent-3 {
175
- counter-set: list-4 list-5 list-6 list-7 list-8 list-9;
176
- }
177
- }
178
- @supports not (counter-set:none) {
179
- .ql-editor li[data-list].ql-indent-3 {
180
- counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
181
- }
182
- }
183
- .ql-editor li[data-list=ordered].ql-indent-4 {
184
- counter-increment: list-4;
185
- }
186
- .ql-editor li[data-list=ordered].ql-indent-4 > .ql-ui:before {
187
- content: counter(list-4, lower-alpha) ". ";
188
- }
189
- @supports (counter-set:none) {
190
- .ql-editor li[data-list].ql-indent-4 {
191
- counter-set: list-5 list-6 list-7 list-8 list-9;
192
- }
193
- }
194
- @supports not (counter-set:none) {
195
- .ql-editor li[data-list].ql-indent-4 {
196
- counter-reset: list-5 list-6 list-7 list-8 list-9;
197
- }
198
- }
199
- .ql-editor li[data-list=ordered].ql-indent-5 {
200
- counter-increment: list-5;
201
- }
202
- .ql-editor li[data-list=ordered].ql-indent-5 > .ql-ui:before {
203
- content: counter(list-5, lower-roman) ". ";
204
- }
205
- @supports (counter-set:none) {
206
- .ql-editor li[data-list].ql-indent-5 {
207
- counter-set: list-6 list-7 list-8 list-9;
208
- }
209
- }
210
- @supports not (counter-set:none) {
211
- .ql-editor li[data-list].ql-indent-5 {
212
- counter-reset: list-6 list-7 list-8 list-9;
213
- }
214
- }
215
- .ql-editor li[data-list=ordered].ql-indent-6 {
216
- counter-increment: list-6;
217
- }
218
- .ql-editor li[data-list=ordered].ql-indent-6 > .ql-ui:before {
219
- content: counter(list-6, decimal) ". ";
220
- }
221
- @supports (counter-set:none) {
222
- .ql-editor li[data-list].ql-indent-6 {
223
- counter-set: list-7 list-8 list-9;
224
- }
225
- }
226
- @supports not (counter-set:none) {
227
- .ql-editor li[data-list].ql-indent-6 {
228
- counter-reset: list-7 list-8 list-9;
229
- }
230
- }
231
- .ql-editor li[data-list=ordered].ql-indent-7 {
232
- counter-increment: list-7;
233
- }
234
- .ql-editor li[data-list=ordered].ql-indent-7 > .ql-ui:before {
235
- content: counter(list-7, lower-alpha) ". ";
236
- }
237
- @supports (counter-set:none) {
238
- .ql-editor li[data-list].ql-indent-7 {
239
- counter-set: list-8 list-9;
240
- }
241
- }
242
- @supports not (counter-set:none) {
243
- .ql-editor li[data-list].ql-indent-7 {
244
- counter-reset: list-8 list-9;
245
- }
246
- }
247
- .ql-editor li[data-list=ordered].ql-indent-8 {
248
- counter-increment: list-8;
249
- }
250
- .ql-editor li[data-list=ordered].ql-indent-8 > .ql-ui:before {
251
- content: counter(list-8, lower-roman) ". ";
252
- }
253
- @supports (counter-set:none) {
254
- .ql-editor li[data-list].ql-indent-8 {
255
- counter-set: list-9;
256
- }
257
- }
258
- @supports not (counter-set:none) {
259
- .ql-editor li[data-list].ql-indent-8 {
260
- counter-reset: list-9;
261
- }
262
- }
263
- .ql-editor li[data-list=ordered].ql-indent-9 {
264
- counter-increment: list-9;
265
- }
266
- .ql-editor li[data-list=ordered].ql-indent-9 > .ql-ui:before {
267
- content: counter(list-9, decimal) ". ";
268
- }
269
- .ql-editor .ql-indent-1:not(.ql-direction-rtl) {
270
- padding-left: 3em;
271
- }
272
- .ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
273
- padding-left: 4.5em;
274
- }
275
- .ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
276
- padding-right: 3em;
277
- }
278
- .ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
279
- padding-right: 4.5em;
280
- }
281
- .ql-editor .ql-indent-2:not(.ql-direction-rtl) {
282
- padding-left: 6em;
283
- }
284
- .ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
285
- padding-left: 7.5em;
286
- }
287
- .ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
288
- padding-right: 6em;
289
- }
290
- .ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
291
- padding-right: 7.5em;
292
- }
293
- .ql-editor .ql-indent-3:not(.ql-direction-rtl) {
294
- padding-left: 9em;
295
- }
296
- .ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
297
- padding-left: 10.5em;
298
- }
299
- .ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
300
- padding-right: 9em;
301
- }
302
- .ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
303
- padding-right: 10.5em;
304
- }
305
- .ql-editor .ql-indent-4:not(.ql-direction-rtl) {
306
- padding-left: 12em;
307
- }
308
- .ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
309
- padding-left: 13.5em;
310
- }
311
- .ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
312
- padding-right: 12em;
313
- }
314
- .ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
315
- padding-right: 13.5em;
316
- }
317
- .ql-editor .ql-indent-5:not(.ql-direction-rtl) {
318
- padding-left: 15em;
319
- }
320
- .ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
321
- padding-left: 16.5em;
322
- }
323
- .ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
324
- padding-right: 15em;
325
- }
326
- .ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
327
- padding-right: 16.5em;
328
- }
329
- .ql-editor .ql-indent-6:not(.ql-direction-rtl) {
330
- padding-left: 18em;
331
- }
332
- .ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
333
- padding-left: 19.5em;
334
- }
335
- .ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
336
- padding-right: 18em;
337
- }
338
- .ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
339
- padding-right: 19.5em;
340
- }
341
- .ql-editor .ql-indent-7:not(.ql-direction-rtl) {
342
- padding-left: 21em;
343
- }
344
- .ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
345
- padding-left: 22.5em;
346
- }
347
- .ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
348
- padding-right: 21em;
349
- }
350
- .ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
351
- padding-right: 22.5em;
352
- }
353
- .ql-editor .ql-indent-8:not(.ql-direction-rtl) {
354
- padding-left: 24em;
355
- }
356
- .ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
357
- padding-left: 25.5em;
358
- }
359
- .ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
360
- padding-right: 24em;
361
- }
362
- .ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
363
- padding-right: 25.5em;
364
- }
365
- .ql-editor .ql-indent-9:not(.ql-direction-rtl) {
366
- padding-left: 27em;
367
- }
368
- .ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
369
- padding-left: 28.5em;
370
- }
371
- .ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
372
- padding-right: 27em;
373
- }
374
- .ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
375
- padding-right: 28.5em;
376
- }
377
- .ql-editor li.ql-direction-rtl {
378
- padding-right: 1.5em;
379
- }
380
- .ql-editor li.ql-direction-rtl > .ql-ui:before {
381
- margin-left: .3em;
382
- margin-right: -1.5em;
383
- text-align: left;
384
- }
385
- .ql-editor table {
386
- table-layout: fixed;
387
- width: 100%;
388
- }
389
- .ql-editor table td {
390
- outline: none;
391
- }
392
- .ql-editor .ql-code-block-container {
393
- font-family: monospace;
394
- }
395
- .ql-editor .ql-video {
396
- display: block;
397
- max-width: 100%;
398
- }
399
- .ql-editor .ql-video.ql-align-center {
400
- margin: 0 auto;
401
- }
402
- .ql-editor .ql-video.ql-align-right {
403
- margin: 0 0 0 auto;
404
- }
405
- .ql-editor .ql-bg-black {
406
- background-color: #000;
407
- }
408
- .ql-editor .ql-bg-red {
409
- background-color: #e60000;
410
- }
411
- .ql-editor .ql-bg-orange {
412
- background-color: #f90;
413
- }
414
- .ql-editor .ql-bg-yellow {
415
- background-color: #ff0;
416
- }
417
- .ql-editor .ql-bg-green {
418
- background-color: #008a00;
419
- }
420
- .ql-editor .ql-bg-blue {
421
- background-color: #06c;
422
- }
423
- .ql-editor .ql-bg-purple {
424
- background-color: #93f;
425
- }
426
- .ql-editor .ql-color-white {
427
- color: #fff;
428
- }
429
- .ql-editor .ql-color-red {
430
- color: #e60000;
431
- }
432
- .ql-editor .ql-color-orange {
433
- color: #f90;
434
- }
435
- .ql-editor .ql-color-yellow {
436
- color: #ff0;
437
- }
438
- .ql-editor .ql-color-green {
439
- color: #008a00;
440
- }
441
- .ql-editor .ql-color-blue {
442
- color: #06c;
443
- }
444
- .ql-editor .ql-color-purple {
445
- color: #93f;
446
- }
447
- .ql-editor .ql-font-serif {
448
- font-family:
449
- Georgia,
450
- Times New Roman,
451
- serif;
452
- }
453
- .ql-editor .ql-font-monospace {
454
- font-family:
455
- Monaco,
456
- Courier New,
457
- monospace;
458
- }
459
- .ql-editor .ql-size-small {
460
- font-size: .75em;
461
- }
462
- .ql-editor .ql-size-large {
463
- font-size: 1.5em;
464
- }
465
- .ql-editor .ql-size-huge {
466
- font-size: 2.5em;
467
- }
468
- .ql-editor .ql-direction-rtl {
469
- direction: rtl;
470
- text-align: inherit;
471
- }
472
- .ql-editor .ql-align-center {
473
- text-align: center;
474
- }
475
- .ql-editor .ql-align-justify {
476
- text-align: justify;
477
- }
478
- .ql-editor .ql-align-right {
479
- text-align: right;
480
- }
481
- .ql-editor .ql-ui {
482
- position: absolute;
483
- }
484
- .ql-editor.ql-blank::before {
485
- color: rgba(0, 0, 0, 0.6);
486
- content: attr(data-placeholder);
487
- font-style: italic;
488
- left: 15px;
489
- pointer-events: none;
490
- position: absolute;
491
- right: 15px;
492
- }
493
- .ql-snow.ql-toolbar:after,
494
- .ql-snow .ql-toolbar:after {
495
- clear: both;
496
- content: "";
497
- display: table;
498
- }
499
- .ql-snow.ql-toolbar button,
500
- .ql-snow .ql-toolbar button {
501
- background: none;
502
- border: none;
503
- cursor: pointer;
504
- display: inline-block;
505
- float: left;
506
- height: 24px;
507
- padding: 3px 5px;
508
- width: 28px;
509
- }
510
- .ql-snow.ql-toolbar button svg,
511
- .ql-snow .ql-toolbar button svg {
512
- float: left;
513
- height: 100%;
514
- }
515
- .ql-snow.ql-toolbar button:active:hover,
516
- .ql-snow .ql-toolbar button:active:hover {
517
- outline: none;
518
- }
519
- .ql-snow.ql-toolbar input.ql-image[type=file],
520
- .ql-snow .ql-toolbar input.ql-image[type=file] {
521
- display: none;
522
- }
523
- .ql-snow.ql-toolbar button:hover,
524
- .ql-snow .ql-toolbar button:hover,
525
- .ql-snow.ql-toolbar button:focus,
526
- .ql-snow .ql-toolbar button:focus,
527
- .ql-snow.ql-toolbar button.ql-active,
528
- .ql-snow .ql-toolbar button.ql-active,
529
- .ql-snow.ql-toolbar .ql-picker-label:hover,
530
- .ql-snow .ql-toolbar .ql-picker-label:hover,
531
- .ql-snow.ql-toolbar .ql-picker-label.ql-active,
532
- .ql-snow .ql-toolbar .ql-picker-label.ql-active,
533
- .ql-snow.ql-toolbar .ql-picker-item:hover,
534
- .ql-snow .ql-toolbar .ql-picker-item:hover,
535
- .ql-snow.ql-toolbar .ql-picker-item.ql-selected,
536
- .ql-snow .ql-toolbar .ql-picker-item.ql-selected {
537
- color: #06c;
538
- }
539
- .ql-snow.ql-toolbar button:hover .ql-fill,
540
- .ql-snow .ql-toolbar button:hover .ql-fill,
541
- .ql-snow.ql-toolbar button:focus .ql-fill,
542
- .ql-snow .ql-toolbar button:focus .ql-fill,
543
- .ql-snow.ql-toolbar button.ql-active .ql-fill,
544
- .ql-snow .ql-toolbar button.ql-active .ql-fill,
545
- .ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
546
- .ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
547
- .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
548
- .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
549
- .ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
550
- .ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
551
- .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
552
- .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
553
- .ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
554
- .ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
555
- .ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
556
- .ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
557
- .ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
558
- .ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
559
- .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
560
- .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
561
- .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
562
- .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
563
- .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
564
- .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
565
- .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
566
- .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
567
- fill: #06c;
568
- }
569
- .ql-snow.ql-toolbar button:hover .ql-stroke,
570
- .ql-snow .ql-toolbar button:hover .ql-stroke,
571
- .ql-snow.ql-toolbar button:focus .ql-stroke,
572
- .ql-snow .ql-toolbar button:focus .ql-stroke,
573
- .ql-snow.ql-toolbar button.ql-active .ql-stroke,
574
- .ql-snow .ql-toolbar button.ql-active .ql-stroke,
575
- .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
576
- .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
577
- .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
578
- .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
579
- .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
580
- .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
581
- .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
582
- .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
583
- .ql-snow.ql-toolbar button:hover .ql-stroke-miter,
584
- .ql-snow .ql-toolbar button:hover .ql-stroke-miter,
585
- .ql-snow.ql-toolbar button:focus .ql-stroke-miter,
586
- .ql-snow .ql-toolbar button:focus .ql-stroke-miter,
587
- .ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
588
- .ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
589
- .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
590
- .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
591
- .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
592
- .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
593
- .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
594
- .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
595
- .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
596
- .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
597
- stroke: #06c;
598
- }
599
- @media (pointer:coarse) {
600
- .ql-snow.ql-toolbar button:hover:not(.ql-active),
601
- .ql-snow .ql-toolbar button:hover:not(.ql-active) {
602
- color: #444;
603
- }
604
- .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
605
- .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
606
- .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
607
- .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
608
- fill: #444;
609
- }
610
- .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
611
- .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
612
- .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
613
- .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
614
- stroke: #444;
615
- }
616
- }
617
- .ql-snow {
618
- box-sizing: border-box;
619
- }
620
- .ql-snow * {
621
- box-sizing: border-box;
622
- }
623
- .ql-snow .ql-hidden {
624
- display: none;
625
- }
626
- .ql-snow .ql-out-bottom,
627
- .ql-snow .ql-out-top {
628
- visibility: hidden;
629
- }
630
- .ql-snow .ql-tooltip {
631
- position: absolute;
632
- transform: translateY(10px);
633
- }
634
- .ql-snow .ql-tooltip a {
12
+ border: 1px solid var(--react-international-phone-country-selector-border-color, var(--react-international-phone-border-color, gainsboro));
13
+ margin: 0;
14
+ appearance: button;
15
+ -webkit-appearance: button;
16
+ background-color: var(--react-international-phone-country-selector-background-color, var(--react-international-phone-background-color, white));
635
17
  cursor: pointer;
636
- text-decoration: none;
637
- }
638
- .ql-snow .ql-tooltip.ql-flip {
639
- transform: translateY(-10px);
640
- }
641
- .ql-snow .ql-formats {
642
- display: inline-block;
643
- vertical-align: middle;
644
- }
645
- .ql-snow .ql-formats:after {
646
- clear: both;
647
- content: "";
648
- display: table;
18
+ text-transform: none;
19
+ user-select: none;
649
20
  }
650
- .ql-snow .ql-stroke {
651
- fill: none;
652
- stroke: #444;
653
- stroke-linecap: round;
654
- stroke-linejoin: round;
655
- stroke-width: 2;
21
+ .react-international-phone-country-selector-button:hover {
22
+ background-color: var(--react-international-phone-country-selector-background-color-hover, whitesmoke);
656
23
  }
657
- .ql-snow .ql-stroke-miter {
658
- fill: none;
659
- stroke: #444;
660
- stroke-miterlimit: 10;
661
- stroke-width: 2;
24
+ .react-international-phone-country-selector-button--hide-dropdown {
25
+ cursor: auto;
662
26
  }
663
- .ql-snow .ql-fill,
664
- .ql-snow .ql-stroke.ql-fill {
665
- fill: #444;
27
+ .react-international-phone-country-selector-button--hide-dropdown:hover {
28
+ background-color: transparent;
666
29
  }
667
- .ql-snow .ql-empty {
668
- fill: none;
30
+ .react-international-phone-country-selector-button__button-content {
31
+ display: flex;
32
+ align-items: center;
33
+ justify-content: center;
669
34
  }
670
- .ql-snow .ql-even {
671
- fill-rule: evenodd;
35
+ .react-international-phone-country-selector-button__flag-emoji {
36
+ margin: 0 4px;
672
37
  }
673
- .ql-snow .ql-thin,
674
- .ql-snow .ql-stroke.ql-thin {
675
- stroke-width: 1;
38
+ .react-international-phone-country-selector-button__flag-emoji--disabled {
39
+ opacity: .75;
676
40
  }
677
- .ql-snow .ql-transparent {
678
- opacity: .4;
41
+ .react-international-phone-country-selector-button__dropdown-arrow {
42
+ border-top: var(--react-international-phone-country-selector-arrow-size, 4px) solid var(--react-international-phone-country-selector-arrow-color, #777);
43
+ border-right: var(--react-international-phone-country-selector-arrow-size, 4px) solid transparent;
44
+ border-left: var(--react-international-phone-country-selector-arrow-size, 4px) solid transparent;
45
+ margin-right: 4px;
46
+ transition: all .1s ease-out;
679
47
  }
680
- .ql-snow .ql-direction svg:last-child {
681
- display: none;
48
+ .react-international-phone-country-selector-button__dropdown-arrow--active {
49
+ transform: rotateX(180deg);
682
50
  }
683
- .ql-snow .ql-direction.ql-active svg:last-child {
684
- display: inline;
51
+ .react-international-phone-country-selector-button__dropdown-arrow--disabled {
52
+ border-top-color: var(--react-international-phone-disabled-country-selector-arrow-color, #999);
685
53
  }
686
- .ql-snow .ql-direction.ql-active svg:first-child {
687
- display: none;
54
+ .react-international-phone-country-selector-button--disabled {
55
+ background-color: var(--react-international-phone-disabled-country-selector-background-color, var(--react-international-phone-disabled-background-color, whitesmoke));
56
+ cursor: auto;
688
57
  }
689
- .ql-snow .ql-editor h1 {
690
- font-size: 2em;
58
+ .react-international-phone-country-selector-button--disabled:hover {
59
+ background-color: var(--react-international-phone-disabled-country-selector-background-color, var(--react-international-phone-disabled-background-color, whitesmoke));
691
60
  }
692
- .ql-snow .ql-editor h2 {
693
- font-size: 1.5em;
694
- }
695
- .ql-snow .ql-editor h3 {
696
- font-size: 1.17em;
697
- }
698
- .ql-snow .ql-editor h4 {
699
- font-size: 1em;
700
- }
701
- .ql-snow .ql-editor h5 {
702
- font-size: .83em;
703
- }
704
- .ql-snow .ql-editor h6 {
705
- font-size: .67em;
706
- }
707
- .ql-snow .ql-editor a {
708
- text-decoration: underline;
709
- }
710
- .ql-snow .ql-editor blockquote {
711
- border-left: 4px solid #ccc;
712
- margin-bottom: 5px;
713
- margin-top: 5px;
714
- padding-left: 16px;
715
- }
716
- .ql-snow .ql-editor code,
717
- .ql-snow .ql-editor .ql-code-block-container {
718
- background-color: #f0f0f0;
719
- border-radius: 3px;
720
- }
721
- .ql-snow .ql-editor .ql-code-block-container {
722
- margin-bottom: 5px;
723
- margin-top: 5px;
724
- padding: 5px 10px;
725
- }
726
- .ql-snow .ql-editor code {
727
- font-size: 85%;
728
- padding: 2px 4px;
729
- }
730
- .ql-snow .ql-editor .ql-code-block-container {
731
- background-color: #23241f;
732
- color: #f8f8f2;
733
- overflow: visible;
734
- }
735
- .ql-snow .ql-editor img {
736
- max-width: 100%;
737
- }
738
- .ql-snow .ql-picker {
739
- color: #444;
740
- display: inline-block;
741
- float: left;
742
- font-size: 14px;
743
- font-weight: 500;
744
- height: 24px;
745
- position: relative;
746
- vertical-align: middle;
747
- }
748
- .ql-snow .ql-picker-label {
749
- cursor: pointer;
750
- display: inline-block;
751
- height: 100%;
752
- padding-left: 8px;
753
- padding-right: 2px;
754
- position: relative;
755
- width: 100%;
756
- }
757
- .ql-snow .ql-picker-label::before {
758
- display: inline-block;
759
- line-height: 22px;
61
+ .react-international-phone-flag-emoji {
62
+ width: var(--react-international-phone-flag-width, 24px);
63
+ height: var(--react-international-phone-flag-height, 24px);
64
+ box-sizing: border-box;
760
65
  }
761
- .ql-snow .ql-picker-options {
762
- background-color: #fff;
763
- display: none;
764
- min-width: 100%;
765
- padding: 4px 8px;
66
+ .react-international-phone-country-selector-dropdown {
766
67
  position: absolute;
767
- white-space: nowrap;
768
- }
769
- .ql-snow .ql-picker-options .ql-picker-item {
770
- cursor: pointer;
771
- display: block;
772
- padding-bottom: 5px;
773
- padding-top: 5px;
774
- }
775
- .ql-snow .ql-picker.ql-expanded .ql-picker-label {
776
- color: #ccc;
777
- z-index: 2;
778
- }
779
- .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
780
- fill: #ccc;
781
- }
782
- .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
783
- stroke: #ccc;
784
- }
785
- .ql-snow .ql-picker.ql-expanded .ql-picker-options {
786
- display: block;
787
- margin-top: -1px;
788
- top: 100%;
789
68
  z-index: 1;
790
- }
791
- .ql-snow .ql-color-picker,
792
- .ql-snow .ql-icon-picker {
793
- width: 28px;
794
- }
795
- .ql-snow .ql-color-picker .ql-picker-label,
796
- .ql-snow .ql-icon-picker .ql-picker-label {
797
- padding: 2px 4px;
798
- }
799
- .ql-snow .ql-color-picker .ql-picker-label svg,
800
- .ql-snow .ql-icon-picker .ql-picker-label svg {
801
- right: 4px;
802
- }
803
- .ql-snow .ql-icon-picker .ql-picker-options {
69
+ top: var(--react-international-phone-dropdown-top, 44px);
70
+ left: var(--react-international-phone-dropdown-left, 0);
71
+ display: flex;
72
+ width: 300px;
73
+ max-height: 200px;
74
+ flex-direction: column;
804
75
  padding: 4px 0;
76
+ margin: 0;
77
+ background-color: var(--react-international-phone-dropdown-item-background-color, var(--react-international-phone-background-color, white));
78
+ box-shadow: var(--react-international-phone-dropdown-shadow, 2px 2px 16px rgba(0, 0, 0, .25));
79
+ color: var(--react-international-phone-dropdown-item-text-color, var(--react-international-phone-text-color, #222));
80
+ list-style: none;
81
+ overflow-y: scroll;
805
82
  }
806
- .ql-snow .ql-icon-picker .ql-picker-item {
807
- height: 24px;
808
- width: 24px;
809
- padding: 2px 4px;
810
- }
811
- .ql-snow .ql-color-picker .ql-picker-options {
812
- padding: 3px 5px;
813
- width: 152px;
814
- }
815
- .ql-snow .ql-color-picker .ql-picker-item {
816
- border: 1px solid transparent;
817
- float: left;
818
- height: 16px;
819
- margin: 2px;
820
- padding: 0;
821
- width: 16px;
822
- }
823
- .ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
824
- position: absolute;
825
- margin-top: -9px;
826
- right: 0;
827
- top: 50%;
828
- width: 18px;
829
- }
830
- .ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""])::before,
831
- .ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""])::before,
832
- .ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""])::before,
833
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""])::before,
834
- .ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""])::before,
835
- .ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""])::before {
836
- content: attr(data-label);
837
- }
838
- .ql-snow .ql-picker.ql-header {
839
- width: 98px;
840
- }
841
- .ql-snow .ql-picker.ql-header .ql-picker-label::before,
842
- .ql-snow .ql-picker.ql-header .ql-picker-item::before {
843
- content: "Normal";
844
- }
845
- .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
846
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
847
- content: "Heading 1";
848
- }
849
- .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
850
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
851
- content: "Heading 2";
852
- }
853
- .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
854
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
855
- content: "Heading 3";
856
- }
857
- .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
858
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
859
- content: "Heading 4";
860
- }
861
- .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
862
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
863
- content: "Heading 5";
864
- }
865
- .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
866
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
867
- content: "Heading 6";
868
- }
869
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
870
- font-size: 2em;
871
- }
872
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
873
- font-size: 1.5em;
874
- }
875
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
876
- font-size: 1.17em;
877
- }
878
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
879
- font-size: 1em;
880
- }
881
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
882
- font-size: .83em;
883
- }
884
- .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
885
- font-size: .67em;
886
- }
887
- .ql-snow .ql-picker.ql-font {
888
- width: 108px;
889
- }
890
- .ql-snow .ql-picker.ql-font .ql-picker-label::before,
891
- .ql-snow .ql-picker.ql-font .ql-picker-item::before {
892
- content: "Sans Serif";
893
- }
894
- .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
895
- .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
896
- content: "Serif";
897
- }
898
- .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
899
- .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
900
- content: "Monospace";
901
- }
902
- .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
903
- font-family:
904
- Georgia,
905
- Times New Roman,
906
- serif;
907
- }
908
- .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
909
- font-family:
910
- Monaco,
911
- Courier New,
912
- monospace;
913
- }
914
- .ql-snow .ql-picker.ql-size {
915
- width: 98px;
916
- }
917
- .ql-snow .ql-picker.ql-size .ql-picker-label::before,
918
- .ql-snow .ql-picker.ql-size .ql-picker-item::before {
919
- content: "Normal";
920
- }
921
- .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
922
- .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
923
- content: "Small";
924
- }
925
- .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
926
- .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
927
- content: "Large";
928
- }
929
- .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
930
- .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
931
- content: "Huge";
932
- }
933
- .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
934
- font-size: 10px;
935
- }
936
- .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
937
- font-size: 18px;
938
- }
939
- .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
940
- font-size: 32px;
941
- }
942
- .ql-snow .ql-color-picker.ql-background .ql-picker-item {
943
- background-color: #fff;
944
- }
945
- .ql-snow .ql-color-picker.ql-color .ql-picker-item {
946
- background-color: #000;
947
- }
948
- .ql-code-block-container {
949
- position: relative;
950
- }
951
- .ql-code-block-container .ql-ui {
952
- right: 5px;
953
- top: 5px;
83
+ .react-international-phone-country-selector-dropdown__preferred-list-divider {
84
+ height: 1px;
85
+ border: none;
86
+ margin: var(--react-international-phone-dropdown-preferred-list-divider-margin, 0);
87
+ background: var(--react-international-phone-dropdown-preferred-list-divider-color, var(--react-international-phone-border-color, gainsboro));
954
88
  }
955
- .ql-toolbar.ql-snow {
956
- border: 1px solid #ccc;
89
+ .react-international-phone-country-selector-dropdown__list-item {
90
+ display: flex;
91
+ min-height: var(--react-international-phone-dropdown-item-height, 28px);
957
92
  box-sizing: border-box;
958
- font-family:
959
- "Helvetica Neue",
960
- "Helvetica",
961
- "Arial",
962
- sans-serif;
963
- padding: 8px;
964
- }
965
- .ql-toolbar.ql-snow .ql-formats {
966
- margin-right: 15px;
967
- }
968
- .ql-toolbar.ql-snow .ql-picker-label {
969
- border: 1px solid transparent;
970
- }
971
- .ql-toolbar.ql-snow .ql-picker-options {
972
- border: 1px solid transparent;
973
- box-shadow: rgba(0, 0, 0, 0.2) 0 2px 8px;
974
- }
975
- .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
976
- border-color: #ccc;
977
- }
978
- .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
979
- border-color: #ccc;
980
- }
981
- .ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
982
- .ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
983
- border-color: #000;
984
- }
985
- .ql-toolbar.ql-snow + .ql-container.ql-snow {
986
- border-top: 0;
987
- }
988
- .ql-snow .ql-tooltip {
989
- background-color: #fff;
990
- border: 1px solid #ccc;
991
- box-shadow: 0 0 5px #ddd;
992
- color: #444;
993
- padding: 5px 12px;
994
- white-space: nowrap;
93
+ align-items: center;
94
+ padding: 2px 8px;
995
95
  }
996
- .ql-snow .ql-tooltip::before {
997
- content: "Visit URL:";
998
- line-height: 26px;
96
+ .react-international-phone-country-selector-dropdown__list-item-flag-emoji {
999
97
  margin-right: 8px;
1000
98
  }
1001
- .ql-snow .ql-tooltip input[type=text] {
1002
- display: none;
1003
- border: 1px solid #ccc;
1004
- font-size: 13px;
1005
- height: 26px;
1006
- margin: 0;
1007
- padding: 3px 5px;
1008
- width: 170px;
1009
- }
1010
- .ql-snow .ql-tooltip a.ql-preview {
1011
- display: inline-block;
1012
- max-width: 200px;
1013
- overflow-x: hidden;
99
+ .react-international-phone-country-selector-dropdown__list-item-country-name {
100
+ overflow: hidden;
101
+ margin-right: 8px;
102
+ font-size: var(--react-international-phone-dropdown-item-font-size, 14px);
1014
103
  text-overflow: ellipsis;
1015
- vertical-align: top;
1016
- }
1017
- .ql-snow .ql-tooltip a.ql-action::after {
1018
- border-right: 1px solid #ccc;
1019
- content: "Edit";
1020
- margin-left: 16px;
1021
- padding-right: 8px;
1022
- }
1023
- .ql-snow .ql-tooltip a.ql-remove::before {
1024
- content: "Remove";
1025
- margin-left: 8px;
1026
- }
1027
- .ql-snow .ql-tooltip a {
1028
- line-height: 26px;
1029
- }
1030
- .ql-snow .ql-tooltip.ql-editing a.ql-preview,
1031
- .ql-snow .ql-tooltip.ql-editing a.ql-remove {
1032
- display: none;
1033
- }
1034
- .ql-snow .ql-tooltip.ql-editing input[type=text] {
1035
- display: inline-block;
1036
- }
1037
- .ql-snow .ql-tooltip.ql-editing a.ql-action::after {
1038
- border-right: 0;
1039
- content: "Save";
1040
- padding-right: 0;
1041
- }
1042
- .ql-snow .ql-tooltip[data-mode=link]::before {
1043
- content: "Enter link:";
104
+ white-space: nowrap;
1044
105
  }
1045
- .ql-snow .ql-tooltip[data-mode=formula]::before {
1046
- content: "Enter formula:";
106
+ .react-international-phone-country-selector-dropdown__list-item-dial-code {
107
+ color: var(--react-international-phone-dropdown-item-dial-code-color, gray);
108
+ font-size: var(--react-international-phone-dropdown-item-font-size, 14px);
1047
109
  }
1048
- .ql-snow .ql-tooltip[data-mode=video]::before {
1049
- content: "Enter video:";
110
+ .react-international-phone-country-selector-dropdown__list-item:hover {
111
+ background-color: var(--react-international-phone-selected-dropdown-item-background-color, var(--react-international-phone-selected-dropdown-item-background-color, whitesmoke));
112
+ cursor: pointer;
1050
113
  }
1051
- .ql-snow a {
1052
- color: #06c;
114
+ .react-international-phone-country-selector-dropdown__list-item--selected,
115
+ .react-international-phone-country-selector-dropdown__list-item--focused {
116
+ background-color: var(--react-international-phone-selected-dropdown-item-background-color, whitesmoke);
117
+ color: var(--react-international-phone-selected-dropdown-item-text-color, var(--react-international-phone-text-color, #222));
118
+ }
119
+ .react-international-phone-country-selector-dropdown__list-item--selected .react-international-phone-country-selector-dropdown__list-item-dial-code,
120
+ .react-international-phone-country-selector-dropdown__list-item--focused .react-international-phone-country-selector-dropdown__list-item-dial-code {
121
+ color: var(--react-international-phone-selected-dropdown-item-dial-code-color, var(--react-international-phone-dropdown-item-dial-code-color, gray));
122
+ }
123
+ .react-international-phone-country-selector-dropdown__list-item--focused {
124
+ background-color: var(--react-international-phone-selected-dropdown-item-background-color, var(--react-international-phone-selected-dropdown-item-background-color, whitesmoke));
125
+ }
126
+ .react-international-phone-dial-code-preview {
127
+ display: flex;
128
+ align-items: center;
129
+ justify-content: center;
130
+ padding: 0 8px;
131
+ border: 1px solid var(--react-international-phone-dial-code-preview-border-color, var(--react-international-phone-border-color, gainsboro));
132
+ margin-right: -1px;
133
+ background-color: var(--react-international-phone-dial-code-preview-background-color, var(--react-international-phone-background-color, white));
134
+ color: var(--react-international-phone-dial-code-preview-text-color, var(--react-international-phone-text-color, #222));
135
+ font-size: var(--react-international-phone-dial-code-preview-font-size, var(--react-international-phone-font-size, 13px));
136
+ }
137
+ .react-international-phone-dial-code-preview--disabled {
138
+ background-color: var(--react-international-phone-dial-code-preview-disabled-background-color, var(--react-international-phone-disabled-background-color, whitesmoke));
139
+ color: var(--react-international-phone-dial-code-preview-disabled-text-color, var(--react-international-phone-disabled-text-color, #666));
140
+ }
141
+ .react-international-phone-input-container {
142
+ display: flex;
143
+ }
144
+ .react-international-phone-input-container .react-international-phone-country-selector-button {
145
+ border-radius: var(--react-international-phone-border-radius, 4px);
146
+ margin-right: -1px;
147
+ border-bottom-right-radius: 0;
148
+ border-top-right-radius: 0;
149
+ }
150
+ .react-international-phone-input-container .react-international-phone-input {
151
+ overflow: visible;
152
+ height: var(--react-international-phone-height, 36px);
153
+ box-sizing: border-box;
154
+ padding: 0 8px;
155
+ border: 1px solid var(--react-international-phone-border-color, gainsboro);
156
+ border-radius: var(--react-international-phone-border-radius, 4px);
157
+ margin: 0;
158
+ background-color: var(--react-international-phone-background-color, white);
159
+ border-bottom-left-radius: 0;
160
+ border-top-left-radius: 0;
161
+ color: var(--react-international-phone-text-color, #222);
162
+ font-family: inherit;
163
+ font-size: var(--react-international-phone-font-size, 13px);
164
+ }
165
+ .react-international-phone-input-container .react-international-phone-input:focus {
166
+ outline: none;
1053
167
  }
1054
- .ql-container.ql-snow {
1055
- border: 1px solid #ccc;
168
+ .react-international-phone-input-container .react-international-phone-input--disabled {
169
+ background-color: var(--react-international-phone-disabled-background-color, whitesmoke);
170
+ color: var(--react-international-phone-disabled-text-color, #666);
1056
171
  }