@pnkx-lib/ui 1.9.22 → 1.9.23

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.
@@ -0,0 +1,820 @@
1
+ @charset "UTF-8";
2
+ .react-datepicker__year-read-view--down-arrow,
3
+ .react-datepicker__month-read-view--down-arrow,
4
+ .react-datepicker__month-year-read-view--down-arrow, .react-datepicker__navigation-icon::before {
5
+ border-color: #ccc;
6
+ border-style: solid;
7
+ border-width: 3px 3px 0 0;
8
+ content: "";
9
+ display: block;
10
+ height: 9px;
11
+ position: absolute;
12
+ top: 6px;
13
+ width: 9px;
14
+ }
15
+ .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
16
+ margin-left: -4px;
17
+ position: absolute;
18
+ width: 0;
19
+ }
20
+ .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after {
21
+ box-sizing: content-box;
22
+ position: absolute;
23
+ border: 8px solid transparent;
24
+ height: 0;
25
+ width: 1px;
26
+ content: "";
27
+ z-index: -1;
28
+ border-width: 8px;
29
+ left: -8px;
30
+ }
31
+ .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before {
32
+ border-bottom-color: #aeaeae;
33
+ }
34
+
35
+ .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
36
+ top: 0;
37
+ margin-top: -8px;
38
+ }
39
+ .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after {
40
+ border-top: none;
41
+ border-bottom-color: #f0f0f0;
42
+ }
43
+ .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after {
44
+ top: 0;
45
+ }
46
+ .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before {
47
+ top: -1px;
48
+ border-bottom-color: #aeaeae;
49
+ }
50
+
51
+ .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {
52
+ bottom: 0;
53
+ margin-bottom: -8px;
54
+ }
55
+ .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after {
56
+ border-bottom: none;
57
+ border-top-color: #fff;
58
+ }
59
+ .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after {
60
+ bottom: 0;
61
+ }
62
+ .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before {
63
+ bottom: -1px;
64
+ border-top-color: #aeaeae;
65
+ }
66
+
67
+ .react-datepicker-wrapper {
68
+ display: inline-block;
69
+ padding: 0;
70
+ border: 0;
71
+ }
72
+
73
+ .react-datepicker {
74
+ font-family: "Helvetica Neue", helvetica, arial, sans-serif;
75
+ font-size: 0.8rem;
76
+ background-color: #fff;
77
+ color: #000;
78
+ border: 1px solid #aeaeae;
79
+ border-radius: 0.3rem;
80
+ display: inline-block;
81
+ position: relative;
82
+ }
83
+
84
+ .react-datepicker--time-only .react-datepicker__triangle {
85
+ left: 35px;
86
+ }
87
+ .react-datepicker--time-only .react-datepicker__time-container {
88
+ border-left: 0;
89
+ }
90
+ .react-datepicker--time-only .react-datepicker__time,
91
+ .react-datepicker--time-only .react-datepicker__time-box {
92
+ border-bottom-left-radius: 0.3rem;
93
+ border-bottom-right-radius: 0.3rem;
94
+ }
95
+
96
+ .react-datepicker__triangle {
97
+ position: absolute;
98
+ left: 50px;
99
+ }
100
+
101
+ .react-datepicker-popper {
102
+ z-index: 1;
103
+ }
104
+ .react-datepicker-popper[data-placement^=bottom] {
105
+ padding-top: 10px;
106
+ }
107
+ .react-datepicker-popper[data-placement=bottom-end] .react-datepicker__triangle, .react-datepicker-popper[data-placement=top-end] .react-datepicker__triangle {
108
+ left: auto;
109
+ right: 50px;
110
+ }
111
+ .react-datepicker-popper[data-placement^=top] {
112
+ padding-bottom: 10px;
113
+ }
114
+ .react-datepicker-popper[data-placement^=right] {
115
+ padding-left: 8px;
116
+ }
117
+ .react-datepicker-popper[data-placement^=right] .react-datepicker__triangle {
118
+ left: auto;
119
+ right: 42px;
120
+ }
121
+ .react-datepicker-popper[data-placement^=left] {
122
+ padding-right: 8px;
123
+ }
124
+ .react-datepicker-popper[data-placement^=left] .react-datepicker__triangle {
125
+ left: 42px;
126
+ right: auto;
127
+ }
128
+
129
+ .react-datepicker__header {
130
+ text-align: center;
131
+ background-color: #f0f0f0;
132
+ border-bottom: 1px solid #aeaeae;
133
+ border-top-left-radius: 0.3rem;
134
+ padding: 8px 0;
135
+ position: relative;
136
+ }
137
+ .react-datepicker__header--time {
138
+ padding-bottom: 8px;
139
+ padding-left: 5px;
140
+ padding-right: 5px;
141
+ }
142
+ .react-datepicker__header--time:not(.react-datepicker__header--time--only) {
143
+ border-top-left-radius: 0;
144
+ }
145
+ .react-datepicker__header:not(.react-datepicker__header--has-time-select) {
146
+ border-top-right-radius: 0.3rem;
147
+ }
148
+
149
+ .react-datepicker__year-dropdown-container--select,
150
+ .react-datepicker__month-dropdown-container--select,
151
+ .react-datepicker__month-year-dropdown-container--select,
152
+ .react-datepicker__year-dropdown-container--scroll,
153
+ .react-datepicker__month-dropdown-container--scroll,
154
+ .react-datepicker__month-year-dropdown-container--scroll {
155
+ display: inline-block;
156
+ margin: 0 15px;
157
+ }
158
+
159
+ .react-datepicker__current-month,
160
+ .react-datepicker-time__header,
161
+ .react-datepicker-year-header {
162
+ margin-top: 0;
163
+ color: #000;
164
+ font-weight: bold;
165
+ font-size: 0.944rem;
166
+ }
167
+
168
+ .react-datepicker-time__header {
169
+ text-overflow: ellipsis;
170
+ white-space: nowrap;
171
+ overflow: hidden;
172
+ }
173
+
174
+ .react-datepicker__navigation {
175
+ align-items: center;
176
+ background: none;
177
+ display: flex;
178
+ justify-content: center;
179
+ text-align: center;
180
+ cursor: pointer;
181
+ position: absolute;
182
+ top: 2px;
183
+ padding: 0;
184
+ border: none;
185
+ z-index: 1;
186
+ height: 32px;
187
+ width: 32px;
188
+ text-indent: -999em;
189
+ overflow: hidden;
190
+ }
191
+ .react-datepicker__navigation--previous {
192
+ left: 2px;
193
+ }
194
+ .react-datepicker__navigation--next {
195
+ right: 2px;
196
+ }
197
+ .react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
198
+ right: 85px;
199
+ }
200
+ .react-datepicker__navigation--years {
201
+ position: relative;
202
+ top: 0;
203
+ display: block;
204
+ margin-left: auto;
205
+ margin-right: auto;
206
+ }
207
+ .react-datepicker__navigation--years-previous {
208
+ top: 4px;
209
+ }
210
+ .react-datepicker__navigation--years-upcoming {
211
+ top: -4px;
212
+ }
213
+ .react-datepicker__navigation:hover *::before {
214
+ border-color: #a6a6a6;
215
+ }
216
+
217
+ .react-datepicker__navigation-icon {
218
+ position: relative;
219
+ top: -1px;
220
+ font-size: 20px;
221
+ width: 0;
222
+ }
223
+ .react-datepicker__navigation-icon--next {
224
+ left: -2px;
225
+ }
226
+ .react-datepicker__navigation-icon--next::before {
227
+ transform: rotate(45deg);
228
+ left: -7px;
229
+ }
230
+ .react-datepicker__navigation-icon--previous {
231
+ right: -2px;
232
+ }
233
+ .react-datepicker__navigation-icon--previous::before {
234
+ transform: rotate(225deg);
235
+ right: -7px;
236
+ }
237
+
238
+ .react-datepicker__month-container {
239
+ float: left;
240
+ }
241
+
242
+ .react-datepicker__year {
243
+ margin: 0.4rem;
244
+ text-align: center;
245
+ }
246
+ .react-datepicker__year-wrapper {
247
+ display: flex;
248
+ flex-wrap: wrap;
249
+ max-width: 180px;
250
+ }
251
+ .react-datepicker__year .react-datepicker__year-text {
252
+ display: inline-block;
253
+ width: 4rem;
254
+ margin: 2px;
255
+ }
256
+
257
+ .react-datepicker__month {
258
+ margin: 0.4rem;
259
+ text-align: center;
260
+ }
261
+ .react-datepicker__month .react-datepicker__month-text,
262
+ .react-datepicker__month .react-datepicker__quarter-text {
263
+ display: inline-block;
264
+ width: 4rem;
265
+ margin: 2px;
266
+ }
267
+
268
+ .react-datepicker__input-time-container {
269
+ clear: both;
270
+ width: 100%;
271
+ float: left;
272
+ margin: 5px 0 10px 15px;
273
+ text-align: left;
274
+ }
275
+ .react-datepicker__input-time-container .react-datepicker-time__caption {
276
+ display: inline-block;
277
+ }
278
+ .react-datepicker__input-time-container .react-datepicker-time__input-container {
279
+ display: inline-block;
280
+ }
281
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input {
282
+ display: inline-block;
283
+ margin-left: 10px;
284
+ }
285
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input {
286
+ width: auto;
287
+ }
288
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,
289
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button {
290
+ -webkit-appearance: none;
291
+ margin: 0;
292
+ }
293
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time] {
294
+ -moz-appearance: textfield;
295
+ }
296
+ .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter {
297
+ margin-left: 5px;
298
+ display: inline-block;
299
+ }
300
+
301
+ .react-datepicker__time-container {
302
+ float: right;
303
+ border-left: 1px solid #aeaeae;
304
+ width: 85px;
305
+ }
306
+ .react-datepicker__time-container--with-today-button {
307
+ display: inline;
308
+ border: 1px solid #aeaeae;
309
+ border-radius: 0.3rem;
310
+ position: absolute;
311
+ right: -87px;
312
+ top: 0;
313
+ }
314
+ .react-datepicker__time-container .react-datepicker__time {
315
+ position: relative;
316
+ background: white;
317
+ border-bottom-right-radius: 0.3rem;
318
+ }
319
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
320
+ width: 85px;
321
+ overflow-x: hidden;
322
+ margin: 0 auto;
323
+ text-align: center;
324
+ border-bottom-right-radius: 0.3rem;
325
+ }
326
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {
327
+ list-style: none;
328
+ margin: 0;
329
+ height: calc(195px + 1.7rem / 2);
330
+ overflow-y: scroll;
331
+ padding-right: 0;
332
+ padding-left: 0;
333
+ width: 100%;
334
+ box-sizing: content-box;
335
+ }
336
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
337
+ height: 30px;
338
+ padding: 5px 10px;
339
+ white-space: nowrap;
340
+ }
341
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
342
+ cursor: pointer;
343
+ background-color: #f0f0f0;
344
+ }
345
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
346
+ background-color: #216ba5;
347
+ color: white;
348
+ font-weight: bold;
349
+ }
350
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
351
+ background-color: #216ba5;
352
+ }
353
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {
354
+ color: #ccc;
355
+ }
356
+ .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {
357
+ cursor: default;
358
+ background-color: transparent;
359
+ }
360
+
361
+ .react-datepicker__week-number {
362
+ color: #ccc;
363
+ display: inline-block;
364
+ width: 1.7rem;
365
+ line-height: 1.7rem;
366
+ text-align: center;
367
+ margin: 0.166rem;
368
+ }
369
+ .react-datepicker__week-number.react-datepicker__week-number--clickable {
370
+ cursor: pointer;
371
+ }
372
+ .react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected,
373
+ .react-datepicker__week-number--keyboard-selected):hover {
374
+ border-radius: 0.3rem;
375
+ background-color: #f0f0f0;
376
+ }
377
+ .react-datepicker__week-number--selected {
378
+ border-radius: 0.3rem;
379
+ background-color: #216ba5;
380
+ color: #fff;
381
+ }
382
+ .react-datepicker__week-number--selected:hover {
383
+ background-color: #1d5d90;
384
+ }
385
+ .react-datepicker__week-number--keyboard-selected {
386
+ border-radius: 0.3rem;
387
+ background-color: #2a87d0;
388
+ color: #fff;
389
+ }
390
+ .react-datepicker__week-number--keyboard-selected:hover {
391
+ background-color: #1d5d90;
392
+ }
393
+
394
+ .react-datepicker__day-names {
395
+ white-space: nowrap;
396
+ margin-bottom: -8px;
397
+ }
398
+
399
+ .react-datepicker__week {
400
+ white-space: nowrap;
401
+ }
402
+
403
+ .react-datepicker__day-name,
404
+ .react-datepicker__day,
405
+ .react-datepicker__time-name {
406
+ color: #000;
407
+ display: inline-block;
408
+ width: 1.7rem;
409
+ line-height: 1.7rem;
410
+ text-align: center;
411
+ margin: 0.166rem;
412
+ }
413
+
414
+ .react-datepicker__day,
415
+ .react-datepicker__month-text,
416
+ .react-datepicker__quarter-text,
417
+ .react-datepicker__year-text {
418
+ cursor: pointer;
419
+ }
420
+ .react-datepicker__day:hover,
421
+ .react-datepicker__month-text:hover,
422
+ .react-datepicker__quarter-text:hover,
423
+ .react-datepicker__year-text:hover {
424
+ border-radius: 0.3rem;
425
+ background-color: #f0f0f0;
426
+ }
427
+ .react-datepicker__day--today,
428
+ .react-datepicker__month-text--today,
429
+ .react-datepicker__quarter-text--today,
430
+ .react-datepicker__year-text--today {
431
+ font-weight: bold;
432
+ }
433
+ .react-datepicker__day--highlighted,
434
+ .react-datepicker__month-text--highlighted,
435
+ .react-datepicker__quarter-text--highlighted,
436
+ .react-datepicker__year-text--highlighted {
437
+ border-radius: 0.3rem;
438
+ background-color: #3dcc4a;
439
+ color: #fff;
440
+ }
441
+ .react-datepicker__day--highlighted:hover,
442
+ .react-datepicker__month-text--highlighted:hover,
443
+ .react-datepicker__quarter-text--highlighted:hover,
444
+ .react-datepicker__year-text--highlighted:hover {
445
+ background-color: #32be3f;
446
+ }
447
+ .react-datepicker__day--highlighted-custom-1,
448
+ .react-datepicker__month-text--highlighted-custom-1,
449
+ .react-datepicker__quarter-text--highlighted-custom-1,
450
+ .react-datepicker__year-text--highlighted-custom-1 {
451
+ color: magenta;
452
+ }
453
+ .react-datepicker__day--highlighted-custom-2,
454
+ .react-datepicker__month-text--highlighted-custom-2,
455
+ .react-datepicker__quarter-text--highlighted-custom-2,
456
+ .react-datepicker__year-text--highlighted-custom-2 {
457
+ color: green;
458
+ }
459
+ .react-datepicker__day--holidays,
460
+ .react-datepicker__month-text--holidays,
461
+ .react-datepicker__quarter-text--holidays,
462
+ .react-datepicker__year-text--holidays {
463
+ position: relative;
464
+ border-radius: 0.3rem;
465
+ background-color: #ff6803;
466
+ color: #fff;
467
+ }
468
+ .react-datepicker__day--holidays .holiday-overlay,
469
+ .react-datepicker__month-text--holidays .holiday-overlay,
470
+ .react-datepicker__quarter-text--holidays .holiday-overlay,
471
+ .react-datepicker__year-text--holidays .holiday-overlay {
472
+ position: absolute;
473
+ bottom: 100%;
474
+ left: 50%;
475
+ transform: translateX(-50%);
476
+ background-color: #333;
477
+ color: #fff;
478
+ padding: 4px;
479
+ border-radius: 4px;
480
+ white-space: nowrap;
481
+ visibility: hidden;
482
+ opacity: 0;
483
+ transition: visibility 0s, opacity 0.3s ease-in-out;
484
+ }
485
+ .react-datepicker__day--holidays:hover,
486
+ .react-datepicker__month-text--holidays:hover,
487
+ .react-datepicker__quarter-text--holidays:hover,
488
+ .react-datepicker__year-text--holidays:hover {
489
+ background-color: #cf5300;
490
+ }
491
+ .react-datepicker__day--holidays:hover .holiday-overlay,
492
+ .react-datepicker__month-text--holidays:hover .holiday-overlay,
493
+ .react-datepicker__quarter-text--holidays:hover .holiday-overlay,
494
+ .react-datepicker__year-text--holidays:hover .holiday-overlay {
495
+ visibility: visible;
496
+ opacity: 1;
497
+ }
498
+ .react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range,
499
+ .react-datepicker__month-text--selected,
500
+ .react-datepicker__month-text--in-selecting-range,
501
+ .react-datepicker__month-text--in-range,
502
+ .react-datepicker__quarter-text--selected,
503
+ .react-datepicker__quarter-text--in-selecting-range,
504
+ .react-datepicker__quarter-text--in-range,
505
+ .react-datepicker__year-text--selected,
506
+ .react-datepicker__year-text--in-selecting-range,
507
+ .react-datepicker__year-text--in-range {
508
+ border-radius: 0.3rem;
509
+ background-color: #216ba5;
510
+ color: #fff;
511
+ }
512
+ .react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover, .react-datepicker__day--in-range:hover,
513
+ .react-datepicker__month-text--selected:hover,
514
+ .react-datepicker__month-text--in-selecting-range:hover,
515
+ .react-datepicker__month-text--in-range:hover,
516
+ .react-datepicker__quarter-text--selected:hover,
517
+ .react-datepicker__quarter-text--in-selecting-range:hover,
518
+ .react-datepicker__quarter-text--in-range:hover,
519
+ .react-datepicker__year-text--selected:hover,
520
+ .react-datepicker__year-text--in-selecting-range:hover,
521
+ .react-datepicker__year-text--in-range:hover {
522
+ background-color: #1d5d90;
523
+ }
524
+ .react-datepicker__day--keyboard-selected,
525
+ .react-datepicker__month-text--keyboard-selected,
526
+ .react-datepicker__quarter-text--keyboard-selected,
527
+ .react-datepicker__year-text--keyboard-selected {
528
+ border-radius: 0.3rem;
529
+ background-color: #bad9f1;
530
+ color: rgb(0, 0, 0);
531
+ }
532
+ .react-datepicker__day--keyboard-selected:hover,
533
+ .react-datepicker__month-text--keyboard-selected:hover,
534
+ .react-datepicker__quarter-text--keyboard-selected:hover,
535
+ .react-datepicker__year-text--keyboard-selected:hover {
536
+ background-color: #1d5d90;
537
+ }
538
+ .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,
539
+ .react-datepicker__month-text--in-range,
540
+ .react-datepicker__quarter-text--in-range,
541
+ .react-datepicker__year-text--in-range),
542
+ .react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,
543
+ .react-datepicker__month-text--in-range,
544
+ .react-datepicker__quarter-text--in-range,
545
+ .react-datepicker__year-text--in-range),
546
+ .react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,
547
+ .react-datepicker__month-text--in-range,
548
+ .react-datepicker__quarter-text--in-range,
549
+ .react-datepicker__year-text--in-range),
550
+ .react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,
551
+ .react-datepicker__month-text--in-range,
552
+ .react-datepicker__quarter-text--in-range,
553
+ .react-datepicker__year-text--in-range) {
554
+ background-color: rgba(33, 107, 165, 0.5);
555
+ }
556
+ .react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
557
+ .react-datepicker__month-text--in-selecting-range,
558
+ .react-datepicker__quarter-text--in-selecting-range,
559
+ .react-datepicker__year-text--in-selecting-range), .react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
560
+ .react-datepicker__month-text--in-selecting-range,
561
+ .react-datepicker__quarter-text--in-selecting-range,
562
+ .react-datepicker__year-text--in-selecting-range),
563
+ .react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
564
+ .react-datepicker__month-text--in-selecting-range,
565
+ .react-datepicker__quarter-text--in-selecting-range,
566
+ .react-datepicker__year-text--in-selecting-range),
567
+ .react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
568
+ .react-datepicker__month-text--in-selecting-range,
569
+ .react-datepicker__quarter-text--in-selecting-range,
570
+ .react-datepicker__year-text--in-selecting-range),
571
+ .react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
572
+ .react-datepicker__month-text--in-selecting-range,
573
+ .react-datepicker__quarter-text--in-selecting-range,
574
+ .react-datepicker__year-text--in-selecting-range),
575
+ .react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
576
+ .react-datepicker__month-text--in-selecting-range,
577
+ .react-datepicker__quarter-text--in-selecting-range,
578
+ .react-datepicker__year-text--in-selecting-range),
579
+ .react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
580
+ .react-datepicker__month-text--in-selecting-range,
581
+ .react-datepicker__quarter-text--in-selecting-range,
582
+ .react-datepicker__year-text--in-selecting-range),
583
+ .react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
584
+ .react-datepicker__month-text--in-selecting-range,
585
+ .react-datepicker__quarter-text--in-selecting-range,
586
+ .react-datepicker__year-text--in-selecting-range) {
587
+ background-color: #f0f0f0;
588
+ color: #000;
589
+ }
590
+ .react-datepicker__day--disabled,
591
+ .react-datepicker__month-text--disabled,
592
+ .react-datepicker__quarter-text--disabled,
593
+ .react-datepicker__year-text--disabled {
594
+ cursor: default;
595
+ color: #ccc;
596
+ }
597
+ .react-datepicker__day--disabled:hover,
598
+ .react-datepicker__month-text--disabled:hover,
599
+ .react-datepicker__quarter-text--disabled:hover,
600
+ .react-datepicker__year-text--disabled:hover {
601
+ background-color: transparent;
602
+ }
603
+
604
+ .react-datepicker__input-container {
605
+ position: relative;
606
+ display: inline-block;
607
+ width: 100%;
608
+ }
609
+ .react-datepicker__input-container .react-datepicker__calendar-icon {
610
+ position: absolute;
611
+ padding: 0.5rem;
612
+ box-sizing: content-box;
613
+ }
614
+
615
+ .react-datepicker__view-calendar-icon input {
616
+ padding: 6px 10px 5px 25px;
617
+ }
618
+
619
+ .react-datepicker__year-read-view,
620
+ .react-datepicker__month-read-view,
621
+ .react-datepicker__month-year-read-view {
622
+ border: 1px solid transparent;
623
+ border-radius: 0.3rem;
624
+ position: relative;
625
+ }
626
+ .react-datepicker__year-read-view:hover,
627
+ .react-datepicker__month-read-view:hover,
628
+ .react-datepicker__month-year-read-view:hover {
629
+ cursor: pointer;
630
+ }
631
+ .react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
632
+ .react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
633
+ .react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
634
+ .react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
635
+ .react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
636
+ .react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
637
+ border-top-color: #b3b3b3;
638
+ }
639
+ .react-datepicker__year-read-view--down-arrow,
640
+ .react-datepicker__month-read-view--down-arrow,
641
+ .react-datepicker__month-year-read-view--down-arrow {
642
+ transform: rotate(135deg);
643
+ right: -16px;
644
+ top: 0;
645
+ }
646
+
647
+ .react-datepicker__year-dropdown,
648
+ .react-datepicker__month-dropdown,
649
+ .react-datepicker__month-year-dropdown {
650
+ background-color: #f0f0f0;
651
+ position: absolute;
652
+ width: 50%;
653
+ left: 25%;
654
+ top: 30px;
655
+ z-index: 1;
656
+ text-align: center;
657
+ border-radius: 0.3rem;
658
+ border: 1px solid #aeaeae;
659
+ }
660
+ .react-datepicker__year-dropdown:hover,
661
+ .react-datepicker__month-dropdown:hover,
662
+ .react-datepicker__month-year-dropdown:hover {
663
+ cursor: pointer;
664
+ }
665
+ .react-datepicker__year-dropdown--scrollable,
666
+ .react-datepicker__month-dropdown--scrollable,
667
+ .react-datepicker__month-year-dropdown--scrollable {
668
+ height: 150px;
669
+ overflow-y: scroll;
670
+ }
671
+
672
+ .react-datepicker__year-option,
673
+ .react-datepicker__month-option,
674
+ .react-datepicker__month-year-option {
675
+ line-height: 20px;
676
+ width: 100%;
677
+ display: block;
678
+ margin-left: auto;
679
+ margin-right: auto;
680
+ }
681
+ .react-datepicker__year-option:first-of-type,
682
+ .react-datepicker__month-option:first-of-type,
683
+ .react-datepicker__month-year-option:first-of-type {
684
+ border-top-left-radius: 0.3rem;
685
+ border-top-right-radius: 0.3rem;
686
+ }
687
+ .react-datepicker__year-option:last-of-type,
688
+ .react-datepicker__month-option:last-of-type,
689
+ .react-datepicker__month-year-option:last-of-type {
690
+ -webkit-user-select: none;
691
+ -moz-user-select: none;
692
+ -ms-user-select: none;
693
+ user-select: none;
694
+ border-bottom-left-radius: 0.3rem;
695
+ border-bottom-right-radius: 0.3rem;
696
+ }
697
+ .react-datepicker__year-option:hover,
698
+ .react-datepicker__month-option:hover,
699
+ .react-datepicker__month-year-option:hover {
700
+ background-color: #ccc;
701
+ }
702
+ .react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
703
+ .react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
704
+ .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
705
+ border-bottom-color: #b3b3b3;
706
+ }
707
+ .react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
708
+ .react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
709
+ .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
710
+ border-top-color: #b3b3b3;
711
+ }
712
+ .react-datepicker__year-option--selected,
713
+ .react-datepicker__month-option--selected,
714
+ .react-datepicker__month-year-option--selected {
715
+ position: absolute;
716
+ left: 15px;
717
+ }
718
+
719
+ .react-datepicker__close-icon {
720
+ cursor: pointer;
721
+ background-color: transparent;
722
+ border: 0;
723
+ outline: 0;
724
+ padding: 0 6px 0 0;
725
+ position: absolute;
726
+ top: 0;
727
+ right: 0;
728
+ height: 100%;
729
+ display: table-cell;
730
+ vertical-align: middle;
731
+ }
732
+ .react-datepicker__close-icon::after {
733
+ cursor: pointer;
734
+ background-color: #216ba5;
735
+ color: #fff;
736
+ border-radius: 50%;
737
+ height: 16px;
738
+ width: 16px;
739
+ padding: 2px;
740
+ font-size: 12px;
741
+ line-height: 1;
742
+ text-align: center;
743
+ display: table-cell;
744
+ vertical-align: middle;
745
+ content: "×";
746
+ }
747
+ .react-datepicker__close-icon--disabled {
748
+ cursor: default;
749
+ }
750
+ .react-datepicker__close-icon--disabled::after {
751
+ cursor: default;
752
+ background-color: #ccc;
753
+ }
754
+
755
+ .react-datepicker__today-button {
756
+ background: #f0f0f0;
757
+ border-top: 1px solid #aeaeae;
758
+ cursor: pointer;
759
+ text-align: center;
760
+ font-weight: bold;
761
+ padding: 5px 0;
762
+ clear: left;
763
+ }
764
+
765
+ .react-datepicker__portal {
766
+ position: fixed;
767
+ width: 100vw;
768
+ height: 100vh;
769
+ background-color: rgba(0, 0, 0, 0.8);
770
+ left: 0;
771
+ top: 0;
772
+ justify-content: center;
773
+ align-items: center;
774
+ display: flex;
775
+ z-index: 2147483647;
776
+ }
777
+ .react-datepicker__portal .react-datepicker__day-name,
778
+ .react-datepicker__portal .react-datepicker__day,
779
+ .react-datepicker__portal .react-datepicker__time-name {
780
+ width: 3rem;
781
+ line-height: 3rem;
782
+ }
783
+ @media (max-width: 400px), (max-height: 550px) {
784
+ .react-datepicker__portal .react-datepicker__day-name,
785
+ .react-datepicker__portal .react-datepicker__day,
786
+ .react-datepicker__portal .react-datepicker__time-name {
787
+ width: 2rem;
788
+ line-height: 2rem;
789
+ }
790
+ }
791
+ .react-datepicker__portal .react-datepicker__current-month,
792
+ .react-datepicker__portal .react-datepicker-time__header {
793
+ font-size: 1.44rem;
794
+ }
795
+
796
+ .react-datepicker__children-container {
797
+ width: 13.8rem;
798
+ margin: 0.4rem;
799
+ padding-right: 0.2rem;
800
+ padding-left: 0.2rem;
801
+ height: auto;
802
+ }
803
+
804
+ .react-datepicker__aria-live {
805
+ position: absolute;
806
+ clip-path: circle(0);
807
+ border: 0;
808
+ height: 1px;
809
+ margin: -1px;
810
+ overflow: hidden;
811
+ padding: 0;
812
+ width: 1px;
813
+ white-space: nowrap;
814
+ }
815
+
816
+ .react-datepicker__calendar-icon {
817
+ width: 1em;
818
+ height: 1em;
819
+ vertical-align: -0.125em;
820
+ }