phoenix_duskmoon 4.0.0

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,709 @@
1
+ /* @import "tailwindcss/base"; */
2
+
3
+ /* @import "tailwindcss/components"; */
4
+
5
+ .sr-only {
6
+ position: absolute;
7
+ width: 1px;
8
+ height: 1px;
9
+ padding: 0;
10
+ margin: -1px;
11
+ overflow: hidden;
12
+ clip: rect(0, 0, 0, 0);
13
+ white-space: nowrap;
14
+ border-width: 0
15
+ }
16
+
17
+ .fixed {
18
+ position: fixed
19
+ }
20
+
21
+ .absolute {
22
+ position: absolute
23
+ }
24
+
25
+ .relative {
26
+ position: relative
27
+ }
28
+
29
+ .inset-0 {
30
+ top: 0px;
31
+ right: 0px;
32
+ bottom: 0px;
33
+ left: 0px
34
+ }
35
+
36
+ .top-14 {
37
+ top: 3.5rem
38
+ }
39
+
40
+ .isolate {
41
+ isolation: isolate
42
+ }
43
+
44
+ .z-50 {
45
+ z-index: 50
46
+ }
47
+
48
+ .z-10 {
49
+ z-index: 10
50
+ }
51
+
52
+ .z-20 {
53
+ z-index: 20
54
+ }
55
+
56
+ .m-4 {
57
+ margin: 1rem
58
+ }
59
+
60
+ .mx-12 {
61
+ margin-left: 3rem;
62
+ margin-right: 3rem
63
+ }
64
+
65
+ .my-2 {
66
+ margin-top: 0.5rem;
67
+ margin-bottom: 0.5rem
68
+ }
69
+
70
+ .mx-auto {
71
+ margin-left: auto;
72
+ margin-right: auto
73
+ }
74
+
75
+ .mx-8 {
76
+ margin-left: 2rem;
77
+ margin-right: 2rem
78
+ }
79
+
80
+ .mb-4 {
81
+ margin-bottom: 1rem
82
+ }
83
+
84
+ .mt-3 {
85
+ margin-top: 0.75rem
86
+ }
87
+
88
+ .mt-2 {
89
+ margin-top: 0.5rem
90
+ }
91
+
92
+ .mt-5 {
93
+ margin-top: 1.25rem
94
+ }
95
+
96
+ .mr-1 {
97
+ margin-right: 0.25rem
98
+ }
99
+
100
+ .flex {
101
+ display: flex
102
+ }
103
+
104
+ .inline-flex {
105
+ display: inline-flex
106
+ }
107
+
108
+ .table {
109
+ display: table
110
+ }
111
+
112
+ .hidden {
113
+ display: none
114
+ }
115
+
116
+ .h-16 {
117
+ height: 4rem
118
+ }
119
+
120
+ .h-14 {
121
+ height: 3.5rem
122
+ }
123
+
124
+ .h-full {
125
+ height: 100%
126
+ }
127
+
128
+ .h-10 {
129
+ height: 2.5rem
130
+ }
131
+
132
+ .h-8 {
133
+ height: 2rem
134
+ }
135
+
136
+ .h-4 {
137
+ height: 1rem
138
+ }
139
+
140
+ .h-12 {
141
+ height: 3rem
142
+ }
143
+
144
+ .h-5 {
145
+ height: 1.25rem
146
+ }
147
+
148
+ .h-\[34px\] {
149
+ height: 34px
150
+ }
151
+
152
+ .h-\[40px\] {
153
+ height: 40px
154
+ }
155
+
156
+ .min-h-full {
157
+ min-height: 100%
158
+ }
159
+
160
+ .min-h-fit {
161
+ min-height: -webkit-fit-content;
162
+ min-height: -moz-fit-content;
163
+ min-height: fit-content
164
+ }
165
+
166
+ .w-full {
167
+ width: 100%
168
+ }
169
+
170
+ .w-10 {
171
+ width: 2.5rem
172
+ }
173
+
174
+ .w-8 {
175
+ width: 2rem
176
+ }
177
+
178
+ .w-4 {
179
+ width: 1rem
180
+ }
181
+
182
+ .w-16 {
183
+ width: 4rem
184
+ }
185
+
186
+ .w-\[200px\] {
187
+ width: 200px
188
+ }
189
+
190
+ .w-5 {
191
+ width: 1.25rem
192
+ }
193
+
194
+ .flex-none {
195
+ flex: none
196
+ }
197
+
198
+ .flex-1 {
199
+ flex: 1 1 0%
200
+ }
201
+
202
+ .table-fixed {
203
+ table-layout: fixed
204
+ }
205
+
206
+ .border-collapse {
207
+ border-collapse: collapse
208
+ }
209
+
210
+ .border-spacing-0 {
211
+ --tw-border-spacing-x: 0px;
212
+ --tw-border-spacing-y: 0px;
213
+ border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y)
214
+ }
215
+
216
+ .translate-y-0 {
217
+ --tw-translate-y: 0px;
218
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
219
+ }
220
+
221
+ .translate-y-4 {
222
+ --tw-translate-y: 1rem;
223
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
224
+ }
225
+
226
+ .transform {
227
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
228
+ }
229
+
230
+ .cursor-pointer {
231
+ cursor: pointer
232
+ }
233
+
234
+ .select-none {
235
+ -webkit-user-select: none;
236
+ -moz-user-select: none;
237
+ -ms-user-select: none;
238
+ user-select: none
239
+ }
240
+
241
+ .flex-row {
242
+ flex-direction: row
243
+ }
244
+
245
+ .flex-col {
246
+ flex-direction: column
247
+ }
248
+
249
+ .items-start {
250
+ align-items: flex-start
251
+ }
252
+
253
+ .items-end {
254
+ align-items: flex-end
255
+ }
256
+
257
+ .items-center {
258
+ align-items: center
259
+ }
260
+
261
+ .justify-start {
262
+ justify-content: flex-start
263
+ }
264
+
265
+ .justify-end {
266
+ justify-content: flex-end
267
+ }
268
+
269
+ .justify-center {
270
+ justify-content: center
271
+ }
272
+
273
+ .justify-between {
274
+ justify-content: space-between
275
+ }
276
+
277
+ .gap-4 {
278
+ gap: 1rem
279
+ }
280
+
281
+ .gap-2 {
282
+ gap: 0.5rem
283
+ }
284
+
285
+ .space-x-2 > :not([hidden]) ~ :not([hidden]) {
286
+ --tw-space-x-reverse: 0;
287
+ margin-right: calc(0.5rem * var(--tw-space-x-reverse));
288
+ margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)))
289
+ }
290
+
291
+ .-space-x-px > :not([hidden]) ~ :not([hidden]) {
292
+ --tw-space-x-reverse: 0;
293
+ margin-right: calc(-1px * var(--tw-space-x-reverse));
294
+ margin-left: calc(-1px * calc(1 - var(--tw-space-x-reverse)))
295
+ }
296
+
297
+ .self-center {
298
+ align-self: center
299
+ }
300
+
301
+ .overflow-hidden {
302
+ overflow: hidden
303
+ }
304
+
305
+ .overflow-y-auto {
306
+ overflow-y: auto
307
+ }
308
+
309
+ .rounded-lg {
310
+ border-radius: 0.5rem
311
+ }
312
+
313
+ .rounded-md {
314
+ border-radius: 0.375rem
315
+ }
316
+
317
+ .rounded-l-md {
318
+ border-top-left-radius: 0.375rem;
319
+ border-bottom-left-radius: 0.375rem
320
+ }
321
+
322
+ .rounded-r-md {
323
+ border-top-right-radius: 0.375rem;
324
+ border-bottom-right-radius: 0.375rem
325
+ }
326
+
327
+ .border {
328
+ border-width: 1px
329
+ }
330
+
331
+ .border-t {
332
+ border-top-width: 1px
333
+ }
334
+
335
+ .border-gray-200 {
336
+ --tw-border-opacity: 1;
337
+ border-color: rgb(229 231 235 / var(--tw-border-opacity))
338
+ }
339
+
340
+ .border-gray-300 {
341
+ --tw-border-opacity: 1;
342
+ border-color: rgb(209 213 219 / var(--tw-border-opacity))
343
+ }
344
+
345
+ .border-indigo-500 {
346
+ --tw-border-opacity: 1;
347
+ border-color: rgb(99 102 241 / var(--tw-border-opacity))
348
+ }
349
+
350
+ .bg-\[rgba\(255\2c 255\2c 255\2c \.7\)\] {
351
+ background-color: rgba(255,255,255,.7)
352
+ }
353
+
354
+ .bg-blue-100 {
355
+ --tw-bg-opacity: 1;
356
+ background-color: rgb(219 234 254 / var(--tw-bg-opacity))
357
+ }
358
+
359
+ .bg-black\/20 {
360
+ background-color: rgb(0 0 0 / 0.2)
361
+ }
362
+
363
+ .bg-white {
364
+ --tw-bg-opacity: 1;
365
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity))
366
+ }
367
+
368
+ .bg-indigo-50 {
369
+ --tw-bg-opacity: 1;
370
+ background-color: rgb(238 242 255 / var(--tw-bg-opacity))
371
+ }
372
+
373
+ .bg-slate-100 {
374
+ --tw-bg-opacity: 1;
375
+ background-color: rgb(241 245 249 / var(--tw-bg-opacity))
376
+ }
377
+
378
+ .bg-slate-50 {
379
+ --tw-bg-opacity: 1;
380
+ background-color: rgb(248 250 252 / var(--tw-bg-opacity))
381
+ }
382
+
383
+ .p-6 {
384
+ padding: 1.5rem
385
+ }
386
+
387
+ .p-4 {
388
+ padding: 1rem
389
+ }
390
+
391
+ .px-4 {
392
+ padding-left: 1rem;
393
+ padding-right: 1rem
394
+ }
395
+
396
+ .py-2 {
397
+ padding-top: 0.5rem;
398
+ padding-bottom: 0.5rem
399
+ }
400
+
401
+ .px-6 {
402
+ padding-left: 1.5rem;
403
+ padding-right: 1.5rem
404
+ }
405
+
406
+ .px-10 {
407
+ padding-left: 2.5rem;
408
+ padding-right: 2.5rem
409
+ }
410
+
411
+ .py-4 {
412
+ padding-top: 1rem;
413
+ padding-bottom: 1rem
414
+ }
415
+
416
+ .py-20 {
417
+ padding-top: 5rem;
418
+ padding-bottom: 5rem
419
+ }
420
+
421
+ .py-3 {
422
+ padding-top: 0.75rem;
423
+ padding-bottom: 0.75rem
424
+ }
425
+
426
+ .px-2 {
427
+ padding-left: 0.5rem;
428
+ padding-right: 0.5rem
429
+ }
430
+
431
+ .pt-4 {
432
+ padding-top: 1rem
433
+ }
434
+
435
+ .pt-5 {
436
+ padding-top: 1.25rem
437
+ }
438
+
439
+ .pb-4 {
440
+ padding-bottom: 1rem
441
+ }
442
+
443
+ .text-left {
444
+ text-align: left
445
+ }
446
+
447
+ .text-center {
448
+ text-align: center
449
+ }
450
+
451
+ .indent-2\.5 {
452
+ text-indent: 0.625rem
453
+ }
454
+
455
+ .indent-2 {
456
+ text-indent: 0.5rem
457
+ }
458
+
459
+ .text-xl {
460
+ font-size: 1.25rem;
461
+ line-height: 1.75rem
462
+ }
463
+
464
+ .text-lg {
465
+ font-size: 1.125rem;
466
+ line-height: 1.75rem
467
+ }
468
+
469
+ .text-\[14px\] {
470
+ font-size: 14px
471
+ }
472
+
473
+ .text-sm {
474
+ font-size: 0.875rem;
475
+ line-height: 1.25rem
476
+ }
477
+
478
+ .font-semibold {
479
+ font-weight: 600
480
+ }
481
+
482
+ .font-medium {
483
+ font-weight: 500
484
+ }
485
+
486
+ .font-bold {
487
+ font-weight: 700
488
+ }
489
+
490
+ .leading-6 {
491
+ line-height: 1.5rem
492
+ }
493
+
494
+ .text-\[\#A1A7C4\] {
495
+ --tw-text-opacity: 1;
496
+ color: rgb(161 167 196 / var(--tw-text-opacity))
497
+ }
498
+
499
+ .text-blue-500 {
500
+ --tw-text-opacity: 1;
501
+ color: rgb(59 130 246 / var(--tw-text-opacity))
502
+ }
503
+
504
+ .text-gray-900 {
505
+ --tw-text-opacity: 1;
506
+ color: rgb(17 24 39 / var(--tw-text-opacity))
507
+ }
508
+
509
+ .text-gray-500 {
510
+ --tw-text-opacity: 1;
511
+ color: rgb(107 114 128 / var(--tw-text-opacity))
512
+ }
513
+
514
+ .text-gray-700 {
515
+ --tw-text-opacity: 1;
516
+ color: rgb(55 65 81 / var(--tw-text-opacity))
517
+ }
518
+
519
+ .text-indigo-600 {
520
+ --tw-text-opacity: 1;
521
+ color: rgb(79 70 229 / var(--tw-text-opacity))
522
+ }
523
+
524
+ .underline {
525
+ -webkit-text-decoration-line: underline;
526
+ text-decoration-line: underline
527
+ }
528
+
529
+ .opacity-100 {
530
+ opacity: 1
531
+ }
532
+
533
+ .opacity-0 {
534
+ opacity: 0
535
+ }
536
+
537
+ .shadow {
538
+ --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
539
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
540
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
541
+ }
542
+
543
+ .shadow-lg {
544
+ --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
545
+ --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
546
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
547
+ }
548
+
549
+ .shadow-xl {
550
+ --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
551
+ --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
552
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
553
+ }
554
+
555
+ .shadow-sm {
556
+ --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
557
+ --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
558
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
559
+ }
560
+
561
+ .filter {
562
+ filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
563
+ }
564
+
565
+ .backdrop-blur-lg {
566
+ --tw-backdrop-blur: blur(16px);
567
+ -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
568
+ backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)
569
+ }
570
+
571
+ .transition-all {
572
+ transition-property: all;
573
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
574
+ transition-duration: 150ms
575
+ }
576
+
577
+ .transition {
578
+ transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
579
+ transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
580
+ transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
581
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
582
+ transition-duration: 150ms
583
+ }
584
+
585
+ .duration-200 {
586
+ transition-duration: 200ms
587
+ }
588
+
589
+ .ease-in {
590
+ transition-timing-function: cubic-bezier(0.4, 0, 1, 1)
591
+ }
592
+
593
+ .ease-in-out {
594
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1)
595
+ }
596
+
597
+ .after\:content-\[\'\:\'\]::after {
598
+ --tw-content: ':';
599
+ content: var(--tw-content)
600
+ }
601
+
602
+ .even\:bg-white:nth-child(even) {
603
+ --tw-bg-opacity: 1;
604
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity))
605
+ }
606
+
607
+ .hover\:bg-gray-50:hover {
608
+ --tw-bg-opacity: 1;
609
+ background-color: rgb(249 250 251 / var(--tw-bg-opacity))
610
+ }
611
+
612
+ .hover\:opacity-50:hover {
613
+ opacity: 0.5
614
+ }
615
+
616
+ .focus\:z-20:focus {
617
+ z-index: 20
618
+ }
619
+
620
+ @media (prefers-color-scheme: dark) {
621
+ .dark\:bg-blue-900 {
622
+ --tw-bg-opacity: 1;
623
+ background-color: rgb(30 58 138 / var(--tw-bg-opacity))
624
+ }
625
+
626
+ .dark\:text-blue-100 {
627
+ --tw-text-opacity: 1;
628
+ color: rgb(219 234 254 / var(--tw-text-opacity))
629
+ }
630
+
631
+ .dark\:shadow-slate-600 {
632
+ --tw-shadow-color: #475569;
633
+ --tw-shadow: var(--tw-shadow-colored)
634
+ }
635
+ }
636
+
637
+ @media (min-width: 640px) {
638
+ .sm\:my-8 {
639
+ margin-top: 2rem;
640
+ margin-bottom: 2rem
641
+ }
642
+
643
+ .sm\:mt-5 {
644
+ margin-top: 1.25rem
645
+ }
646
+
647
+ .sm\:mt-6 {
648
+ margin-top: 1.5rem
649
+ }
650
+
651
+ .sm\:w-full {
652
+ width: 100%
653
+ }
654
+
655
+ .sm\:max-w-sm {
656
+ max-width: 24rem
657
+ }
658
+
659
+ .sm\:items-center {
660
+ align-items: center
661
+ }
662
+
663
+ .sm\:p-0 {
664
+ padding: 0px
665
+ }
666
+
667
+ .sm\:p-6 {
668
+ padding: 1.5rem
669
+ }
670
+ }
671
+
672
+ @media (min-width: 768px) {
673
+ .md\:flex {
674
+ display: flex
675
+ }
676
+
677
+ .md\:inline-flex {
678
+ display: inline-flex
679
+ }
680
+
681
+ .md\:hidden {
682
+ display: none
683
+ }
684
+
685
+ .md\:translate-y-0 {
686
+ --tw-translate-y: 0px;
687
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
688
+ }
689
+
690
+ .md\:scale-100 {
691
+ --tw-scale-x: 1;
692
+ --tw-scale-y: 1;
693
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
694
+ }
695
+
696
+ .md\:scale-95 {
697
+ --tw-scale-x: .95;
698
+ --tw-scale-y: .95;
699
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
700
+ }
701
+ }
702
+
703
+ @media (min-width: 1024px) {
704
+ .lg\:inline-flex {
705
+ display: inline-flex
706
+ }
707
+ }
708
+
709
+
@@ -0,0 +1,41 @@
1
+ (() => {
2
+ var import_lit = require("@gsmlg/lit");
3
+ const WebComponentHook = {
4
+ mounted() {
5
+ const attrs = this.el.attributes;
6
+ const phxTarget = attrs["phx-target"].value;
7
+ const pushEvent = phxTarget ? (event, payload, callback) => this.pushEventTo(phxTarget, event, payload, callback) : this.pushEvent;
8
+ for (var i = 0; i < attrs.length; i++) {
9
+ if (/^darkmoon-send-/.test(attrs[i].name)) {
10
+ const eventName = attrs[i].name.replace(/^darkmoon-send-/, "");
11
+ const [phxEvent, callbackName] = attrs[i].value.split(";");
12
+ this.el.addEventListener(eventName, ({ detail }) => {
13
+ pushEvent(phxEvent, detail, (e) => {
14
+ this[callbackName]?.(e, detail, eventName);
15
+ });
16
+ });
17
+ }
18
+ if (/^darkmoon-receive-/.test(attrs[i].name)) {
19
+ const eventName = attrs[i].name.replace(/^darkmoon-receive-/, "");
20
+ const handler = attrs[i].value;
21
+ this.handleEvent(eventName, (payload) => {
22
+ if (handler && this.el[handler]) {
23
+ this.el[handler]?.(payload);
24
+ } else {
25
+ this.el.dispatchEvent(new CustomEvent(eventName, { detail: payload }));
26
+ }
27
+ });
28
+ }
29
+ if (attrs[i].name === "darkmoon-receive") {
30
+ const [phxEvent, callbackName] = attrs[i].value.split(";");
31
+ this.handleEvent(phxEvent, (payload) => {
32
+ this.el[callbackName]?.(payload);
33
+ });
34
+ }
35
+ }
36
+ }
37
+ };
38
+ if (window) {
39
+ window.__WebComponentHook__ = WebComponentHook;
40
+ }
41
+ })();