@ohhwells/bridge 0.1.29 → 0.1.31-next.29

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/styles.css CHANGED
@@ -3,37 +3,66 @@
3
3
  @layer ohw-theme {
4
4
  :root, :host {
5
5
  --font-sans: Figtree, sans-serif;
6
+ --color-red-500: oklch(63.7% 0.237 25.331);
7
+ --color-black: #000;
8
+ --color-white: #fff;
6
9
  --spacing: 0.25rem;
10
+ --container-md: 28rem;
11
+ --text-xs: 12px;
12
+ --text-xs--line-height: 16px;
7
13
  --text-sm: 14px;
8
14
  --text-sm--line-height: 20px;
15
+ --text-base: 16px;
16
+ --text-base--line-height: 24px;
9
17
  --text-lg: 18px;
10
18
  --text-lg--line-height: 28px;
19
+ --text-xl: 20px;
20
+ --text-xl--line-height: 28px;
21
+ --text-4xl: 36px;
22
+ --text-4xl--line-height: 40px;
23
+ --text-5xl: 48px;
24
+ --text-5xl--line-height: 1;
11
25
  --font-weight-normal: 400;
12
26
  --font-weight-medium: 500;
13
27
  --font-weight-semibold: 600;
28
+ --font-weight-bold: 700;
14
29
  --tracking-tight: -0.025em;
30
+ --leading-tight: 1.25;
15
31
  --radius-sm: 0.25rem;
16
32
  --radius-md: 6px;
17
33
  --radius-lg: 0.5rem;
18
34
  --radius-xl: 0.75rem;
19
35
  --default-transition-duration: 150ms;
20
36
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
37
+ --font-display: 'Instrument Serif', 'Times New Roman', serif;
38
+ --font-body: 'Red Hat Display', system-ui, sans-serif;
39
+ --color-primary: var(--ohw-primary, #0885FE);
40
+ --color-primary-foreground: var(--ohw-primary-foreground, #FAFAF9);
21
41
  --color-background: var(--ohw-background, #ffffff);
22
42
  --color-foreground: var(--ohw-foreground, #020617);
23
43
  --color-card-foreground: var(--ohw-card-foreground, #020617);
24
44
  --color-popover: var(--ohw-popover, #ffffff);
25
- --color-primary: var(--ohw-primary, #0f172a);
26
- --color-primary-foreground: var(--ohw-primary-foreground, #f8fafc);
45
+ --color-secondary: var(--ohw-secondary, #f1f5f9);
46
+ --color-secondary-foreground: var(--ohw-secondary-foreground, #0f172a);
27
47
  --color-muted: var(--ohw-muted, #f1f5f9);
28
48
  --color-muted-foreground: var(--ohw-muted-foreground, #64748b);
29
49
  --color-accent: var(--ohw-accent, #f1f5f9);
30
50
  --color-accent-foreground: var(--ohw-accent-foreground, #0f172a);
31
51
  --color-destructive: var(--ohw-destructive, #dc2626);
52
+ --color-destructive-foreground: var(--ohw-destructive-foreground, #f8fafc);
32
53
  --color-border: var(--ohw-border, #e2e8f0);
33
54
  --color-input: var(--ohw-input, #e2e8f0);
34
55
  --color-ring: var(--ohw-ring, #64748b);
56
+ --text-5xl--letter-spacing: -0.025em;
57
+ --text-4xl--letter-spacing: -0.025em;
58
+ --text-xl--letter-spacing: -0.025em;
35
59
  --text-lg--letter-spacing: 0em;
60
+ --text-base--letter-spacing: 0em;
36
61
  --text-sm--letter-spacing: 0em;
62
+ --text-xs--letter-spacing: 0em;
63
+ --text-body: 18px;
64
+ --text-body--line-height: 1.5;
65
+ --tracking-display-tight: -0.030em;
37
66
  }
38
67
  }
39
68
  .pointer-events-auto {
@@ -60,15 +89,57 @@
60
89
  .sticky {
61
90
  position: sticky;
62
91
  }
92
+ .inset-0 {
93
+ inset: calc(var(--spacing) * 0);
94
+ }
95
+ .top-0 {
96
+ top: calc(var(--spacing) * 0);
97
+ }
98
+ .top-1\/2 {
99
+ top: calc(1 / 2 * 100%);
100
+ }
101
+ .top-2\.5 {
102
+ top: calc(var(--spacing) * 2.5);
103
+ }
63
104
  .top-\[9px\] {
64
105
  top: 9px;
65
106
  }
107
+ .top-\[calc\(100\%\+4px\)\] {
108
+ top: calc(100% + 4px);
109
+ }
110
+ .right-0 {
111
+ right: calc(var(--spacing) * 0);
112
+ }
113
+ .right-1\.5 {
114
+ right: calc(var(--spacing) * 1.5);
115
+ }
66
116
  .right-\[9px\] {
67
117
  right: 9px;
68
118
  }
119
+ .bottom-0 {
120
+ bottom: calc(var(--spacing) * 0);
121
+ }
122
+ .left-0 {
123
+ left: calc(var(--spacing) * 0);
124
+ }
125
+ .left-1\/2 {
126
+ left: calc(1 / 2 * 100%);
127
+ }
128
+ .z-10 {
129
+ z-index: 10;
130
+ }
131
+ .z-50 {
132
+ z-index: 50;
133
+ }
134
+ .z-2147483646 {
135
+ z-index: 2147483646;
136
+ }
69
137
  .z-2147483647 {
70
138
  z-index: 2147483647;
71
139
  }
140
+ .z-\[2147483646\] {
141
+ z-index: 2147483646;
142
+ }
72
143
  .z-\[2147483647\] {
73
144
  z-index: 2147483647;
74
145
  }
@@ -93,12 +164,24 @@
93
164
  .m-0 {
94
165
  margin: calc(var(--spacing) * 0);
95
166
  }
167
+ .mx-auto {
168
+ margin-inline: auto;
169
+ }
170
+ .mt-0\.5 {
171
+ margin-top: calc(var(--spacing) * 0.5);
172
+ }
96
173
  .mr-\[-1px\] {
97
174
  margin-right: -1px;
98
175
  }
99
176
  .mb-4 {
100
177
  margin-bottom: calc(var(--spacing) * 4);
101
178
  }
179
+ .mb-8 {
180
+ margin-bottom: calc(var(--spacing) * 8);
181
+ }
182
+ .box-border {
183
+ box-sizing: border-box;
184
+ }
102
185
  .block {
103
186
  display: block;
104
187
  }
@@ -117,6 +200,9 @@
117
200
  .inline-flex {
118
201
  display: inline-flex;
119
202
  }
203
+ .h-7 {
204
+ height: calc(var(--spacing) * 7);
205
+ }
120
206
  .h-8 {
121
207
  height: calc(var(--spacing) * 8);
122
208
  }
@@ -126,15 +212,36 @@
126
212
  .h-10 {
127
213
  height: calc(var(--spacing) * 10);
128
214
  }
215
+ .h-20 {
216
+ height: calc(var(--spacing) * 20);
217
+ }
218
+ .h-\[70px\] {
219
+ height: 70px;
220
+ }
221
+ .h-\[264px\] {
222
+ height: 264px;
223
+ }
129
224
  .h-dvh {
130
225
  height: 100dvh;
131
226
  }
132
227
  .h-full {
133
228
  height: 100%;
134
229
  }
230
+ .h-px {
231
+ height: 1px;
232
+ }
135
233
  .h-screen {
136
234
  height: 100vh;
137
235
  }
236
+ .max-h-48 {
237
+ max-height: calc(var(--spacing) * 48);
238
+ }
239
+ .max-h-\[calc\(100\%-32px\)\] {
240
+ max-height: calc(100% - 32px);
241
+ }
242
+ .max-h-\[calc\(100vh-32px\)\] {
243
+ max-height: calc(100vh - 32px);
244
+ }
138
245
  .min-h-dvh {
139
246
  min-height: 100dvh;
140
247
  }
@@ -144,8 +251,17 @@
144
251
  .w-2 {
145
252
  width: calc(var(--spacing) * 2);
146
253
  }
147
- .w-\[483px\] {
148
- width: 483px;
254
+ .w-7 {
255
+ width: calc(var(--spacing) * 7);
256
+ }
257
+ .w-8 {
258
+ width: calc(var(--spacing) * 8);
259
+ }
260
+ .w-10 {
261
+ width: calc(var(--spacing) * 10);
262
+ }
263
+ .w-14 {
264
+ width: calc(var(--spacing) * 14);
149
265
  }
150
266
  .w-\[var\(--radix-popover-trigger-width\)\] {
151
267
  width: var(--radix-popover-trigger-width);
@@ -157,6 +273,15 @@
157
273
  .w-full {
158
274
  width: 100%;
159
275
  }
276
+ .max-w-\[483px\] {
277
+ max-width: 483px;
278
+ }
279
+ .max-w-\[1280px\] {
280
+ max-width: 1280px;
281
+ }
282
+ .max-w-\[calc\(100\%-16px\)\] {
283
+ max-width: calc(100% - 16px);
284
+ }
160
285
  .max-w-\[calc\(100vw-16px\)\] {
161
286
  max-width: calc(100vw - 16px);
162
287
  }
@@ -184,9 +309,20 @@
184
309
  .grow {
185
310
  flex-grow: 1;
186
311
  }
312
+ .-translate-x-1\/2 {
313
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
314
+ translate: var(--tw-translate-x) var(--tw-translate-y);
315
+ }
316
+ .-translate-y-1\/2 {
317
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
318
+ translate: var(--tw-translate-x) var(--tw-translate-y);
319
+ }
187
320
  .transform {
188
321
  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
189
322
  }
323
+ .cursor-default {
324
+ cursor: default;
325
+ }
190
326
  .cursor-pointer {
191
327
  cursor: pointer;
192
328
  }
@@ -202,12 +338,24 @@
202
338
  .items-end {
203
339
  align-items: flex-end;
204
340
  }
341
+ .items-start {
342
+ align-items: flex-start;
343
+ }
344
+ .items-stretch {
345
+ align-items: stretch;
346
+ }
347
+ .justify-between {
348
+ justify-content: space-between;
349
+ }
205
350
  .justify-center {
206
351
  justify-content: center;
207
352
  }
208
353
  .justify-end {
209
354
  justify-content: flex-end;
210
355
  }
356
+ .gap-0 {
357
+ gap: calc(var(--spacing) * 0);
358
+ }
211
359
  .gap-1 {
212
360
  gap: calc(var(--spacing) * 1);
213
361
  }
@@ -220,6 +368,24 @@
220
368
  .gap-3 {
221
369
  gap: calc(var(--spacing) * 3);
222
370
  }
371
+ .gap-4 {
372
+ gap: calc(var(--spacing) * 4);
373
+ }
374
+ .gap-6 {
375
+ gap: calc(var(--spacing) * 6);
376
+ }
377
+ .gap-10 {
378
+ gap: calc(var(--spacing) * 10);
379
+ }
380
+ .gap-16 {
381
+ gap: calc(var(--spacing) * 16);
382
+ }
383
+ .gap-\[60px\] {
384
+ gap: 60px;
385
+ }
386
+ .gap-px {
387
+ gap: 1px;
388
+ }
223
389
  .truncate {
224
390
  overflow: hidden;
225
391
  text-overflow: ellipsis;
@@ -231,6 +397,15 @@
231
397
  .overflow-hidden {
232
398
  overflow: hidden;
233
399
  }
400
+ .overflow-x-auto {
401
+ overflow-x: auto;
402
+ }
403
+ .rounded-\[10px\] {
404
+ border-radius: 10px;
405
+ }
406
+ .rounded-full {
407
+ border-radius: calc(infinity * 1px);
408
+ }
234
409
  .rounded-lg {
235
410
  border-radius: var(--radius-lg);
236
411
  }
@@ -254,6 +429,10 @@
254
429
  border-style: var(--tw-border-style);
255
430
  border-width: 0px;
256
431
  }
432
+ .border-2 {
433
+ border-style: var(--tw-border-style);
434
+ border-width: 2px;
435
+ }
257
436
  .border-b {
258
437
  border-bottom-style: var(--tw-border-style);
259
438
  border-bottom-width: 1px;
@@ -262,6 +441,17 @@
262
441
  border-left-style: var(--tw-border-style);
263
442
  border-left-width: 1px;
264
443
  }
444
+ .border-dashed {
445
+ --tw-border-style: dashed;
446
+ border-style: dashed;
447
+ }
448
+ .border-none {
449
+ --tw-border-style: none;
450
+ border-style: none;
451
+ }
452
+ .border-\[\#E7E5E4\] {
453
+ border-color: #E7E5E4;
454
+ }
265
455
  .border-border {
266
456
  border-color: var(--color-border);
267
457
  }
@@ -274,9 +464,36 @@
274
464
  .border-primary {
275
465
  border-color: var(--color-primary);
276
466
  }
467
+ .border-transparent {
468
+ border-color: transparent;
469
+ }
470
+ .bg-\(--color-light\,\#FEFFF0\) {
471
+ background-color: var(--color-light,#FEFFF0);
472
+ }
473
+ .bg-\[\#F5F5F4\] {
474
+ background-color: #F5F5F4;
475
+ }
476
+ .bg-\[\#FAFAF9\] {
477
+ background-color: #FAFAF9;
478
+ }
277
479
  .bg-background {
278
480
  background-color: var(--color-background);
279
481
  }
482
+ .bg-black\/20 {
483
+ background-color: color-mix(in srgb, #000 20%, transparent);
484
+ @supports (color: color-mix(in lab, red, red)) {
485
+ background-color: color-mix(in oklab, var(--color-black) 20%, transparent);
486
+ }
487
+ }
488
+ .bg-black\/50 {
489
+ background-color: color-mix(in srgb, #000 50%, transparent);
490
+ @supports (color: color-mix(in lab, red, red)) {
491
+ background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
492
+ }
493
+ }
494
+ .bg-destructive {
495
+ background-color: var(--color-destructive);
496
+ }
280
497
  .bg-muted {
281
498
  background-color: var(--color-muted);
282
499
  }
@@ -286,9 +503,15 @@
286
503
  .bg-primary {
287
504
  background-color: var(--color-primary);
288
505
  }
506
+ .bg-secondary {
507
+ background-color: var(--color-secondary);
508
+ }
289
509
  .bg-transparent {
290
510
  background-color: transparent;
291
511
  }
512
+ .bg-white {
513
+ background-color: var(--color-white);
514
+ }
292
515
  .p-0 {
293
516
  padding: calc(var(--spacing) * 0);
294
517
  }
@@ -307,6 +530,12 @@
307
530
  .p-6 {
308
531
  padding: calc(var(--spacing) * 6);
309
532
  }
533
+ .p-12 {
534
+ padding: calc(var(--spacing) * 12);
535
+ }
536
+ .px-1 {
537
+ padding-inline: calc(var(--spacing) * 1);
538
+ }
310
539
  .px-1\.5 {
311
540
  padding-inline: calc(var(--spacing) * 1.5);
312
541
  }
@@ -319,9 +548,21 @@
319
548
  .px-3 {
320
549
  padding-inline: calc(var(--spacing) * 3);
321
550
  }
551
+ .px-5 {
552
+ padding-inline: calc(var(--spacing) * 5);
553
+ }
322
554
  .px-6 {
323
555
  padding-inline: calc(var(--spacing) * 6);
324
556
  }
557
+ .px-7 {
558
+ padding-inline: calc(var(--spacing) * 7);
559
+ }
560
+ .px-8 {
561
+ padding-inline: calc(var(--spacing) * 8);
562
+ }
563
+ .py-0\.5 {
564
+ padding-block: calc(var(--spacing) * 0.5);
565
+ }
325
566
  .py-1 {
326
567
  padding-block: calc(var(--spacing) * 1);
327
568
  }
@@ -331,9 +572,27 @@
331
572
  .py-2 {
332
573
  padding-block: calc(var(--spacing) * 2);
333
574
  }
575
+ .py-4 {
576
+ padding-block: calc(var(--spacing) * 4);
577
+ }
578
+ .py-8 {
579
+ padding-block: calc(var(--spacing) * 8);
580
+ }
581
+ .py-10 {
582
+ padding-block: calc(var(--spacing) * 10);
583
+ }
584
+ .py-12 {
585
+ padding-block: calc(var(--spacing) * 12);
586
+ }
587
+ .py-\[10px\] {
588
+ padding-block: 10px;
589
+ }
334
590
  .pt-1 {
335
591
  padding-top: calc(var(--spacing) * 1);
336
592
  }
593
+ .pt-2 {
594
+ padding-top: calc(var(--spacing) * 2);
595
+ }
337
596
  .pr-2 {
338
597
  padding-right: calc(var(--spacing) * 2);
339
598
  }
@@ -355,12 +614,31 @@
355
614
  .pl-4 {
356
615
  padding-left: calc(var(--spacing) * 4);
357
616
  }
617
+ .text-center {
618
+ text-align: center;
619
+ }
358
620
  .text-left {
359
621
  text-align: left;
360
622
  }
623
+ .font-body {
624
+ font-family: var(--font-body);
625
+ }
626
+ .font-display {
627
+ font-family: var(--font-display);
628
+ }
361
629
  .font-sans {
362
630
  font-family: var(--font-sans);
363
631
  }
632
+ .text-4xl {
633
+ font-size: var(--text-4xl);
634
+ line-height: var(--tw-leading, var(--text-4xl--line-height));
635
+ letter-spacing: var(--tw-tracking, var(--text-4xl--letter-spacing));
636
+ }
637
+ .text-base {
638
+ font-size: var(--text-base);
639
+ line-height: var(--tw-leading, var(--text-base--line-height));
640
+ letter-spacing: var(--tw-tracking, var(--text-base--letter-spacing));
641
+ }
364
642
  .text-lg {
365
643
  font-size: var(--text-lg);
366
644
  line-height: var(--tw-leading, var(--text-lg--line-height));
@@ -371,6 +649,20 @@
371
649
  line-height: var(--tw-leading, var(--text-sm--line-height));
372
650
  letter-spacing: var(--tw-tracking, var(--text-sm--letter-spacing));
373
651
  }
652
+ .text-xl {
653
+ font-size: var(--text-xl);
654
+ line-height: var(--tw-leading, var(--text-xl--line-height));
655
+ letter-spacing: var(--tw-tracking, var(--text-xl--letter-spacing));
656
+ }
657
+ .text-xs {
658
+ font-size: var(--text-xs);
659
+ line-height: var(--tw-leading, var(--text-xs--line-height));
660
+ letter-spacing: var(--tw-tracking, var(--text-xs--letter-spacing));
661
+ }
662
+ .text-body {
663
+ font-size: var(--text-body);
664
+ line-height: var(--tw-leading, var(--text-body--line-height));
665
+ }
374
666
  .leading-5 {
375
667
  --tw-leading: calc(var(--spacing) * 5);
376
668
  line-height: calc(var(--spacing) * 5);
@@ -383,6 +675,14 @@
383
675
  --tw-leading: 1;
384
676
  line-height: 1;
385
677
  }
678
+ .leading-tight {
679
+ --tw-leading: var(--leading-tight);
680
+ line-height: var(--leading-tight);
681
+ }
682
+ .font-bold {
683
+ --tw-font-weight: var(--font-weight-bold);
684
+ font-weight: var(--font-weight-bold);
685
+ }
386
686
  .font-medium {
387
687
  --tw-font-weight: var(--font-weight-medium);
388
688
  font-weight: var(--font-weight-medium);
@@ -395,6 +695,10 @@
395
695
  --tw-font-weight: var(--font-weight-semibold);
396
696
  font-weight: var(--font-weight-semibold);
397
697
  }
698
+ .tracking-display-tight {
699
+ --tw-tracking: var(--tracking-display-tight);
700
+ letter-spacing: var(--tracking-display-tight);
701
+ }
398
702
  .tracking-tight {
399
703
  --tw-tracking: var(--tracking-tight);
400
704
  letter-spacing: var(--tracking-tight);
@@ -405,12 +709,24 @@
405
709
  .whitespace-nowrap {
406
710
  white-space: nowrap;
407
711
  }
712
+ .text-\(--color-accent\,\#A89B83\) {
713
+ color: var(--color-accent,#A89B83);
714
+ }
715
+ .text-\(--color-dark\,\#200C02\) {
716
+ color: var(--color-dark,#200C02);
717
+ }
718
+ .text-\[\#0A0A0A\] {
719
+ color: #0A0A0A;
720
+ }
408
721
  .text-card-foreground {
409
722
  color: var(--color-card-foreground);
410
723
  }
411
724
  .text-destructive {
412
725
  color: var(--color-destructive);
413
726
  }
727
+ .text-destructive-foreground {
728
+ color: var(--color-destructive-foreground);
729
+ }
414
730
  .text-foreground {
415
731
  color: var(--color-foreground);
416
732
  }
@@ -420,6 +736,12 @@
420
736
  .text-primary-foreground {
421
737
  color: var(--color-primary-foreground);
422
738
  }
739
+ .text-red-500 {
740
+ color: var(--color-red-500);
741
+ }
742
+ .text-secondary-foreground {
743
+ color: var(--color-secondary-foreground);
744
+ }
423
745
  .italic {
424
746
  font-style: italic;
425
747
  }
@@ -429,6 +751,15 @@
429
751
  .caret-foreground {
430
752
  caret-color: var(--color-foreground);
431
753
  }
754
+ .opacity-50 {
755
+ opacity: 50%;
756
+ }
757
+ .opacity-80 {
758
+ opacity: 80%;
759
+ }
760
+ .opacity-100 {
761
+ opacity: 100%;
762
+ }
432
763
  .shadow-\[0_0_0_1px_var\(--ohw-destructive\)\] {
433
764
  --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--ohw-destructive));
434
765
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -453,6 +784,10 @@
453
784
  --tw-shadow: 0px 1px 2px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.05));
454
785
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
455
786
  }
787
+ .shadow-xl {
788
+ --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
789
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
790
+ }
456
791
  .shadow-xs {
457
792
  --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
458
793
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -502,6 +837,16 @@
502
837
  }
503
838
  }
504
839
  }
840
+ .hover\:bg-destructive\/80 {
841
+ &:hover {
842
+ @media (hover: hover) {
843
+ background-color: var(--color-destructive);
844
+ @supports (color: color-mix(in lab, red, red)) {
845
+ background-color: color-mix(in oklab, var(--color-destructive) 80%, transparent);
846
+ }
847
+ }
848
+ }
849
+ }
505
850
  .hover\:bg-muted {
506
851
  &:hover {
507
852
  @media (hover: hover) {
@@ -539,6 +884,23 @@
539
884
  }
540
885
  }
541
886
  }
887
+ .hover\:bg-primary {
888
+ &:hover {
889
+ @media (hover: hover) {
890
+ background-color: var(--color-primary);
891
+ }
892
+ }
893
+ }
894
+ .hover\:bg-secondary\/80 {
895
+ &:hover {
896
+ @media (hover: hover) {
897
+ background-color: var(--color-secondary);
898
+ @supports (color: color-mix(in lab, red, red)) {
899
+ background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
900
+ }
901
+ }
902
+ }
903
+ }
542
904
  .hover\:bg-transparent {
543
905
  &:hover {
544
906
  @media (hover: hover) {
@@ -574,6 +936,29 @@
574
936
  }
575
937
  }
576
938
  }
939
+ .focus\:ring-2 {
940
+ &:focus {
941
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
942
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
943
+ }
944
+ }
945
+ .focus\:ring-ring {
946
+ &:focus {
947
+ --tw-ring-color: var(--color-ring);
948
+ }
949
+ }
950
+ .focus\:ring-offset-2 {
951
+ &:focus {
952
+ --tw-ring-offset-width: 2px;
953
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
954
+ }
955
+ }
956
+ .focus\:outline-none {
957
+ &:focus {
958
+ --tw-outline-style: none;
959
+ outline-style: none;
960
+ }
961
+ }
577
962
  .focus-visible\:border-ring {
578
963
  &:focus-visible {
579
964
  border-color: var(--color-ring);
@@ -598,6 +983,11 @@
598
983
  pointer-events: none;
599
984
  }
600
985
  }
986
+ .disabled\:cursor-not-allowed {
987
+ &:disabled {
988
+ cursor: not-allowed;
989
+ }
990
+ }
601
991
  .disabled\:opacity-50 {
602
992
  &:disabled {
603
993
  opacity: 50%;
@@ -651,6 +1041,73 @@
651
1041
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
652
1042
  }
653
1043
  }
1044
+ .sm\:contents {
1045
+ @media (width >= 40rem) {
1046
+ display: contents;
1047
+ }
1048
+ }
1049
+ .sm\:flex {
1050
+ @media (width >= 40rem) {
1051
+ display: flex;
1052
+ }
1053
+ }
1054
+ .sm\:hidden {
1055
+ @media (width >= 40rem) {
1056
+ display: none;
1057
+ }
1058
+ }
1059
+ .sm\:w-\[120px\] {
1060
+ @media (width >= 40rem) {
1061
+ width: 120px;
1062
+ }
1063
+ }
1064
+ .sm\:w-\[200px\] {
1065
+ @media (width >= 40rem) {
1066
+ width: 200px;
1067
+ }
1068
+ }
1069
+ .sm\:shrink-0 {
1070
+ @media (width >= 40rem) {
1071
+ flex-shrink: 0;
1072
+ }
1073
+ }
1074
+ .sm\:items-center {
1075
+ @media (width >= 40rem) {
1076
+ align-items: center;
1077
+ }
1078
+ }
1079
+ .sm\:gap-\[60px\] {
1080
+ @media (width >= 40rem) {
1081
+ gap: 60px;
1082
+ }
1083
+ }
1084
+ .sm\:p-10 {
1085
+ @media (width >= 40rem) {
1086
+ padding: calc(var(--spacing) * 10);
1087
+ }
1088
+ }
1089
+ .sm\:px-16 {
1090
+ @media (width >= 40rem) {
1091
+ padding-inline: calc(var(--spacing) * 16);
1092
+ }
1093
+ }
1094
+ .sm\:py-20 {
1095
+ @media (width >= 40rem) {
1096
+ padding-block: calc(var(--spacing) * 20);
1097
+ }
1098
+ }
1099
+ .sm\:text-5xl {
1100
+ @media (width >= 40rem) {
1101
+ font-size: var(--text-5xl);
1102
+ line-height: var(--tw-leading, var(--text-5xl--line-height));
1103
+ letter-spacing: var(--tw-tracking, var(--text-5xl--letter-spacing));
1104
+ }
1105
+ }
1106
+ .md\:w-md {
1107
+ @media (width >= 48rem) {
1108
+ width: var(--container-md);
1109
+ }
1110
+ }
654
1111
  .\[\&_svg\]\:pointer-events-none {
655
1112
  & svg {
656
1113
  pointer-events: none;
@@ -668,14 +1125,16 @@
668
1125
  }
669
1126
  }
670
1127
  [data-ohw-bridge-root] {
1128
+ --color-primary: var(--ohw-primary, #0885FE);
1129
+ --color-primary-foreground: var(--ohw-primary-foreground, #FAFAF9);
1130
+ --ohw-primary: #0885FE;
1131
+ --ohw-primary-foreground: #FAFAF9;
671
1132
  --ohw-background: #ffffff;
672
1133
  --ohw-foreground: #020617;
673
1134
  --ohw-card: #ffffff;
674
1135
  --ohw-card-foreground: #020617;
675
1136
  --ohw-popover: #ffffff;
676
1137
  --ohw-popover-foreground: #020617;
677
- --ohw-primary: #0f172a;
678
- --ohw-primary-foreground: #f8fafc;
679
1138
  --ohw-hover-primary: #1e293b;
680
1139
  --ohw-secondary: #f1f5f9;
681
1140
  --ohw-secondary-foreground: #0f172a;
@@ -700,7 +1159,21 @@
700
1159
  --ohw-success: #16a34a;
701
1160
  --ohw-hover-success: #15803d;
702
1161
  }
703
- [data-ohw-link-modal-root],
1162
+ [data-ohw-visible-viewport] {
1163
+ position: fixed;
1164
+ left: 0;
1165
+ width: 100%;
1166
+ pointer-events: none;
1167
+ z-index: 2147483645;
1168
+ overflow: hidden;
1169
+ }
1170
+ [data-ohw-visible-viewport] [data-slot="dialog-overlay"] {
1171
+ pointer-events: auto;
1172
+ }
1173
+ [data-ohw-link-page-dropdown] {
1174
+ pointer-events: auto;
1175
+ }
1176
+ [data-ohw-link-modal-root],
704
1177
  [data-ohw-link-popover-root] {
705
1178
  --ohw-background: #ffffff;
706
1179
  --ohw-foreground: #0c0a09;
@@ -738,25 +1211,25 @@
738
1211
  letter-spacing: normal;
739
1212
  line-height: normal;
740
1213
  }
741
- [data-ohw-link-modal-root] :is(h1, h2, h3, h4, h5, h6, p, label, input, button, span, a, li),
1214
+ [data-ohw-link-modal-root] :is(h1, h2, h3, h4, h5, h6, p, label, input, button, span, a, li),
742
1215
  [data-ohw-link-popover-root] :is(h1, h2, h3, h4, h5, h6, p, label, input, button, span, a, li) {
743
1216
  font-family: var(--font-sans);
744
1217
  letter-spacing: normal;
745
1218
  }
746
- [data-ohw-link-modal-root] h2,
1219
+ [data-ohw-link-modal-root] h2,
747
1220
  [data-ohw-link-popover-root] h2 {
748
1221
  font-weight: 600;
749
1222
  line-height: 1;
750
1223
  letter-spacing: -0.025em;
751
1224
  color: var(--ohw-card-foreground);
752
1225
  }
753
- [data-ohw-link-modal-root] p,
1226
+ [data-ohw-link-modal-root] p,
754
1227
  [data-ohw-link-popover-root] p {
755
1228
  font-weight: 400;
756
1229
  line-height: 1.25rem;
757
1230
  color: inherit;
758
1231
  }
759
- [data-ohw-link-modal-root] label,
1232
+ [data-ohw-link-modal-root] label,
760
1233
  [data-ohw-link-popover-root] label {
761
1234
  font-weight: 500;
762
1235
  line-height: 1.25rem;
@@ -775,14 +1248,14 @@
775
1248
  border-color: var(--ohw-border);
776
1249
  color: var(--ohw-foreground);
777
1250
  }
778
- [data-ohw-link-modal-root] [data-ohw-link-field],
1251
+ [data-ohw-link-modal-root] [data-ohw-link-field],
779
1252
  [data-ohw-link-modal-root] [data-ohw-link-field] button {
780
1253
  font-family: var(--font-sans);
781
1254
  -webkit-appearance: none;
782
1255
  -moz-appearance: none;
783
1256
  appearance: none;
784
1257
  }
785
- [data-ohw-link-modal-root] [data-ohw-link-field] input,
1258
+ [data-ohw-link-modal-root] [data-ohw-link-field] input,
786
1259
  [data-ohw-link-modal-root] [data-ohw-link-field] [data-slot="input"] {
787
1260
  border: 0 !important;
788
1261
  outline: none !important;
@@ -854,6 +1327,21 @@
854
1327
  appearance: none;
855
1328
  }
856
1329
  }
1330
+ @property --tw-translate-x {
1331
+ syntax: "*";
1332
+ inherits: false;
1333
+ initial-value: 0;
1334
+ }
1335
+ @property --tw-translate-y {
1336
+ syntax: "*";
1337
+ inherits: false;
1338
+ initial-value: 0;
1339
+ }
1340
+ @property --tw-translate-z {
1341
+ syntax: "*";
1342
+ inherits: false;
1343
+ initial-value: 0;
1344
+ }
857
1345
  @property --tw-rotate-x {
858
1346
  syntax: "*";
859
1347
  inherits: false;
@@ -1017,6 +1505,9 @@
1017
1505
  @layer properties {
1018
1506
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
1019
1507
  *, ::before, ::after, ::backdrop {
1508
+ --tw-translate-x: 0;
1509
+ --tw-translate-y: 0;
1510
+ --tw-translate-z: 0;
1020
1511
  --tw-rotate-x: initial;
1021
1512
  --tw-rotate-y: initial;
1022
1513
  --tw-rotate-z: initial;
@@ -1056,4 +1547,4 @@
1056
1547
  --tw-drop-shadow-size: initial;
1057
1548
  }
1058
1549
  }
1059
- }
1550
+ }