react-mail-inbox 1.0.3 → 1.0.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.
package/dist/index.css CHANGED
@@ -1,716 +1,2 @@
1
- /* src/Components/Editor/EditorWrapper/editor.css */
2
- .my-editor-wrapper {
3
- position: relative;
4
- background-color: var(--editor-bg);
5
- }
6
- .my-editor-content {
7
- height: 500px;
8
- overflow-y: auto;
9
- outline: none;
10
- padding: 10px;
11
- box-sizing: border-box;
12
- background-color: var(--editor-bg);
13
- color: var(--text-color);
14
- }
15
- .my-editor-placeholder {
16
- position: absolute;
17
- top: 10px;
18
- left: 10px;
19
- color: var(--text-color);
20
- opacity: 0.5;
21
- pointer-events: none;
22
- }
23
- .editor-text-bold {
24
- font-weight: bold;
25
- }
26
- .editor-text-italic {
27
- font-style: italic;
28
- }
29
- .editor-text-strikethrough {
30
- text-decoration: line-through;
31
- }
32
- .editor-text-underline {
33
- text-decoration: underline;
34
- }
35
- .editor-text-underlineStrikethrough {
36
- text-decoration: underline line-through;
37
- }
38
- .editor-quote {
39
- margin: 0;
40
- margin-left: 20px;
41
- font-size: 15px;
42
- color: rgb(101, 103, 107);
43
- border-left-color: rgb(206, 208, 212);
44
- border-left-width: 4px;
45
- border-left-style: solid;
46
- padding-left: 16px;
47
- }
48
- .editor-list-ol {
49
- padding: 0;
50
- margin: 0;
51
- margin-left: 16px;
52
- }
53
- .editor-list-ul {
54
- padding: 0;
55
- margin: 0;
56
- margin-left: 16px;
57
- }
58
- .editor-listitem {
59
- margin: 8px 32px 8px 32px;
60
- }
61
- .editor-nested-listitem {
62
- list-style-type: none;
63
- }
64
- .editor-code {
65
- background-color: rgb(240, 242, 245);
66
- font-family:
67
- Menlo,
68
- Consolas,
69
- Monaco,
70
- monospace;
71
- display: block;
72
- padding: 8px 8px 8px 52px;
73
- line-height: 1.53;
74
- font-size: 13px;
75
- margin: 0;
76
- margin-top: 8px;
77
- margin-bottom: 8px;
78
- tab-size: 2;
79
- overflow-x: auto;
80
- position: relative;
81
- }
82
- .editor-text-code {
83
- background-color: #f0f2f5;
84
- padding: 1px 0.25rem;
85
- font-family:
86
- Menlo,
87
- Consolas,
88
- Monaco,
89
- monospace;
90
- font-size: 94%;
91
- }
92
- .editor-code:before {
93
- content: attr(data-gutter);
94
- position: absolute;
95
- background-color: #eee;
96
- left: 0;
97
- top: 0;
98
- border-right: 1px solid #ccc;
99
- padding: 8px;
100
- color: #777;
101
- white-space: pre-wrap;
102
- text-align: right;
103
- min-width: 25px;
104
- }
105
- .other ul {
106
- padding: 0;
107
- margin: 0;
108
- list-style-type: none;
109
- }
110
- .link-editor .link-input {
111
- display: block;
112
- width: calc(100% - 24px);
113
- box-sizing: border-box;
114
- margin: 8px 12px;
115
- padding: 8px 12px;
116
- border-radius: 15px;
117
- background-color: #eee;
118
- font-size: 15px;
119
- color: rgb(5, 5, 5);
120
- border: 0;
121
- outline: 0;
122
- position: relative;
123
- font-family: inherit;
124
- }
125
- .link-editor div.link-edit {
126
- background-size: 16px;
127
- background-position: center;
128
- background-repeat: no-repeat;
129
- width: 35px;
130
- vertical-align: -0.25em;
131
- position: absolute;
132
- right: 0;
133
- top: 0;
134
- bottom: 0;
135
- cursor: pointer;
136
- }
137
- .link-editor .link-input a {
138
- color: rgb(33, 111, 219);
139
- text-decoration: none;
140
- display: block;
141
- white-space: nowrap;
142
- overflow: hidden;
143
- margin-right: 30px;
144
- text-overflow: ellipsis;
145
- }
146
- .link-editor .link-input a:hover {
147
- text-decoration: underline;
148
- }
149
- .link-editor .button {
150
- width: 20px;
151
- height: 20px;
152
- display: inline-block;
153
- padding: 6px;
154
- border-radius: 8px;
155
- cursor: pointer;
156
- margin: 0 2px;
157
- }
158
- .link-editor .button.hovered {
159
- width: 20px;
160
- height: 20px;
161
- display: inline-block;
162
- background-color: #eee;
163
- }
164
-
165
- /* src/Components/core/ColorPicker/style.css */
166
- .color-picker-root {
167
- position: relative;
168
- display: inline-block;
169
- }
170
- .color-popover {
171
- background-color: var(--color-picker-bg);
172
- border: 1px solid var(--color-picker-border);
173
- padding: 5px;
174
- border-radius: 4px;
175
- }
176
- .toolbar-btn {
177
- display: inline-flex;
178
- align-items: center;
179
- gap: 6px;
180
- padding: 6px 10px;
181
- border-radius: 6px;
182
- border: 1px solid var(--color-picker-btn-border);
183
- background: var(--color-picker-btn-bg);
184
- cursor: pointer;
185
- font-family: inherit;
186
- }
187
- .color-columns {
188
- display: flex;
189
- gap: 28px;
190
- }
191
- .color-column {
192
- width: 50%;
193
- }
194
- .color-column h4 {
195
- margin: 0 0 10px 0;
196
- font-size: 16px;
197
- font-weight: 600;
198
- color: var(--color-picker-heading);
199
- }
200
- .row {
201
- display: flex;
202
- gap: 8px;
203
- margin-bottom: 10px;
204
- flex-wrap: wrap;
205
- }
206
- .accent-row {
207
- margin-bottom: 14px;
208
- }
209
- .palette {
210
- display: flex;
211
- flex-direction: column;
212
- gap: 6px;
213
- max-height: 220px;
214
- overflow: auto;
215
- padding-right: 4px;
216
- }
217
- .palette-row {
218
- display: flex;
219
- gap: 6px;
220
- }
221
- .swatch {
222
- width: 28px;
223
- height: 24px;
224
- border-radius: 4px;
225
- border: 1px solid var(--color-picker-swatch-border);
226
- padding: 0;
227
- display: inline-flex;
228
- align-items: center;
229
- justify-content: center;
230
- position: relative;
231
- cursor: pointer;
232
- outline: none;
233
- box-sizing: border-box;
234
- transition: transform .08s ease;
235
- }
236
- .swatch:hover {
237
- transform: translateY(-2px);
238
- box-shadow: 0 4px 10px var(--color-picker-swatch-hover-shadow);
239
- }
240
- .swatch .check {
241
- width: 16px;
242
- height: 16px;
243
- }
244
- .swatch[aria-pressed=true] {
245
- box-shadow: 0 0 0 2px var(--color-picker-swatch-selected-shadow) inset;
246
- border-color: var(--color-picker-swatch-selected-border);
247
- }
248
- .popover-footer {
249
- display: flex;
250
- justify-content: space-between;
251
- align-items: center;
252
- margin-top: 14px;
253
- }
254
- .btn {
255
- padding: 8px 12px;
256
- border-radius: 8px;
257
- border: 1px solid var(--color-picker-btn-border);
258
- background: var(--color-picker-btn-bg);
259
- cursor: pointer;
260
- color: var(--text-color);
261
- }
262
-
263
- /* src/Components/core/AlignmentSelect/style.css */
264
- .wrapper-alignment {
265
- display: flex;
266
- flex-direction: column;
267
- border: 1px solid #ccc;
268
- padding: 5px;
269
- border-radius: 5px;
270
- }
271
- .alignment-option {
272
- background: transparent;
273
- border: none;
274
- cursor: pointer;
275
- display: flex;
276
- justify-content: center;
277
- flex-direction: row-reverse;
278
- }
279
- .option-check.hidden {
280
- visibility: hidden;
281
- }
282
-
283
- /* src/Components/Editor/Toolbar/style.css */
284
- .toolbar-wrapper {
285
- display: flex;
286
- flex-direction: row;
287
- gap: 8px;
288
- align-items: flex-end;
289
- }
290
- .styling-toolbar {
291
- position: relative;
292
- }
293
- .toolbar-wrapper button {
294
- background: none;
295
- border: none;
296
- cursor: pointer;
297
- color: var(--icon-color);
298
- }
299
- .toolbar-wrapper button svg {
300
- color: var(--icon-color);
301
- }
302
- .toolbar-wrapper button.active-btn-toolbar {
303
- background-color: var(--selected-icon-bg);
304
- border-radius: 4px;
305
- padding: 1px 2px;
306
- }
307
- .toolbar-wrapper button.active-btn-toolbar svg {
308
- color: var(--selected-icon-color);
309
- }
310
- .btn {
311
- background: none;
312
- border: none;
313
- cursor: pointer;
314
- color: var(--icon-color);
315
- }
316
- .divider {
317
- display: inline-block;
318
- width: 1px;
319
- height: 25px;
320
- background: var(--input-border);
321
- margin: auto 0;
322
- }
323
- .styling-options {
324
- position: absolute;
325
- width: 600px;
326
- display: flex;
327
- justify-content: space-between;
328
- align-items: center;
329
- top: 0;
330
- transform: translateY(-125%);
331
- border: 1px solid var(--toolbar-border);
332
- border-radius: 4px;
333
- background: var(--toolbar-popup-bg);
334
- padding-inline: 5px;
335
- }
336
- .font-options {
337
- display: flex;
338
- flex-direction: column;
339
- gap: 4px;
340
- border: 1px solid var(--toolbar-border);
341
- border-radius: 4px;
342
- background: var(--toolbar-popup-bg);
343
- color: var(--text-color);
344
- }
345
- .font-option {
346
- display: flex;
347
- flex-direction: row;
348
- align-items: center;
349
- text-align: right;
350
- border-radius: 4px;
351
- padding-left: 15px;
352
- position: relative;
353
- background: var(--toolbar-popup-bg);
354
- color: var(--text-color);
355
- }
356
- .font-option:not(.heading) svg {
357
- position: absolute;
358
- left: 0px;
359
- top: 0px;
360
- width: 15px;
361
- height: 15px;
362
- }
363
- .file-upload-container {
364
- margin-bottom: 50px;
365
- }
366
- .tool-bar-button {
367
- margin-top: 5px;
368
- margin-bottom: 5px;
369
- }
370
- .tool-bar-button-icon {
371
- color: var(--icon-color);
372
- }
373
- .toolbar-wrapper {
374
- background-color: var(--toolbar-popup-bg);
375
- }
376
-
377
- /* src/Components/core/FloatingLinkEditor/index.css */
378
- .floating-link-editor {
379
- position: absolute;
380
- z-index: 100;
381
- top: -10000px;
382
- left: -10000px;
383
- margin-top: -6px;
384
- width: 280px;
385
- background-color: #fff;
386
- box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
387
- border-radius: 8px;
388
- display: flex;
389
- align-items: center;
390
- justify-content: space-between;
391
- opacity: 0;
392
- padding: 6px 10px;
393
- transition:
394
- opacity 0.25s ease,
395
- top 0.15s ease,
396
- left 0.15s ease;
397
- font-family: sans-serif;
398
- box-sizing: border-box;
399
- }
400
- .link-input {
401
- flex: 1;
402
- padding: 8px 10px;
403
- font-size: 14px;
404
- border: 1px solid #ccc;
405
- border-radius: 6px;
406
- outline: none;
407
- margin-right: 8px;
408
- }
409
- .link-input:focus {
410
- border-color: #007bff;
411
- }
412
- .link-display {
413
- flex: 1;
414
- background-color: #f3f3f3;
415
- border-radius: 6px;
416
- padding: 8px 10px;
417
- margin-right: 8px;
418
- overflow: hidden;
419
- text-overflow: ellipsis;
420
- white-space: nowrap;
421
- }
422
- .link-display a {
423
- text-decoration: none;
424
- color: #333;
425
- }
426
- .link-button {
427
- background: none;
428
- border: none;
429
- font-size: 18px;
430
- cursor: pointer;
431
- padding: 4px;
432
- border-radius: 4px;
433
- transition: background 0.2s;
434
- flex-shrink: 0;
435
- }
436
- .link-button:hover {
437
- background-color: #eaeaea;
438
- }
439
-
440
- /* src/Components/core/FileUploader/FilePreview.css */
441
- .fps-row {
442
- display: flex;
443
- align-items: center;
444
- justify-content: space-between;
445
- padding: 8px 12px;
446
- background: var(--file-preview-bg);
447
- border-top: 1px solid var(--file-preview-border);
448
- min-height: 36px;
449
- gap: 12px;
450
- font-family:
451
- system-ui,
452
- -apple-system,
453
- "Segoe UI",
454
- Roboto,
455
- "Helvetica Neue",
456
- Arial;
457
- }
458
- .fps-left {
459
- display: flex;
460
- align-items: baseline;
461
- gap: 4px;
462
- white-space: nowrap;
463
- overflow: hidden;
464
- text-overflow: ellipsis;
465
- }
466
- .fps-index {
467
- color: var(--file-preview-index-color);
468
- font-weight: 600;
469
- font-size: 14px;
470
- }
471
- .fps-filename {
472
- color: var(--file-preview-link-color);
473
- text-decoration: none;
474
- font-weight: 700;
475
- font-size: 16px;
476
- }
477
- .fps-filename:hover,
478
- .fps-filename:focus {
479
- text-decoration: underline;
480
- outline: none;
481
- }
482
- .fps-size {
483
- color: var(--file-preview-size-color);
484
- font-weight: 600;
485
- font-size: 14px;
486
- }
487
- .fps-close {
488
- background: transparent;
489
- border: none;
490
- font-size: 18px;
491
- line-height: 1;
492
- color: var(--file-preview-close-color);
493
- cursor: pointer;
494
- padding: 4px 8px;
495
- border-radius: 4px;
496
- }
497
- .fps-close:hover,
498
- .fps-close:focus {
499
- background: var(--file-preview-close-hover-bg);
500
- color: var(--file-preview-close-hover-color);
501
- outline: none;
502
- }
503
-
504
- /* src/Components/GmailWrapper/index.css */
505
- .react-mail-inbox-root {
506
- --editor-bg: #ffffff;
507
- --text-color: #000000;
508
- --icon-color: #000000;
509
- --pill-bg: #e0e0e0;
510
- --pill-text: #000000;
511
- --toolbar-popup-bg: #ffffff;
512
- --toolbar-border: #e0e0e0;
513
- --selected-icon-color: #000000;
514
- --selected-icon-bg: #e0e0e0;
515
- --input-bg: #ffffff;
516
- --input-border: #e0e0e0;
517
- --color-picker-bg: #ffffff;
518
- --color-picker-border: #ccc;
519
- --color-picker-heading: #111827;
520
- --color-picker-btn-bg: #fff;
521
- --color-picker-btn-border: #e6edf3;
522
- --color-picker-swatch-border: rgba(0, 0, 0, 0.06);
523
- --color-picker-swatch-hover-shadow: rgba(2, 6, 23, 0.08);
524
- --color-picker-swatch-selected-shadow: rgba(0, 0, 0, 0.08);
525
- --color-picker-swatch-selected-border: rgba(0, 0, 0, 0.18);
526
- --file-preview-bg: #ffffff;
527
- --file-preview-border: #e6e6e6;
528
- --file-preview-index-color: #0f172a;
529
- --file-preview-link-color: #0b63d6;
530
- --file-preview-size-color: #6b7280;
531
- --file-preview-close-color: #6b7280;
532
- --file-preview-close-hover-bg: rgba(0, 0, 0, 0.03);
533
- --file-preview-close-hover-color: #111827;
534
- }
535
- .react-mail-inbox-root[data-theme=dark] {
536
- --editor-bg: #34353C;
537
- --text-color: #ffffff;
538
- --icon-color: #8A8F98;
539
- --pill-bg: #62666D;
540
- --pill-text: #ffffff;
541
- --toolbar-popup-bg: #34353C;
542
- --toolbar-border: #62666D;
543
- --selected-icon-color: #8A8F98;
544
- --selected-icon-bg: #ffffff;
545
- --input-bg: #8A8F98;
546
- --input-border: #62666D;
547
- --color-picker-bg: #2a2b30;
548
- --color-picker-border: #62666D;
549
- --color-picker-heading: #ffffff;
550
- --color-picker-btn-bg: #34353C;
551
- --color-picker-btn-border: #62666D;
552
- --color-picker-swatch-border: rgba(255, 255, 255, 0.1);
553
- --color-picker-swatch-hover-shadow: rgba(255, 255, 255, 0.1);
554
- --color-picker-swatch-selected-shadow: rgba(255, 255, 255, 0.15);
555
- --color-picker-swatch-selected-border: rgba(255, 255, 255, 0.3);
556
- --file-preview-bg: #34353C;
557
- --file-preview-border: #62666D;
558
- --file-preview-index-color: #ffffff;
559
- --file-preview-link-color: #4A9EFF;
560
- --file-preview-size-color: #8A8F98;
561
- --file-preview-close-color: #8A8F98;
562
- --file-preview-close-hover-bg: rgba(255, 255, 255, 0.1);
563
- --file-preview-close-hover-color: #ffffff;
564
- }
565
- .react-mail-inbox-root * {
566
- margin: 0;
567
- padding: 0;
568
- box-sizing: border-box;
569
- }
570
- .react-mail-inbox-root code {
571
- font-family:
572
- source-code-pro,
573
- Menlo,
574
- Monaco,
575
- Consolas,
576
- "Courier New",
577
- monospace;
578
- }
579
- .filter-popup-content {
580
- background-color: transparent !important;
581
- border: 0 !important;
582
- z-index: 9999 !important;
583
- }
584
- .filter-popup-arrow {
585
- display: none;
586
- }
587
- .filter-popup-overlay {
588
- z-index: 999 !important;
589
- }
590
- .gmail-header {
591
- background-color: var(--editor-bg);
592
- color: var(--text-color);
593
- }
594
- .gmail-header *::placeholder {
595
- background-color: var(--editor-bg);
596
- color: var(--text-color);
597
- }
598
- .input-header {
599
- border: none;
600
- background: transparent;
601
- outline: none;
602
- width: 100%;
603
- height: 40px;
604
- padding-left: 5px;
605
- padding-right: 5px;
606
- font-size: 14px;
607
- box-sizing: border-box;
608
- color: var(--text-color);
609
- }
610
- .container-receipts {
611
- display: flex;
612
- flex-direction: row;
613
- align-items: center;
614
- gap: 10px;
615
- }
616
- .input-trigger {
617
- width: 100%;
618
- }
619
- .options-dropdown {
620
- display: flex;
621
- flex-direction: column;
622
- gap: 5px;
623
- width: 500px;
624
- border: 1px solid var(--toolbar-border);
625
- background: var(--toolbar-popup-bg);
626
- border-radius: 5px;
627
- }
628
- .option-dropdown {
629
- height: 50px;
630
- border: none;
631
- padding: 5px;
632
- text-align: left;
633
- background: transparent;
634
- outline: none;
635
- cursor: pointer;
636
- width: 100%;
637
- padding-left: 5px;
638
- padding-right: 5px;
639
- font-size: 14px;
640
- box-sizing: border-box;
641
- color: var(--text-color);
642
- }
643
- .option-dropdown:hover {
644
- background: var(--pill-bg);
645
- }
646
- .option-dropdown.selected {
647
- background: var(--pill-bg);
648
- }
649
- .option-dropdown:focus {
650
- background: var(--pill-bg);
651
- outline: 2px solid var(--selected-icon-bg);
652
- outline-offset: -2px;
653
- }
654
- .container-receipts {
655
- width: 100%;
656
- }
657
- .emails {
658
- border: 1px solid var(--pill-bg);
659
- background-color: var(--pill-bg);
660
- padding: 5px 10px;
661
- border-radius: 20px;
662
- display: flex;
663
- flex-direction: row;
664
- align-items: center;
665
- gap: 5px;
666
- width: 100%;
667
- box-sizing: border-box;
668
- color: var(--pill-text);
669
- }
670
- .emails-close {
671
- cursor: pointer;
672
- width: 15px;
673
- height: 15px;
674
- border: none;
675
- background: transparent;
676
- outline: none;
677
- }
678
- .emails-close svg {
679
- cursor: pointer;
680
- width: 15px;
681
- height: 15px;
682
- color: var(--pill-text);
683
- }
684
- .skeleton-loader {
685
- pointer-events: none;
686
- padding: 8px 10px;
687
- }
688
- .skeleton-line {
689
- background:
690
- linear-gradient(
691
- 90deg,
692
- #f0f0f0 25%,
693
- #e0e0e0 50%,
694
- #f0f0f0 75%);
695
- background-size: 200% 100%;
696
- animation: shimmer 1.5s infinite;
697
- border-radius: 4px;
698
- }
699
- .skeleton-name {
700
- height: 16px;
701
- width: 60%;
702
- margin-bottom: 8px;
703
- }
704
- .skeleton-email {
705
- height: 14px;
706
- width: 80%;
707
- }
708
- @keyframes shimmer {
709
- 0% {
710
- background-position: 200% 0;
711
- }
712
- 100% {
713
- background-position: -200% 0;
714
- }
715
- }
1
+ .my-editor-wrapper{position:relative;background-color:var(--editor-bg)}.my-editor-content{height:500px;overflow-y:auto;outline:none;padding:10px;box-sizing:border-box;background-color:var(--editor-bg);color:var(--text-color)}.my-editor-placeholder{position:absolute;top:10px;left:10px;color:var(--text-color);opacity:.5;pointer-events:none}.editor-text-bold{font-weight:700}.editor-text-italic{font-style:italic}.editor-text-strikethrough{text-decoration:line-through}.editor-text-underline{text-decoration:underline}.editor-text-underlineStrikethrough{text-decoration:underline line-through}.editor-quote{margin:0 0 0 20px;font-size:15px;color:#65676b;border-left-color:#ced0d4;border-left-width:4px;border-left-style:solid;padding-left:16px}.editor-list-ol,.editor-list-ul{padding:0;margin:0 0 0 16px}.editor-listitem{margin:8px 32px}.editor-nested-listitem{list-style-type:none}.editor-code{background-color:#f0f2f5;font-family:Menlo,Consolas,Monaco,monospace;display:block;padding:8px 8px 8px 52px;line-height:1.53;font-size:13px;margin:8px 0;tab-size:2;overflow-x:auto;position:relative}.editor-text-code{background-color:#f0f2f5;padding:1px .25rem;font-family:Menlo,Consolas,Monaco,monospace;font-size:94%}.editor-code:before{content:attr(data-gutter);position:absolute;background-color:#eee;left:0;top:0;border-right:1px solid #ccc;padding:8px;color:#777;white-space:pre-wrap;text-align:right;min-width:25px}.other ul{padding:0;margin:0;list-style-type:none}.link-editor .link-input{display:block;width:calc(100% - 24px);box-sizing:border-box;margin:8px 12px;padding:8px 12px;border-radius:15px;background-color:#eee;font-size:15px;color:#050505;border:0;outline:0;position:relative;font-family:inherit}.link-editor div.link-edit{background-size:16px;background-position:center;background-repeat:no-repeat;width:35px;vertical-align:-.25em;position:absolute;right:0;top:0;bottom:0;cursor:pointer}.link-editor .link-input a{color:#216fdb;text-decoration:none;display:block;white-space:nowrap;overflow:hidden;margin-right:30px;text-overflow:ellipsis}.link-editor .link-input a:hover{text-decoration:underline}.link-editor .button{width:20px;height:20px;display:inline-block;padding:6px;border-radius:8px;cursor:pointer;margin:0 2px}.link-editor .button.hovered{width:20px;height:20px;display:inline-block;background-color:#eee}.color-picker-root{position:relative;display:inline-block}.color-popover{background-color:var(--color-picker-bg);border:1px solid var(--color-picker-border);padding:5px;border-radius:4px}.toolbar-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:6px;border:1px solid var(--color-picker-btn-border);background:var(--color-picker-btn-bg);cursor:pointer;font-family:inherit}.color-columns{display:flex;gap:28px}.color-column{width:50%}.color-column h4{margin:0 0 10px;font-size:16px;font-weight:600;color:var(--color-picker-heading)}.row{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}.accent-row{margin-bottom:14px}.palette{display:flex;flex-direction:column;gap:6px;max-height:220px;overflow:auto;padding-right:4px}.palette-row{display:flex;gap:6px}.swatch{width:28px;height:24px;border-radius:4px;border:1px solid var(--color-picker-swatch-border);padding:0;display:inline-flex;align-items:center;justify-content:center;position:relative;cursor:pointer;outline:none;box-sizing:border-box;transition:transform .08s ease}.swatch:hover{transform:translateY(-2px);box-shadow:0 4px 10px var(--color-picker-swatch-hover-shadow)}.swatch .check{width:16px;height:16px}.swatch[aria-pressed=true]{box-shadow:0 0 0 2px var(--color-picker-swatch-selected-shadow) inset;border-color:var(--color-picker-swatch-selected-border)}.popover-footer{display:flex;justify-content:space-between;align-items:center;margin-top:14px}.btn{padding:8px 12px;border-radius:8px;border:1px solid var(--color-picker-btn-border);background:var(--color-picker-btn-bg);cursor:pointer;color:var(--text-color)}.wrapper-alignment{display:flex;flex-direction:column;border:1px solid #ccc;padding:5px;border-radius:5px}.alignment-option{background:transparent;border:none;cursor:pointer;display:flex;justify-content:center;flex-direction:row-reverse}.option-check.hidden{visibility:hidden}.toolbar-wrapper{display:flex;flex-direction:row;gap:8px;align-items:flex-end}.styling-toolbar{position:relative}.toolbar-wrapper button{background:none;border:none;cursor:pointer;color:var(--icon-color)}.toolbar-wrapper button svg{color:var(--icon-color)}.toolbar-wrapper button.active-btn-toolbar{background-color:var(--selected-icon-bg);border-radius:4px;padding:1px 2px}.toolbar-wrapper button.active-btn-toolbar svg{color:var(--selected-icon-color)}.btn{background:none;border:none;cursor:pointer;color:var(--icon-color)}.divider{display:inline-block;width:1px;height:25px;background:var(--input-border);margin:auto 0}.styling-options{position:absolute;width:600px;display:flex;justify-content:space-between;align-items:center;top:0;transform:translateY(-125%);border:1px solid var(--toolbar-border);border-radius:4px;background:var(--toolbar-popup-bg);padding-inline:5px}.font-options{display:flex;flex-direction:column;gap:4px;border:1px solid var(--toolbar-border);border-radius:4px;background:var(--toolbar-popup-bg);color:var(--text-color)}.font-option{display:flex;flex-direction:row;align-items:center;text-align:right;border-radius:4px;padding-left:15px;position:relative;background:var(--toolbar-popup-bg);color:var(--text-color)}.font-option:not(.heading) svg{position:absolute;left:0;top:0;width:15px;height:15px}.file-upload-container{margin-bottom:50px}.tool-bar-button{margin-top:5px;margin-bottom:5px}.tool-bar-button-icon{color:var(--icon-color)}.toolbar-wrapper{background-color:var(--toolbar-popup-bg)}.floating-link-editor{position:absolute;z-index:100;top:-10000px;left:-10000px;margin-top:-6px;width:280px;background-color:#fff;box-shadow:0 5px 10px #0000004d;border-radius:8px;display:flex;align-items:center;justify-content:space-between;opacity:0;padding:6px 10px;transition:opacity .25s ease,top .15s ease,left .15s ease;font-family:sans-serif;box-sizing:border-box}.link-input{flex:1;padding:8px 10px;font-size:14px;border:1px solid #ccc;border-radius:6px;outline:none;margin-right:8px}.link-input:focus{border-color:#007bff}.link-display{flex:1;background-color:#f3f3f3;border-radius:6px;padding:8px 10px;margin-right:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.link-display a{text-decoration:none;color:#333}.link-button{background:none;border:none;font-size:18px;cursor:pointer;padding:4px;border-radius:4px;transition:background .2s;flex-shrink:0}.link-button:hover{background-color:#eaeaea}.fps-row{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--file-preview-bg);border-top:1px solid var(--file-preview-border);min-height:36px;gap:12px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial}.fps-left{display:flex;align-items:baseline;gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fps-index{color:var(--file-preview-index-color);font-weight:600;font-size:14px}.fps-filename{color:var(--file-preview-link-color);text-decoration:none;font-weight:700;font-size:16px}.fps-filename:hover,.fps-filename:focus{text-decoration:underline;outline:none}.fps-size{color:var(--file-preview-size-color);font-weight:600;font-size:14px}.fps-close{background:transparent;border:none;font-size:18px;line-height:1;color:var(--file-preview-close-color);cursor:pointer;padding:4px 8px;border-radius:4px}.fps-close:hover,.fps-close:focus{background:var(--file-preview-close-hover-bg);color:var(--file-preview-close-hover-color);outline:none}.react-mail-inbox-root{--editor-bg: #ffffff;--text-color: #000000;--icon-color: #000000;--pill-bg: #e0e0e0;--pill-text: #000000;--toolbar-popup-bg: #ffffff;--toolbar-border: #e0e0e0;--selected-icon-color: #000000;--selected-icon-bg: #e0e0e0;--input-bg: #ffffff;--input-border: #e0e0e0;--color-picker-bg: #ffffff;--color-picker-border: #ccc;--color-picker-heading: #111827;--color-picker-btn-bg: #fff;--color-picker-btn-border: #e6edf3;--color-picker-swatch-border: rgba(0, 0, 0, .06);--color-picker-swatch-hover-shadow: rgba(2, 6, 23, .08);--color-picker-swatch-selected-shadow: rgba(0, 0, 0, .08);--color-picker-swatch-selected-border: rgba(0, 0, 0, .18);--file-preview-bg: #ffffff;--file-preview-border: #e6e6e6;--file-preview-index-color: #0f172a;--file-preview-link-color: #0b63d6;--file-preview-size-color: #6b7280;--file-preview-close-color: #6b7280;--file-preview-close-hover-bg: rgba(0, 0, 0, .03);--file-preview-close-hover-color: #111827}.react-mail-inbox-root[data-theme=dark]{--editor-bg: #34353C;--text-color: #ffffff;--icon-color: #8A8F98;--pill-bg: #62666D;--pill-text: #ffffff;--toolbar-popup-bg: #34353C;--toolbar-border: #62666D;--selected-icon-color: #8A8F98;--selected-icon-bg: #ffffff;--input-bg: #8A8F98;--input-border: #62666D;--color-picker-bg: #2a2b30;--color-picker-border: #62666D;--color-picker-heading: #ffffff;--color-picker-btn-bg: #34353C;--color-picker-btn-border: #62666D;--color-picker-swatch-border: rgba(255, 255, 255, .1);--color-picker-swatch-hover-shadow: rgba(255, 255, 255, .1);--color-picker-swatch-selected-shadow: rgba(255, 255, 255, .15);--color-picker-swatch-selected-border: rgba(255, 255, 255, .3);--file-preview-bg: #34353C;--file-preview-border: #62666D;--file-preview-index-color: #ffffff;--file-preview-link-color: #4A9EFF;--file-preview-size-color: #8A8F98;--file-preview-close-color: #8A8F98;--file-preview-close-hover-bg: rgba(255, 255, 255, .1);--file-preview-close-hover-color: #ffffff}.react-mail-inbox-root *{margin:0;padding:0;box-sizing:border-box}.react-mail-inbox-root code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.filter-popup-content{background-color:transparent!important;border:0!important;z-index:9999!important}.filter-popup-arrow{display:none}.filter-popup-overlay{z-index:999!important}.gmail-header{background-color:var(--editor-bg);color:var(--text-color)}.gmail-header *::placeholder{background-color:var(--editor-bg);color:var(--text-color)}.input-header{border:none;background:transparent;outline:none;width:100%;height:40px;padding-left:5px;padding-right:5px;font-size:14px;box-sizing:border-box;color:var(--text-color)}.container-receipts{display:flex;flex-direction:row;align-items:center;gap:10px}.input-trigger{width:100%}.options-dropdown{display:flex;flex-direction:column;gap:5px;width:500px;border:1px solid var(--toolbar-border);background:var(--toolbar-popup-bg);border-radius:5px}.option-dropdown{height:50px;border:none;text-align:left;background:transparent;outline:none;cursor:pointer;width:100%;padding:5px;font-size:14px;box-sizing:border-box;color:var(--text-color)}.option-dropdown:hover,.option-dropdown.selected{background:var(--pill-bg)}.option-dropdown:focus{background:var(--pill-bg);outline:2px solid var(--selected-icon-bg);outline-offset:-2px}.container-receipts{width:100%}.emails{border:1px solid var(--pill-bg);background-color:var(--pill-bg);padding:5px 10px;border-radius:20px;display:flex;flex-direction:row;align-items:center;gap:5px;width:100%;box-sizing:border-box;color:var(--pill-text)}.emails-close{cursor:pointer;width:15px;height:15px;border:none;background:transparent;outline:none}.emails-close svg{cursor:pointer;width:15px;height:15px;color:var(--pill-text)}.skeleton-loader{pointer-events:none;padding:8px 10px}.skeleton-line{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px}.skeleton-name{height:16px;width:60%;margin-bottom:8px}.skeleton-email{height:14px;width:80%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}
716
2
  /*# sourceMappingURL=index.css.map */