solid_errors 0.1.0 → 0.2.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,987 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <title>Solid Errors</title>
5
+ <%= csrf_meta_tags %>
6
+ <%= csp_meta_tag %>
7
+
8
+ <style>
9
+ /*
10
+ ! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com
11
+ */
12
+
13
+ /*
14
+ 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
15
+ 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
16
+ */
17
+
18
+ *,
19
+ ::before,
20
+ ::after {
21
+ box-sizing: border-box;
22
+ /* 1 */
23
+ border-width: 0;
24
+ /* 2 */
25
+ border-style: solid;
26
+ /* 2 */
27
+ border-color: #e5e7eb;
28
+ /* 2 */
29
+ }
30
+
31
+ ::before,
32
+ ::after {
33
+ --tw-content: '';
34
+ }
35
+
36
+ /*
37
+ 1. Use a consistent sensible line-height in all browsers.
38
+ 2. Prevent adjustments of font size after orientation changes in iOS.
39
+ 3. Use a more readable tab size.
40
+ 4. Use the user's configured `sans` font-family by default.
41
+ 5. Use the user's configured `sans` font-feature-settings by default.
42
+ 6. Use the user's configured `sans` font-variation-settings by default.
43
+ 7. Disable tap highlights on iOS
44
+ */
45
+
46
+ html,
47
+ :host {
48
+ line-height: 1.5;
49
+ /* 1 */
50
+ -webkit-text-size-adjust: 100%;
51
+ /* 2 */
52
+ -moz-tab-size: 4;
53
+ /* 3 */
54
+ tab-size: 4;
55
+ /* 3 */
56
+ font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
57
+ /* 4 */
58
+ font-feature-settings: normal;
59
+ /* 5 */
60
+ font-variation-settings: normal;
61
+ /* 6 */
62
+ -webkit-tap-highlight-color: transparent;
63
+ /* 7 */
64
+ }
65
+
66
+ /*
67
+ 1. Remove the margin in all browsers.
68
+ 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
69
+ */
70
+
71
+ body {
72
+ margin: 0;
73
+ /* 1 */
74
+ line-height: inherit;
75
+ /* 2 */
76
+ }
77
+
78
+ /*
79
+ 1. Add the correct height in Firefox.
80
+ 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
81
+ 3. Ensure horizontal rules are visible by default.
82
+ */
83
+
84
+ hr {
85
+ height: 0;
86
+ /* 1 */
87
+ color: inherit;
88
+ /* 2 */
89
+ border-top-width: 1px;
90
+ /* 3 */
91
+ }
92
+
93
+ /*
94
+ Add the correct text decoration in Chrome, Edge, and Safari.
95
+ */
96
+
97
+ abbr:where([title]) {
98
+ text-decoration: underline dotted;
99
+ }
100
+
101
+ /*
102
+ Remove the default font size and weight for headings.
103
+ */
104
+
105
+ h1,
106
+ h2,
107
+ h3,
108
+ h4,
109
+ h5,
110
+ h6 {
111
+ font-size: inherit;
112
+ font-weight: inherit;
113
+ }
114
+
115
+ /*
116
+ Reset links to optimize for opt-in styling instead of opt-out.
117
+ */
118
+
119
+ a {
120
+ color: inherit;
121
+ text-decoration: inherit;
122
+ }
123
+
124
+ /*
125
+ Add the correct font weight in Edge and Safari.
126
+ */
127
+
128
+ b,
129
+ strong {
130
+ font-weight: bolder;
131
+ }
132
+
133
+ /*
134
+ 1. Use the user's configured `mono` font-family by default.
135
+ 2. Use the user's configured `mono` font-feature-settings by default.
136
+ 3. Use the user's configured `mono` font-variation-settings by default.
137
+ 4. Correct the odd `em` font sizing in all browsers.
138
+ */
139
+
140
+ code,
141
+ kbd,
142
+ samp,
143
+ pre {
144
+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
145
+ /* 1 */
146
+ font-feature-settings: normal;
147
+ /* 2 */
148
+ font-variation-settings: normal;
149
+ /* 3 */
150
+ font-size: 1em;
151
+ /* 4 */
152
+ }
153
+
154
+ /*
155
+ Add the correct font size in all browsers.
156
+ */
157
+
158
+ small {
159
+ font-size: 80%;
160
+ }
161
+
162
+ /*
163
+ Prevent `sub` and `sup` elements from affecting the line height in all browsers.
164
+ */
165
+
166
+ sub,
167
+ sup {
168
+ font-size: 75%;
169
+ line-height: 0;
170
+ position: relative;
171
+ vertical-align: baseline;
172
+ }
173
+
174
+ sub {
175
+ bottom: -0.25em;
176
+ }
177
+
178
+ sup {
179
+ top: -0.5em;
180
+ }
181
+
182
+ /*
183
+ 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
184
+ 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
185
+ 3. Remove gaps between table borders by default.
186
+ */
187
+
188
+ table {
189
+ text-indent: 0;
190
+ /* 1 */
191
+ border-color: inherit;
192
+ /* 2 */
193
+ border-collapse: collapse;
194
+ /* 3 */
195
+ }
196
+
197
+ /*
198
+ 1. Change the font styles in all browsers.
199
+ 2. Remove the margin in Firefox and Safari.
200
+ 3. Remove default padding in all browsers.
201
+ */
202
+
203
+ button,
204
+ input,
205
+ optgroup,
206
+ select,
207
+ textarea {
208
+ font-family: inherit;
209
+ /* 1 */
210
+ font-feature-settings: inherit;
211
+ /* 1 */
212
+ font-variation-settings: inherit;
213
+ /* 1 */
214
+ font-size: 100%;
215
+ /* 1 */
216
+ font-weight: inherit;
217
+ /* 1 */
218
+ line-height: inherit;
219
+ /* 1 */
220
+ color: inherit;
221
+ /* 1 */
222
+ margin: 0;
223
+ /* 2 */
224
+ padding: 0;
225
+ /* 3 */
226
+ }
227
+
228
+ /*
229
+ Remove the inheritance of text transform in Edge and Firefox.
230
+ */
231
+
232
+ button,
233
+ select {
234
+ text-transform: none;
235
+ }
236
+
237
+ /*
238
+ 1. Correct the inability to style clickable types in iOS and Safari.
239
+ 2. Remove default button styles.
240
+ */
241
+
242
+ button,
243
+ [type='button'],
244
+ [type='reset'],
245
+ [type='submit'] {
246
+ -webkit-appearance: button;
247
+ /* 1 */
248
+ background-color: transparent;
249
+ /* 2 */
250
+ background-image: none;
251
+ /* 2 */
252
+ }
253
+
254
+ /*
255
+ Use the modern Firefox focus style for all focusable elements.
256
+ */
257
+
258
+ :-moz-focusring {
259
+ outline: auto;
260
+ }
261
+
262
+ /*
263
+ Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
264
+ */
265
+
266
+ :-moz-ui-invalid {
267
+ box-shadow: none;
268
+ }
269
+
270
+ /*
271
+ Add the correct vertical alignment in Chrome and Firefox.
272
+ */
273
+
274
+ progress {
275
+ vertical-align: baseline;
276
+ }
277
+
278
+ /*
279
+ Correct the cursor style of increment and decrement buttons in Safari.
280
+ */
281
+
282
+ ::-webkit-inner-spin-button,
283
+ ::-webkit-outer-spin-button {
284
+ height: auto;
285
+ }
286
+
287
+ /*
288
+ 1. Correct the odd appearance in Chrome and Safari.
289
+ 2. Correct the outline style in Safari.
290
+ */
291
+
292
+ [type='search'] {
293
+ -webkit-appearance: textfield;
294
+ /* 1 */
295
+ outline-offset: -2px;
296
+ /* 2 */
297
+ }
298
+
299
+ /*
300
+ Remove the inner padding in Chrome and Safari on macOS.
301
+ */
302
+
303
+ ::-webkit-search-decoration {
304
+ -webkit-appearance: none;
305
+ }
306
+
307
+ /*
308
+ 1. Correct the inability to style clickable types in iOS and Safari.
309
+ 2. Change font properties to `inherit` in Safari.
310
+ */
311
+
312
+ ::-webkit-file-upload-button {
313
+ -webkit-appearance: button;
314
+ /* 1 */
315
+ font: inherit;
316
+ /* 2 */
317
+ }
318
+
319
+ /*
320
+ Add the correct display in Chrome and Safari.
321
+ */
322
+
323
+ summary {
324
+ display: list-item;
325
+ }
326
+
327
+ /*
328
+ Removes the default spacing and border for appropriate elements.
329
+ */
330
+
331
+ blockquote,
332
+ dl,
333
+ dd,
334
+ h1,
335
+ h2,
336
+ h3,
337
+ h4,
338
+ h5,
339
+ h6,
340
+ hr,
341
+ figure,
342
+ p,
343
+ pre {
344
+ margin: 0;
345
+ }
346
+
347
+ fieldset {
348
+ margin: 0;
349
+ padding: 0;
350
+ }
351
+
352
+ legend {
353
+ padding: 0;
354
+ }
355
+
356
+ ol,
357
+ ul,
358
+ menu {
359
+ list-style: none;
360
+ margin: 0;
361
+ padding: 0;
362
+ }
363
+
364
+ /*
365
+ Reset default styling for dialogs.
366
+ */
367
+
368
+ dialog {
369
+ padding: 0;
370
+ }
371
+
372
+ /*
373
+ Prevent resizing textareas horizontally by default.
374
+ */
375
+
376
+ textarea {
377
+ resize: vertical;
378
+ }
379
+
380
+ /*
381
+ 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
382
+ 2. Set the default placeholder color to the user's configured gray 400 color.
383
+ */
384
+
385
+ input::placeholder,
386
+ textarea::placeholder {
387
+ opacity: 1;
388
+ /* 1 */
389
+ color: #9ca3af;
390
+ /* 2 */
391
+ }
392
+
393
+ /*
394
+ Set the default cursor for buttons.
395
+ */
396
+
397
+ button,
398
+ [role="button"] {
399
+ cursor: pointer;
400
+ }
401
+
402
+ /*
403
+ Make sure disabled buttons don't get the pointer cursor.
404
+ */
405
+
406
+ :disabled {
407
+ cursor: default;
408
+ }
409
+
410
+ /*
411
+ 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
412
+ 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
413
+ This can trigger a poorly considered lint error in some tools but is included by design.
414
+ */
415
+
416
+ img,
417
+ svg,
418
+ video,
419
+ canvas,
420
+ audio,
421
+ iframe,
422
+ embed,
423
+ object {
424
+ display: block;
425
+ /* 1 */
426
+ vertical-align: middle;
427
+ /* 2 */
428
+ }
429
+
430
+ /*
431
+ Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
432
+ */
433
+
434
+ img,
435
+ video {
436
+ max-width: 100%;
437
+ height: auto;
438
+ }
439
+
440
+ /* Make elements with the HTML hidden attribute stay hidden by default */
441
+
442
+ [hidden] {
443
+ display: none;
444
+ }
445
+
446
+ *, ::before, ::after{
447
+ --tw-border-spacing-x: 0;
448
+ --tw-border-spacing-y: 0;
449
+ --tw-translate-x: 0;
450
+ --tw-translate-y: 0;
451
+ --tw-rotate: 0;
452
+ --tw-skew-x: 0;
453
+ --tw-skew-y: 0;
454
+ --tw-scale-x: 1;
455
+ --tw-scale-y: 1;
456
+ --tw-pan-x: ;
457
+ --tw-pan-y: ;
458
+ --tw-pinch-zoom: ;
459
+ --tw-scroll-snap-strictness: proximity;
460
+ --tw-gradient-from-position: ;
461
+ --tw-gradient-via-position: ;
462
+ --tw-gradient-to-position: ;
463
+ --tw-ordinal: ;
464
+ --tw-slashed-zero: ;
465
+ --tw-numeric-figure: ;
466
+ --tw-numeric-spacing: ;
467
+ --tw-numeric-fraction: ;
468
+ --tw-ring-inset: ;
469
+ --tw-ring-offset-width: 0px;
470
+ --tw-ring-offset-color: #fff;
471
+ --tw-ring-color: rgb(59 130 246 / 0.5);
472
+ --tw-ring-offset-shadow: 0 0 #0000;
473
+ --tw-ring-shadow: 0 0 #0000;
474
+ --tw-shadow: 0 0 #0000;
475
+ --tw-shadow-colored: 0 0 #0000;
476
+ --tw-blur: ;
477
+ --tw-brightness: ;
478
+ --tw-contrast: ;
479
+ --tw-grayscale: ;
480
+ --tw-hue-rotate: ;
481
+ --tw-invert: ;
482
+ --tw-saturate: ;
483
+ --tw-sepia: ;
484
+ --tw-drop-shadow: ;
485
+ --tw-backdrop-blur: ;
486
+ --tw-backdrop-brightness: ;
487
+ --tw-backdrop-contrast: ;
488
+ --tw-backdrop-grayscale: ;
489
+ --tw-backdrop-hue-rotate: ;
490
+ --tw-backdrop-invert: ;
491
+ --tw-backdrop-opacity: ;
492
+ --tw-backdrop-saturate: ;
493
+ --tw-backdrop-sepia:
494
+ }
495
+
496
+ ::backdrop{
497
+ --tw-border-spacing-x: 0;
498
+ --tw-border-spacing-y: 0;
499
+ --tw-translate-x: 0;
500
+ --tw-translate-y: 0;
501
+ --tw-rotate: 0;
502
+ --tw-skew-x: 0;
503
+ --tw-skew-y: 0;
504
+ --tw-scale-x: 1;
505
+ --tw-scale-y: 1;
506
+ --tw-pan-x: ;
507
+ --tw-pan-y: ;
508
+ --tw-pinch-zoom: ;
509
+ --tw-scroll-snap-strictness: proximity;
510
+ --tw-gradient-from-position: ;
511
+ --tw-gradient-via-position: ;
512
+ --tw-gradient-to-position: ;
513
+ --tw-ordinal: ;
514
+ --tw-slashed-zero: ;
515
+ --tw-numeric-figure: ;
516
+ --tw-numeric-spacing: ;
517
+ --tw-numeric-fraction: ;
518
+ --tw-ring-inset: ;
519
+ --tw-ring-offset-width: 0px;
520
+ --tw-ring-offset-color: #fff;
521
+ --tw-ring-color: rgb(59 130 246 / 0.5);
522
+ --tw-ring-offset-shadow: 0 0 #0000;
523
+ --tw-ring-shadow: 0 0 #0000;
524
+ --tw-shadow: 0 0 #0000;
525
+ --tw-shadow-colored: 0 0 #0000;
526
+ --tw-blur: ;
527
+ --tw-brightness: ;
528
+ --tw-contrast: ;
529
+ --tw-grayscale: ;
530
+ --tw-hue-rotate: ;
531
+ --tw-invert: ;
532
+ --tw-saturate: ;
533
+ --tw-sepia: ;
534
+ --tw-drop-shadow: ;
535
+ --tw-backdrop-blur: ;
536
+ --tw-backdrop-brightness: ;
537
+ --tw-backdrop-contrast: ;
538
+ --tw-backdrop-grayscale: ;
539
+ --tw-backdrop-hue-rotate: ;
540
+ --tw-backdrop-invert: ;
541
+ --tw-backdrop-opacity: ;
542
+ --tw-backdrop-saturate: ;
543
+ --tw-backdrop-sepia:
544
+ }
545
+
546
+ .sr-only{
547
+ position: absolute;
548
+ width: 1px;
549
+ height: 1px;
550
+ padding: 0;
551
+ margin: -1px;
552
+ overflow: hidden;
553
+ clip: rect(0, 0, 0, 0);
554
+ white-space: nowrap;
555
+ border-width: 0
556
+ }
557
+
558
+ .static{
559
+ position: static
560
+ }
561
+
562
+ .relative{
563
+ position: relative
564
+ }
565
+
566
+ .-mx-2{
567
+ margin-left: -0.5rem;
568
+ margin-right: -0.5rem
569
+ }
570
+
571
+ .mx-auto{
572
+ margin-left: auto;
573
+ margin-right: auto
574
+ }
575
+
576
+ .mb-3{
577
+ margin-bottom: 0.75rem
578
+ }
579
+
580
+ .mb-36{
581
+ margin-bottom: 9rem
582
+ }
583
+
584
+ .ml-6{
585
+ margin-left: 1.5rem
586
+ }
587
+
588
+ .mr-2{
589
+ margin-right: 0.5rem
590
+ }
591
+
592
+ .mt-4{
593
+ margin-top: 1rem
594
+ }
595
+
596
+ .\!block{
597
+ display: block !important
598
+ }
599
+
600
+ .block{
601
+ display: block
602
+ }
603
+
604
+ .flex{
605
+ display: flex
606
+ }
607
+
608
+ .inline-flex{
609
+ display: inline-flex
610
+ }
611
+
612
+ .table{
613
+ display: table
614
+ }
615
+
616
+ .grid{
617
+ display: grid
618
+ }
619
+
620
+ .hidden{
621
+ display: none
622
+ }
623
+
624
+ .w-full{
625
+ width: 100%
626
+ }
627
+
628
+ .min-w-full{
629
+ min-width: 100%
630
+ }
631
+
632
+ .flex-1{
633
+ flex: 1 1 0%
634
+ }
635
+
636
+ .cursor-help{
637
+ cursor: help
638
+ }
639
+
640
+ .cursor-pointer{
641
+ cursor: pointer
642
+ }
643
+
644
+ .select-none{
645
+ user-select: none
646
+ }
647
+
648
+ .grid-cols-2{
649
+ grid-template-columns: repeat(2, minmax(0, 1fr))
650
+ }
651
+
652
+ .flex-wrap{
653
+ flex-wrap: wrap
654
+ }
655
+
656
+ .items-center{
657
+ align-items: center
658
+ }
659
+
660
+ .items-baseline{
661
+ align-items: baseline
662
+ }
663
+
664
+ .justify-start{
665
+ justify-content: flex-start
666
+ }
667
+
668
+ .justify-center{
669
+ justify-content: center
670
+ }
671
+
672
+ .justify-between{
673
+ justify-content: space-between
674
+ }
675
+
676
+ .gap-1{
677
+ gap: 0.25rem
678
+ }
679
+
680
+ .gap-2{
681
+ gap: 0.5rem
682
+ }
683
+
684
+ .gap-3{
685
+ gap: 0.75rem
686
+ }
687
+
688
+ .gap-x-2{
689
+ column-gap: 0.5rem
690
+ }
691
+
692
+ .gap-x-4{
693
+ column-gap: 1rem
694
+ }
695
+
696
+ .space-y-6 > :not([hidden]) ~ :not([hidden]){
697
+ --tw-space-y-reverse: 0;
698
+ margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
699
+ margin-bottom: calc(1.5rem * var(--tw-space-y-reverse))
700
+ }
701
+
702
+ .divide-y > :not([hidden]) ~ :not([hidden]){
703
+ --tw-divide-y-reverse: 0;
704
+ border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
705
+ border-bottom-width: calc(1px * var(--tw-divide-y-reverse))
706
+ }
707
+
708
+ .divide-gray-300 > :not([hidden]) ~ :not([hidden]){
709
+ --tw-divide-opacity: 1;
710
+ border-color: rgb(209 213 219 / var(--tw-divide-opacity))
711
+ }
712
+
713
+ .whitespace-nowrap{
714
+ white-space: nowrap
715
+ }
716
+
717
+ .rounded{
718
+ border-radius: 0.25rem
719
+ }
720
+
721
+ .rounded-lg{
722
+ border-radius: 0.5rem
723
+ }
724
+
725
+ .rounded-md{
726
+ border-radius: 0.375rem
727
+ }
728
+
729
+ .border{
730
+ border-width: 1px
731
+ }
732
+
733
+ .border-b{
734
+ border-bottom-width: 1px
735
+ }
736
+
737
+ .border-gray-300{
738
+ --tw-border-opacity: 1;
739
+ border-color: rgb(209 213 219 / var(--tw-border-opacity))
740
+ }
741
+
742
+ .bg-gray-100{
743
+ --tw-bg-opacity: 1;
744
+ background-color: rgb(243 244 246 / var(--tw-bg-opacity))
745
+ }
746
+
747
+ .bg-gray-200{
748
+ --tw-bg-opacity: 1;
749
+ background-color: rgb(229 231 235 / var(--tw-bg-opacity))
750
+ }
751
+
752
+ .bg-transparent{
753
+ background-color: transparent
754
+ }
755
+
756
+ .bg-white{
757
+ --tw-bg-opacity: 1;
758
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity))
759
+ }
760
+
761
+ .p-2{
762
+ padding: 0.5rem
763
+ }
764
+
765
+ .px-2{
766
+ padding-left: 0.5rem;
767
+ padding-right: 0.5rem
768
+ }
769
+
770
+ .px-3{
771
+ padding-left: 0.75rem;
772
+ padding-right: 0.75rem
773
+ }
774
+
775
+ .px-5{
776
+ padding-left: 1.25rem;
777
+ padding-right: 1.25rem
778
+ }
779
+
780
+ .py-1{
781
+ padding-top: 0.25rem;
782
+ padding-bottom: 0.25rem
783
+ }
784
+
785
+ .py-3{
786
+ padding-top: 0.75rem;
787
+ padding-bottom: 0.75rem
788
+ }
789
+
790
+ .py-3\.5{
791
+ padding-top: 0.875rem;
792
+ padding-bottom: 0.875rem
793
+ }
794
+
795
+ .py-4{
796
+ padding-top: 1rem;
797
+ padding-bottom: 1rem
798
+ }
799
+
800
+ .pb-4{
801
+ padding-bottom: 1rem
802
+ }
803
+
804
+ .pl-3{
805
+ padding-left: 0.75rem
806
+ }
807
+
808
+ .pl-4{
809
+ padding-left: 1rem
810
+ }
811
+
812
+ .pr-3{
813
+ padding-right: 0.75rem
814
+ }
815
+
816
+ .pr-4{
817
+ padding-right: 1rem
818
+ }
819
+
820
+ .pt-7{
821
+ padding-top: 1.75rem
822
+ }
823
+
824
+ .text-left{
825
+ text-align: left
826
+ }
827
+
828
+ .text-right{
829
+ text-align: right
830
+ }
831
+
832
+ .align-top{
833
+ vertical-align: top
834
+ }
835
+
836
+ .text-2xl{
837
+ font-size: 1.5rem;
838
+ line-height: 2rem
839
+ }
840
+
841
+ .text-\[\.75em\]{
842
+ font-size: .75em
843
+ }
844
+
845
+ .text-base{
846
+ font-size: 1rem;
847
+ line-height: 1.5rem
848
+ }
849
+
850
+ .text-sm{
851
+ font-size: 0.875rem;
852
+ line-height: 1.25rem
853
+ }
854
+
855
+ .font-bold{
856
+ font-weight: 700
857
+ }
858
+
859
+ .font-medium{
860
+ font-weight: 500
861
+ }
862
+
863
+ .font-semibold{
864
+ font-weight: 600
865
+ }
866
+
867
+ .text-blue-400{
868
+ --tw-text-opacity: 1;
869
+ color: rgb(96 165 250 / var(--tw-text-opacity))
870
+ }
871
+
872
+ .text-blue-500{
873
+ --tw-text-opacity: 1;
874
+ color: rgb(59 130 246 / var(--tw-text-opacity))
875
+ }
876
+
877
+ .text-gray-500{
878
+ --tw-text-opacity: 1;
879
+ color: rgb(107 114 128 / var(--tw-text-opacity))
880
+ }
881
+
882
+ .text-gray-600{
883
+ --tw-text-opacity: 1;
884
+ color: rgb(75 85 99 / var(--tw-text-opacity))
885
+ }
886
+
887
+ .text-gray-800{
888
+ --tw-text-opacity: 1;
889
+ color: rgb(31 41 55 / var(--tw-text-opacity))
890
+ }
891
+
892
+ .text-gray-900{
893
+ --tw-text-opacity: 1;
894
+ color: rgb(17 24 39 / var(--tw-text-opacity))
895
+ }
896
+
897
+ .text-green-500{
898
+ --tw-text-opacity: 1;
899
+ color: rgb(34 197 94 / var(--tw-text-opacity))
900
+ }
901
+
902
+ .underline{
903
+ text-decoration-line: underline
904
+ }
905
+
906
+ .even\:bg-gray-50:nth-child(even){
907
+ --tw-bg-opacity: 1;
908
+ background-color: rgb(249 250 251 / var(--tw-bg-opacity))
909
+ }
910
+
911
+ .hover\:bg-gray-50:hover{
912
+ --tw-bg-opacity: 1;
913
+ background-color: rgb(249 250 251 / var(--tw-bg-opacity))
914
+ }
915
+
916
+ .hover\:ring-8:hover{
917
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
918
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(8px + var(--tw-ring-offset-width)) var(--tw-ring-color);
919
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)
920
+ }
921
+
922
+ .hover\:ring-gray-200:hover{
923
+ --tw-ring-opacity: 1;
924
+ --tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity))
925
+ }
926
+
927
+ @media (min-width: 640px){
928
+ .sm\:mx-0{
929
+ margin-left: 0px;
930
+ margin-right: 0px
931
+ }
932
+
933
+ .sm\:rounded-md{
934
+ border-radius: 0.375rem
935
+ }
936
+
937
+ .sm\:pl-3{
938
+ padding-left: 0.75rem
939
+ }
940
+
941
+ .sm\:pr-3{
942
+ padding-right: 0.75rem
943
+ }
944
+ }
945
+ </style>
946
+ </head>
947
+ <body class="pb-4">
948
+ <main class="container mt-2">
949
+ <%= content_for?(:content) ? yield(:content) : yield %>
950
+ </main>
951
+
952
+ <div class="fixed top-0 left-0 right-0 text-center py-2">
953
+ <% if notice.present? %>
954
+ <p id="notice"
955
+ class="py-2 px-3 bg-green-50 text-green-500 font-medium rounded-lg inline-block"
956
+ data-controller="fade">
957
+ <%= notice %>
958
+ </p>
959
+ <% end %>
960
+
961
+ <% if alert.present? %>
962
+ <p id="alert"
963
+ class="py-2 px-3 bg-red-50 text-red-500 font-medium rounded-lg inline-block"
964
+ data-controller="fade">
965
+ <%= alert %>
966
+ </p>
967
+ <% end %>
968
+ </div>
969
+
970
+ <script>
971
+ var element = document.querySelector('[data-controller="fade"]');
972
+ function fadeOut(el) {
973
+ var opacity = 1; // Initial opacity
974
+ var interval = setInterval(function() {
975
+ if (opacity > 0) {
976
+ opacity -= 0.1;
977
+ el.style.opacity = opacity;
978
+ } else {
979
+ clearInterval(interval); // Stop the interval when opacity reaches 0
980
+ el.style.display = 'none'; // Hide the element
981
+ }
982
+ }, 50);
983
+ }
984
+ fadeOut(element);
985
+ </script>
986
+ </body>
987
+ </html>