@ohhwells/bridge 0.1.16 → 0.1.17-next.15

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,6 +3,9 @@
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;
7
10
  --text-xs: 12px;
8
11
  --text-xs--line-height: 16px;
@@ -14,48 +17,51 @@
14
17
  --text-lg--line-height: 28px;
15
18
  --text-xl: 20px;
16
19
  --text-xl--line-height: 28px;
17
- --text-2xl: 24px;
18
- --text-2xl--line-height: 32px;
19
- --text-3xl: 30px;
20
- --text-3xl--line-height: 36px;
21
20
  --text-4xl: 36px;
22
21
  --text-4xl--line-height: 40px;
23
22
  --text-5xl: 48px;
24
23
  --text-5xl--line-height: 1;
25
- --text-6xl: 60px;
26
- --text-6xl--line-height: 1;
27
- --text-7xl: 72px;
28
- --text-7xl--line-height: 1;
29
- --text-8xl: 96px;
30
- --text-8xl--line-height: 1;
31
- --text-9xl: 128px;
32
- --text-9xl--line-height: 1;
24
+ --font-weight-normal: 400;
33
25
  --font-weight-medium: 500;
26
+ --font-weight-semibold: 600;
27
+ --font-weight-bold: 700;
28
+ --tracking-tight: -0.025em;
29
+ --leading-tight: 1.25;
30
+ --radius-sm: 0.25rem;
34
31
  --radius-md: 6px;
32
+ --radius-lg: 0.5rem;
33
+ --radius-xl: 0.75rem;
35
34
  --default-transition-duration: 150ms;
36
35
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
36
+ --font-display: 'Instrument Serif', 'Times New Roman', serif;
37
+ --font-body: 'Red Hat Display', system-ui, sans-serif;
38
+ --color-primary: var(--ohw-primary, #0885FE);
39
+ --color-primary-foreground: var(--ohw-primary-foreground, #FAFAF9);
37
40
  --color-background: var(--ohw-background, #ffffff);
38
41
  --color-foreground: var(--ohw-foreground, #020617);
42
+ --color-card-foreground: var(--ohw-card-foreground, #020617);
43
+ --color-popover: var(--ohw-popover, #ffffff);
44
+ --color-secondary: var(--ohw-secondary, #f1f5f9);
45
+ --color-secondary-foreground: var(--ohw-secondary-foreground, #0f172a);
39
46
  --color-muted: var(--ohw-muted, #f1f5f9);
40
47
  --color-muted-foreground: var(--ohw-muted-foreground, #64748b);
41
48
  --color-accent: var(--ohw-accent, #f1f5f9);
42
49
  --color-accent-foreground: var(--ohw-accent-foreground, #0f172a);
43
50
  --color-destructive: var(--ohw-destructive, #dc2626);
51
+ --color-destructive-foreground: var(--ohw-destructive-foreground, #f8fafc);
52
+ --color-border: var(--ohw-border, #e2e8f0);
44
53
  --color-input: var(--ohw-input, #e2e8f0);
45
54
  --color-ring: var(--ohw-ring, #64748b);
46
- --text-9xl--letter-spacing: -0.025em;
47
- --text-8xl--letter-spacing: -0.025em;
48
- --text-7xl--letter-spacing: -0.025em;
49
- --text-6xl--letter-spacing: -0.025em;
50
55
  --text-5xl--letter-spacing: -0.025em;
51
56
  --text-4xl--letter-spacing: -0.025em;
52
- --text-3xl--letter-spacing: -0.025em;
53
- --text-2xl--letter-spacing: -0.025em;
54
57
  --text-xl--letter-spacing: -0.025em;
55
58
  --text-lg--letter-spacing: 0em;
56
59
  --text-base--letter-spacing: 0em;
57
60
  --text-sm--letter-spacing: 0em;
58
61
  --text-xs--letter-spacing: 0em;
62
+ --text-body: 18px;
63
+ --text-body--line-height: 1.5;
64
+ --tracking-display-tight: -0.030em;
59
65
  }
60
66
  }
61
67
  .pointer-events-auto {
@@ -82,9 +88,54 @@
82
88
  .sticky {
83
89
  position: sticky;
84
90
  }
91
+ .inset-0 {
92
+ inset: calc(var(--spacing) * 0);
93
+ }
94
+ .top-0 {
95
+ top: calc(var(--spacing) * 0);
96
+ }
97
+ .top-1\/2 {
98
+ top: calc(1 / 2 * 100%);
99
+ }
100
+ .top-2\.5 {
101
+ top: calc(var(--spacing) * 2.5);
102
+ }
103
+ .top-\[9px\] {
104
+ top: 9px;
105
+ }
106
+ .right-0 {
107
+ right: calc(var(--spacing) * 0);
108
+ }
109
+ .right-1\.5 {
110
+ right: calc(var(--spacing) * 1.5);
111
+ }
112
+ .right-\[9px\] {
113
+ right: 9px;
114
+ }
115
+ .bottom-0 {
116
+ bottom: calc(var(--spacing) * 0);
117
+ }
118
+ .left-0 {
119
+ left: calc(var(--spacing) * 0);
120
+ }
121
+ .left-1\/2 {
122
+ left: calc(1 / 2 * 100%);
123
+ }
124
+ .z-10 {
125
+ z-index: 10;
126
+ }
127
+ .z-50 {
128
+ z-index: 50;
129
+ }
130
+ .z-2147483646 {
131
+ z-index: 2147483646;
132
+ }
85
133
  .z-2147483647 {
86
134
  z-index: 2147483647;
87
135
  }
136
+ .z-\[2147483647\] {
137
+ z-index: 2147483647;
138
+ }
88
139
  .container {
89
140
  width: 100%;
90
141
  @media (width >= 40rem) {
@@ -103,6 +154,27 @@
103
154
  max-width: 96rem;
104
155
  }
105
156
  }
157
+ .m-0 {
158
+ margin: calc(var(--spacing) * 0);
159
+ }
160
+ .mx-auto {
161
+ margin-inline: auto;
162
+ }
163
+ .mt-0\.5 {
164
+ margin-top: calc(var(--spacing) * 0.5);
165
+ }
166
+ .mr-\[-1px\] {
167
+ margin-right: -1px;
168
+ }
169
+ .mb-4 {
170
+ margin-bottom: calc(var(--spacing) * 4);
171
+ }
172
+ .mb-8 {
173
+ margin-bottom: calc(var(--spacing) * 8);
174
+ }
175
+ .box-border {
176
+ box-sizing: border-box;
177
+ }
106
178
  .block {
107
179
  display: block;
108
180
  }
@@ -121,15 +193,33 @@
121
193
  .inline-flex {
122
194
  display: inline-flex;
123
195
  }
196
+ .h-7 {
197
+ height: calc(var(--spacing) * 7);
198
+ }
124
199
  .h-8 {
125
200
  height: calc(var(--spacing) * 8);
126
201
  }
202
+ .h-9 {
203
+ height: calc(var(--spacing) * 9);
204
+ }
127
205
  .h-10 {
128
206
  height: calc(var(--spacing) * 10);
129
207
  }
208
+ .h-\[70px\] {
209
+ height: 70px;
210
+ }
211
+ .h-\[264px\] {
212
+ height: 264px;
213
+ }
130
214
  .h-dvh {
131
215
  height: 100dvh;
132
216
  }
217
+ .h-full {
218
+ height: 100%;
219
+ }
220
+ .h-px {
221
+ height: 1px;
222
+ }
133
223
  .h-screen {
134
224
  height: 100vh;
135
225
  }
@@ -139,39 +229,173 @@
139
229
  .min-h-screen {
140
230
  min-height: 100vh;
141
231
  }
232
+ .w-2 {
233
+ width: calc(var(--spacing) * 2);
234
+ }
235
+ .w-7 {
236
+ width: calc(var(--spacing) * 7);
237
+ }
238
+ .w-8 {
239
+ width: calc(var(--spacing) * 8);
240
+ }
241
+ .w-10 {
242
+ width: calc(var(--spacing) * 10);
243
+ }
244
+ .w-14 {
245
+ width: calc(var(--spacing) * 14);
246
+ }
247
+ .w-\[483px\] {
248
+ width: 483px;
249
+ }
250
+ .w-\[var\(--radix-popover-trigger-width\)\] {
251
+ width: var(--radix-popover-trigger-width);
252
+ }
253
+ .w-fit {
254
+ width: -moz-fit-content;
255
+ width: fit-content;
256
+ }
257
+ .w-full {
258
+ width: 100%;
259
+ }
260
+ .max-w-\[1280px\] {
261
+ max-width: 1280px;
262
+ }
263
+ .max-w-\[calc\(100vw-16px\)\] {
264
+ max-width: calc(100vw - 16px);
265
+ }
266
+ .min-w-0 {
267
+ min-width: calc(var(--spacing) * 0);
268
+ }
142
269
  .min-w-8 {
143
270
  min-width: calc(var(--spacing) * 8);
144
271
  }
145
272
  .min-w-10 {
146
273
  min-width: calc(var(--spacing) * 10);
147
274
  }
275
+ .min-w-\[64px\] {
276
+ min-width: 64px;
277
+ }
278
+ .min-w-\[80px\] {
279
+ min-width: 80px;
280
+ }
281
+ .flex-1 {
282
+ flex: 1;
283
+ }
284
+ .shrink-0 {
285
+ flex-shrink: 0;
286
+ }
148
287
  .grow {
149
288
  flex-grow: 1;
150
289
  }
290
+ .-translate-x-1\/2 {
291
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
292
+ translate: var(--tw-translate-x) var(--tw-translate-y);
293
+ }
294
+ .-translate-y-1\/2 {
295
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
296
+ translate: var(--tw-translate-x) var(--tw-translate-y);
297
+ }
151
298
  .transform {
152
299
  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
153
300
  }
301
+ .cursor-default {
302
+ cursor: default;
303
+ }
154
304
  .cursor-pointer {
155
305
  cursor: pointer;
156
306
  }
157
307
  .resize {
158
308
  resize: both;
159
309
  }
310
+ .flex-col {
311
+ flex-direction: column;
312
+ }
160
313
  .items-center {
161
314
  align-items: center;
162
315
  }
316
+ .items-end {
317
+ align-items: flex-end;
318
+ }
319
+ .items-start {
320
+ align-items: flex-start;
321
+ }
322
+ .items-stretch {
323
+ align-items: stretch;
324
+ }
325
+ .justify-between {
326
+ justify-content: space-between;
327
+ }
163
328
  .justify-center {
164
329
  justify-content: center;
165
330
  }
331
+ .justify-end {
332
+ justify-content: flex-end;
333
+ }
166
334
  .gap-1 {
167
335
  gap: calc(var(--spacing) * 1);
168
336
  }
337
+ .gap-1\.5 {
338
+ gap: calc(var(--spacing) * 1.5);
339
+ }
169
340
  .gap-2 {
170
341
  gap: calc(var(--spacing) * 2);
171
342
  }
343
+ .gap-3 {
344
+ gap: calc(var(--spacing) * 3);
345
+ }
346
+ .gap-4 {
347
+ gap: calc(var(--spacing) * 4);
348
+ }
349
+ .gap-6 {
350
+ gap: calc(var(--spacing) * 6);
351
+ }
352
+ .gap-10 {
353
+ gap: calc(var(--spacing) * 10);
354
+ }
355
+ .gap-16 {
356
+ gap: calc(var(--spacing) * 16);
357
+ }
358
+ .gap-\[60px\] {
359
+ gap: 60px;
360
+ }
361
+ .gap-px {
362
+ gap: 1px;
363
+ }
364
+ .truncate {
365
+ overflow: hidden;
366
+ text-overflow: ellipsis;
367
+ white-space: nowrap;
368
+ }
369
+ .overflow-auto {
370
+ overflow: auto;
371
+ }
372
+ .overflow-hidden {
373
+ overflow: hidden;
374
+ }
375
+ .overflow-x-auto {
376
+ overflow-x: auto;
377
+ }
378
+ .rounded-\[10px\] {
379
+ border-radius: 10px;
380
+ }
381
+ .rounded-full {
382
+ border-radius: calc(infinity * 1px);
383
+ }
384
+ .rounded-lg {
385
+ border-radius: var(--radius-lg);
386
+ }
172
387
  .rounded-md {
173
388
  border-radius: var(--radius-md);
174
389
  }
390
+ .rounded-sm {
391
+ border-radius: var(--radius-sm);
392
+ }
393
+ .rounded-xl {
394
+ border-radius: var(--radius-xl);
395
+ }
396
+ .rounded-bl-sm {
397
+ border-bottom-left-radius: var(--radius-sm);
398
+ }
175
399
  .border {
176
400
  border-style: var(--tw-border-style);
177
401
  border-width: 1px;
@@ -180,18 +404,108 @@
180
404
  border-style: var(--tw-border-style);
181
405
  border-width: 0px;
182
406
  }
407
+ .border-2 {
408
+ border-style: var(--tw-border-style);
409
+ border-width: 2px;
410
+ }
411
+ .border-b {
412
+ border-bottom-style: var(--tw-border-style);
413
+ border-bottom-width: 1px;
414
+ }
415
+ .border-l {
416
+ border-left-style: var(--tw-border-style);
417
+ border-left-width: 1px;
418
+ }
419
+ .border-dashed {
420
+ --tw-border-style: dashed;
421
+ border-style: dashed;
422
+ }
423
+ .border-none {
424
+ --tw-border-style: none;
425
+ border-style: none;
426
+ }
427
+ .border-solid {
428
+ --tw-border-style: solid;
429
+ border-style: solid;
430
+ }
431
+ .border-\[\#E7E5E4\] {
432
+ border-color: #E7E5E4;
433
+ }
434
+ .border-border {
435
+ border-color: var(--color-border);
436
+ }
437
+ .border-destructive {
438
+ border-color: var(--color-destructive);
439
+ }
183
440
  .border-input {
184
441
  border-color: var(--color-input);
185
442
  }
443
+ .border-primary {
444
+ border-color: var(--color-primary);
445
+ }
446
+ .border-transparent {
447
+ border-color: transparent;
448
+ }
449
+ .bg-\(--color-light\,\#FEFFF0\) {
450
+ background-color: var(--color-light,#FEFFF0);
451
+ }
452
+ .bg-\[\#F5F5F4\] {
453
+ background-color: #F5F5F4;
454
+ }
455
+ .bg-\[\#FAFAF9\] {
456
+ background-color: #FAFAF9;
457
+ }
458
+ .bg-background {
459
+ background-color: var(--color-background);
460
+ }
461
+ .bg-black\/20 {
462
+ background-color: color-mix(in srgb, #000 20%, transparent);
463
+ @supports (color: color-mix(in lab, red, red)) {
464
+ background-color: color-mix(in oklab, var(--color-black) 20%, transparent);
465
+ }
466
+ }
467
+ .bg-destructive {
468
+ background-color: var(--color-destructive);
469
+ }
186
470
  .bg-muted {
187
471
  background-color: var(--color-muted);
188
472
  }
473
+ .bg-popover {
474
+ background-color: var(--color-popover);
475
+ }
476
+ .bg-primary {
477
+ background-color: var(--color-primary);
478
+ }
479
+ .bg-secondary {
480
+ background-color: var(--color-secondary);
481
+ }
189
482
  .bg-transparent {
190
483
  background-color: transparent;
191
484
  }
485
+ .bg-white {
486
+ background-color: var(--color-white);
487
+ }
488
+ .p-0 {
489
+ padding: calc(var(--spacing) * 0);
490
+ }
192
491
  .p-1 {
193
492
  padding: calc(var(--spacing) * 1);
194
493
  }
494
+ .p-1\.5 {
495
+ padding: calc(var(--spacing) * 1.5);
496
+ }
497
+ .p-3 {
498
+ padding: calc(var(--spacing) * 3);
499
+ }
500
+ .p-6 {
501
+ padding: calc(var(--spacing) * 6);
502
+ }
503
+ .p-12 {
504
+ padding: calc(var(--spacing) * 12);
505
+ }
506
+ .px-1 {
507
+ padding-inline: calc(var(--spacing) * 1);
508
+ }
195
509
  .px-1\.5 {
196
510
  padding-inline: calc(var(--spacing) * 1.5);
197
511
  }
@@ -201,51 +515,94 @@
201
515
  .px-2\.5 {
202
516
  padding-inline: calc(var(--spacing) * 2.5);
203
517
  }
518
+ .px-3 {
519
+ padding-inline: calc(var(--spacing) * 3);
520
+ }
521
+ .px-5 {
522
+ padding-inline: calc(var(--spacing) * 5);
523
+ }
524
+ .px-6 {
525
+ padding-inline: calc(var(--spacing) * 6);
526
+ }
527
+ .px-7 {
528
+ padding-inline: calc(var(--spacing) * 7);
529
+ }
530
+ .px-8 {
531
+ padding-inline: calc(var(--spacing) * 8);
532
+ }
533
+ .py-0\.5 {
534
+ padding-block: calc(var(--spacing) * 0.5);
535
+ }
204
536
  .py-1 {
205
537
  padding-block: calc(var(--spacing) * 1);
206
538
  }
207
- .font-sans {
208
- font-family: var(--font-sans);
539
+ .py-1\.5 {
540
+ padding-block: calc(var(--spacing) * 1.5);
209
541
  }
210
- .text-2xl {
211
- font-size: var(--text-2xl);
212
- line-height: var(--tw-leading, var(--text-2xl--line-height));
213
- letter-spacing: var(--tw-tracking, var(--text-2xl--letter-spacing));
542
+ .py-2 {
543
+ padding-block: calc(var(--spacing) * 2);
214
544
  }
215
- .text-3xl {
216
- font-size: var(--text-3xl);
217
- line-height: var(--tw-leading, var(--text-3xl--line-height));
218
- letter-spacing: var(--tw-tracking, var(--text-3xl--letter-spacing));
545
+ .py-4 {
546
+ padding-block: calc(var(--spacing) * 4);
219
547
  }
220
- .text-4xl {
221
- font-size: var(--text-4xl);
222
- line-height: var(--tw-leading, var(--text-4xl--line-height));
223
- letter-spacing: var(--tw-tracking, var(--text-4xl--letter-spacing));
548
+ .py-8 {
549
+ padding-block: calc(var(--spacing) * 8);
550
+ }
551
+ .py-10 {
552
+ padding-block: calc(var(--spacing) * 10);
553
+ }
554
+ .py-12 {
555
+ padding-block: calc(var(--spacing) * 12);
556
+ }
557
+ .py-\[10px\] {
558
+ padding-block: 10px;
559
+ }
560
+ .pt-1 {
561
+ padding-top: calc(var(--spacing) * 1);
562
+ }
563
+ .pt-2 {
564
+ padding-top: calc(var(--spacing) * 2);
565
+ }
566
+ .pr-2 {
567
+ padding-right: calc(var(--spacing) * 2);
568
+ }
569
+ .pr-3 {
570
+ padding-right: calc(var(--spacing) * 3);
224
571
  }
225
- .text-5xl {
226
- font-size: var(--text-5xl);
227
- line-height: var(--tw-leading, var(--text-5xl--line-height));
228
- letter-spacing: var(--tw-tracking, var(--text-5xl--letter-spacing));
572
+ .pr-12 {
573
+ padding-right: calc(var(--spacing) * 12);
229
574
  }
230
- .text-6xl {
231
- font-size: var(--text-6xl);
232
- line-height: var(--tw-leading, var(--text-6xl--line-height));
233
- letter-spacing: var(--tw-tracking, var(--text-6xl--letter-spacing));
575
+ .pb-6 {
576
+ padding-bottom: calc(var(--spacing) * 6);
234
577
  }
235
- .text-7xl {
236
- font-size: var(--text-7xl);
237
- line-height: var(--tw-leading, var(--text-7xl--line-height));
238
- letter-spacing: var(--tw-tracking, var(--text-7xl--letter-spacing));
578
+ .pb-8 {
579
+ padding-bottom: calc(var(--spacing) * 8);
239
580
  }
240
- .text-8xl {
241
- font-size: var(--text-8xl);
242
- line-height: var(--tw-leading, var(--text-8xl--line-height));
243
- letter-spacing: var(--tw-tracking, var(--text-8xl--letter-spacing));
581
+ .pl-3 {
582
+ padding-left: calc(var(--spacing) * 3);
244
583
  }
245
- .text-9xl {
246
- font-size: var(--text-9xl);
247
- line-height: var(--tw-leading, var(--text-9xl--line-height));
248
- letter-spacing: var(--tw-tracking, var(--text-9xl--letter-spacing));
584
+ .pl-4 {
585
+ padding-left: calc(var(--spacing) * 4);
586
+ }
587
+ .text-center {
588
+ text-align: center;
589
+ }
590
+ .text-left {
591
+ text-align: left;
592
+ }
593
+ .font-body {
594
+ font-family: var(--font-body);
595
+ }
596
+ .font-display {
597
+ font-family: var(--font-display);
598
+ }
599
+ .font-sans {
600
+ font-family: var(--font-sans);
601
+ }
602
+ .text-4xl {
603
+ font-size: var(--text-4xl);
604
+ line-height: var(--tw-leading, var(--text-4xl--line-height));
605
+ letter-spacing: var(--tw-tracking, var(--text-4xl--letter-spacing));
249
606
  }
250
607
  .text-base {
251
608
  font-size: var(--text-base);
@@ -272,30 +629,140 @@
272
629
  line-height: var(--tw-leading, var(--text-xs--line-height));
273
630
  letter-spacing: var(--tw-tracking, var(--text-xs--letter-spacing));
274
631
  }
632
+ .text-body {
633
+ font-size: var(--text-body);
634
+ line-height: var(--tw-leading, var(--text-body--line-height));
635
+ }
636
+ .leading-5 {
637
+ --tw-leading: calc(var(--spacing) * 5);
638
+ line-height: calc(var(--spacing) * 5);
639
+ }
640
+ .leading-6 {
641
+ --tw-leading: calc(var(--spacing) * 6);
642
+ line-height: calc(var(--spacing) * 6);
643
+ }
644
+ .leading-none {
645
+ --tw-leading: 1;
646
+ line-height: 1;
647
+ }
648
+ .leading-tight {
649
+ --tw-leading: var(--leading-tight);
650
+ line-height: var(--leading-tight);
651
+ }
652
+ .font-bold {
653
+ --tw-font-weight: var(--font-weight-bold);
654
+ font-weight: var(--font-weight-bold);
655
+ }
275
656
  .font-medium {
276
657
  --tw-font-weight: var(--font-weight-medium);
277
658
  font-weight: var(--font-weight-medium);
278
659
  }
660
+ .font-normal {
661
+ --tw-font-weight: var(--font-weight-normal);
662
+ font-weight: var(--font-weight-normal);
663
+ }
664
+ .font-semibold {
665
+ --tw-font-weight: var(--font-weight-semibold);
666
+ font-weight: var(--font-weight-semibold);
667
+ }
668
+ .tracking-display-tight {
669
+ --tw-tracking: var(--tracking-display-tight);
670
+ letter-spacing: var(--tracking-display-tight);
671
+ }
672
+ .tracking-tight {
673
+ --tw-tracking: var(--tracking-tight);
674
+ letter-spacing: var(--tracking-tight);
675
+ }
676
+ .break-words {
677
+ overflow-wrap: break-word;
678
+ }
279
679
  .whitespace-nowrap {
280
680
  white-space: nowrap;
281
681
  }
682
+ .text-\(--color-accent\,\#A89B83\) {
683
+ color: var(--color-accent,#A89B83);
684
+ }
685
+ .text-\(--color-dark\,\#200C02\) {
686
+ color: var(--color-dark,#200C02);
687
+ }
688
+ .text-\[\#0A0A0A\] {
689
+ color: #0A0A0A;
690
+ }
691
+ .text-card-foreground {
692
+ color: var(--color-card-foreground);
693
+ }
694
+ .text-destructive {
695
+ color: var(--color-destructive);
696
+ }
697
+ .text-destructive-foreground {
698
+ color: var(--color-destructive-foreground);
699
+ }
282
700
  .text-foreground {
283
701
  color: var(--color-foreground);
284
702
  }
703
+ .text-muted-foreground {
704
+ color: var(--color-muted-foreground);
705
+ }
706
+ .text-primary-foreground {
707
+ color: var(--color-primary-foreground);
708
+ }
709
+ .text-red-500 {
710
+ color: var(--color-red-500);
711
+ }
712
+ .text-secondary-foreground {
713
+ color: var(--color-secondary-foreground);
714
+ }
285
715
  .italic {
286
716
  font-style: italic;
287
717
  }
288
718
  .underline {
289
719
  text-decoration-line: underline;
290
720
  }
721
+ .opacity-50 {
722
+ opacity: 50%;
723
+ }
724
+ .opacity-80 {
725
+ opacity: 80%;
726
+ }
727
+ .opacity-100 {
728
+ opacity: 100%;
729
+ }
730
+ .shadow-\[0_0_0_1px_var\(--ohw-destructive\)\] {
731
+ --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--ohw-destructive));
732
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
733
+ }
734
+ .shadow-\[0_0_0_1px_var\(--ohw-primary\)\] {
735
+ --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--ohw-primary));
736
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
737
+ }
738
+ .shadow-lg {
739
+ --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
740
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
741
+ }
742
+ .shadow-none {
743
+ --tw-shadow: 0 0 #0000;
744
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
745
+ }
291
746
  .shadow-popover {
292
747
  --tw-shadow: 0px 1px 3px var(--tw-shadow-color, rgba(0, 0, 0, 0.1)), 0px 1px 2px var(--tw-shadow-color, rgba(0, 0, 0, 0.06));
293
748
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
294
749
  }
750
+ .shadow-sm {
751
+ --tw-shadow: 0px 1px 2px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.05));
752
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
753
+ }
754
+ .shadow-xl {
755
+ --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));
756
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
757
+ }
295
758
  .shadow-xs {
296
759
  --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
297
760
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
298
761
  }
762
+ .ring-0 {
763
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
764
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
765
+ }
299
766
  .outline {
300
767
  outline-style: var(--tw-outline-style);
301
768
  outline-width: 1px;
@@ -303,15 +770,33 @@
303
770
  .filter {
304
771
  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,);
305
772
  }
773
+ .transition-\[border-color\,box-shadow\] {
774
+ transition-property: border-color,box-shadow;
775
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
776
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
777
+ }
306
778
  .transition-\[color\,box-shadow\] {
307
779
  transition-property: color,box-shadow;
308
780
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
309
781
  transition-duration: var(--tw-duration, var(--default-transition-duration));
310
782
  }
783
+ .transition-colors {
784
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
785
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
786
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
787
+ }
311
788
  .outline-none {
312
789
  --tw-outline-style: none;
313
790
  outline-style: none;
314
791
  }
792
+ .placeholder\:text-muted-foreground {
793
+ &::-moz-placeholder {
794
+ color: var(--color-muted-foreground);
795
+ }
796
+ &::placeholder {
797
+ color: var(--color-muted-foreground);
798
+ }
799
+ }
315
800
  .hover\:bg-accent {
316
801
  &:hover {
317
802
  @media (hover: hover) {
@@ -319,6 +804,16 @@
319
804
  }
320
805
  }
321
806
  }
807
+ .hover\:bg-destructive\/80 {
808
+ &:hover {
809
+ @media (hover: hover) {
810
+ background-color: var(--color-destructive);
811
+ @supports (color: color-mix(in lab, red, red)) {
812
+ background-color: color-mix(in oklab, var(--color-destructive) 80%, transparent);
813
+ }
814
+ }
815
+ }
816
+ }
322
817
  .hover\:bg-muted {
323
818
  &:hover {
324
819
  @media (hover: hover) {
@@ -326,6 +821,53 @@
326
821
  }
327
822
  }
328
823
  }
824
+ .hover\:bg-muted\/30 {
825
+ &:hover {
826
+ @media (hover: hover) {
827
+ background-color: var(--color-muted);
828
+ @supports (color: color-mix(in lab, red, red)) {
829
+ background-color: color-mix(in oklab, var(--color-muted) 30%, transparent);
830
+ }
831
+ }
832
+ }
833
+ }
834
+ .hover\:bg-muted\/50 {
835
+ &:hover {
836
+ @media (hover: hover) {
837
+ background-color: var(--color-muted);
838
+ @supports (color: color-mix(in lab, red, red)) {
839
+ background-color: color-mix(in oklab, var(--color-muted) 50%, transparent);
840
+ }
841
+ }
842
+ }
843
+ }
844
+ .hover\:bg-muted\/80 {
845
+ &:hover {
846
+ @media (hover: hover) {
847
+ background-color: var(--color-muted);
848
+ @supports (color: color-mix(in lab, red, red)) {
849
+ background-color: color-mix(in oklab, var(--color-muted) 80%, transparent);
850
+ }
851
+ }
852
+ }
853
+ }
854
+ .hover\:bg-primary {
855
+ &:hover {
856
+ @media (hover: hover) {
857
+ background-color: var(--color-primary);
858
+ }
859
+ }
860
+ }
861
+ .hover\:bg-secondary\/80 {
862
+ &:hover {
863
+ @media (hover: hover) {
864
+ background-color: var(--color-secondary);
865
+ @supports (color: color-mix(in lab, red, red)) {
866
+ background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
867
+ }
868
+ }
869
+ }
870
+ }
329
871
  .hover\:bg-transparent {
330
872
  &:hover {
331
873
  @media (hover: hover) {
@@ -354,6 +896,36 @@
354
896
  }
355
897
  }
356
898
  }
899
+ .hover\:opacity-90 {
900
+ &:hover {
901
+ @media (hover: hover) {
902
+ opacity: 90%;
903
+ }
904
+ }
905
+ }
906
+ .focus\:ring-2 {
907
+ &:focus {
908
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
909
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
910
+ }
911
+ }
912
+ .focus\:ring-ring {
913
+ &:focus {
914
+ --tw-ring-color: var(--color-ring);
915
+ }
916
+ }
917
+ .focus\:ring-offset-2 {
918
+ &:focus {
919
+ --tw-ring-offset-width: 2px;
920
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
921
+ }
922
+ }
923
+ .focus\:outline-none {
924
+ &:focus {
925
+ --tw-outline-style: none;
926
+ outline-style: none;
927
+ }
928
+ }
357
929
  .focus-visible\:border-ring {
358
930
  &:focus-visible {
359
931
  border-color: var(--color-ring);
@@ -378,6 +950,11 @@
378
950
  pointer-events: none;
379
951
  }
380
952
  }
953
+ .disabled\:cursor-not-allowed {
954
+ &:disabled {
955
+ cursor: not-allowed;
956
+ }
957
+ }
381
958
  .disabled\:opacity-50 {
382
959
  &:disabled {
383
960
  opacity: 50%;
@@ -431,6 +1008,68 @@
431
1008
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
432
1009
  }
433
1010
  }
1011
+ .sm\:contents {
1012
+ @media (width >= 40rem) {
1013
+ display: contents;
1014
+ }
1015
+ }
1016
+ .sm\:flex {
1017
+ @media (width >= 40rem) {
1018
+ display: flex;
1019
+ }
1020
+ }
1021
+ .sm\:hidden {
1022
+ @media (width >= 40rem) {
1023
+ display: none;
1024
+ }
1025
+ }
1026
+ .sm\:w-\[120px\] {
1027
+ @media (width >= 40rem) {
1028
+ width: 120px;
1029
+ }
1030
+ }
1031
+ .sm\:w-\[200px\] {
1032
+ @media (width >= 40rem) {
1033
+ width: 200px;
1034
+ }
1035
+ }
1036
+ .sm\:shrink-0 {
1037
+ @media (width >= 40rem) {
1038
+ flex-shrink: 0;
1039
+ }
1040
+ }
1041
+ .sm\:items-center {
1042
+ @media (width >= 40rem) {
1043
+ align-items: center;
1044
+ }
1045
+ }
1046
+ .sm\:gap-\[60px\] {
1047
+ @media (width >= 40rem) {
1048
+ gap: 60px;
1049
+ }
1050
+ }
1051
+ .sm\:p-10 {
1052
+ @media (width >= 40rem) {
1053
+ padding: calc(var(--spacing) * 10);
1054
+ }
1055
+ }
1056
+ .sm\:px-16 {
1057
+ @media (width >= 40rem) {
1058
+ padding-inline: calc(var(--spacing) * 16);
1059
+ }
1060
+ }
1061
+ .sm\:py-20 {
1062
+ @media (width >= 40rem) {
1063
+ padding-block: calc(var(--spacing) * 20);
1064
+ }
1065
+ }
1066
+ .sm\:text-5xl {
1067
+ @media (width >= 40rem) {
1068
+ font-size: var(--text-5xl);
1069
+ line-height: var(--tw-leading, var(--text-5xl--line-height));
1070
+ letter-spacing: var(--tw-tracking, var(--text-5xl--letter-spacing));
1071
+ }
1072
+ }
434
1073
  .\[\&_svg\]\:pointer-events-none {
435
1074
  & svg {
436
1075
  pointer-events: none;
@@ -448,14 +1087,16 @@
448
1087
  }
449
1088
  }
450
1089
  [data-ohw-bridge-root] {
1090
+ --color-primary: var(--ohw-primary, #0885FE);
1091
+ --color-primary-foreground: var(--ohw-primary-foreground, #FAFAF9);
1092
+ --ohw-primary: #0885FE;
1093
+ --ohw-primary-foreground: #FAFAF9;
451
1094
  --ohw-background: #ffffff;
452
1095
  --ohw-foreground: #020617;
453
1096
  --ohw-card: #ffffff;
454
1097
  --ohw-card-foreground: #020617;
455
1098
  --ohw-popover: #ffffff;
456
1099
  --ohw-popover-foreground: #020617;
457
- --ohw-primary: #0f172a;
458
- --ohw-primary-foreground: #f8fafc;
459
1100
  --ohw-hover-primary: #1e293b;
460
1101
  --ohw-secondary: #f1f5f9;
461
1102
  --ohw-secondary-foreground: #0f172a;
@@ -480,6 +1121,111 @@
480
1121
  --ohw-success: #16a34a;
481
1122
  --ohw-hover-success: #15803d;
482
1123
  }
1124
+ [data-ohw-link-modal-root],
1125
+ [data-ohw-link-popover-root] {
1126
+ --ohw-background: #ffffff;
1127
+ --ohw-foreground: #0c0a09;
1128
+ --ohw-card: #ffffff;
1129
+ --ohw-card-foreground: #0c0a09;
1130
+ --ohw-popover: #ffffff;
1131
+ --ohw-popover-foreground: #0c0a09;
1132
+ --ohw-primary: #0885fe;
1133
+ --ohw-primary-foreground: #fafaf9;
1134
+ --ohw-secondary: #f5f5f4;
1135
+ --ohw-secondary-foreground: #0c0a09;
1136
+ --ohw-muted: #f5f5f4;
1137
+ --ohw-muted-foreground: #78716c;
1138
+ --ohw-border: #e7e5e4;
1139
+ --ohw-input: #e7e5e4;
1140
+ --ohw-ring: #0885fe;
1141
+ --ohw-destructive: #c10007;
1142
+ --ohw-destructive-foreground: #fafaf9;
1143
+ --color-primary: var(--ohw-primary);
1144
+ --color-primary-foreground: var(--ohw-primary-foreground);
1145
+ --color-background: var(--ohw-background);
1146
+ --color-foreground: var(--ohw-foreground);
1147
+ --color-card-foreground: var(--ohw-card-foreground);
1148
+ --color-border: var(--ohw-border);
1149
+ --color-input: var(--ohw-input);
1150
+ --color-muted: var(--ohw-muted);
1151
+ --color-muted-foreground: var(--ohw-muted-foreground);
1152
+ --color-popover: var(--ohw-popover);
1153
+ --color-popover-foreground: var(--ohw-popover-foreground);
1154
+ --color-destructive: var(--ohw-destructive);
1155
+ --color-ring: var(--ohw-ring);
1156
+ --font-sans: Figtree, ui-sans-serif, system-ui, sans-serif;
1157
+ font-family: var(--font-sans);
1158
+ color: var(--ohw-foreground);
1159
+ letter-spacing: normal;
1160
+ line-height: normal;
1161
+ }
1162
+ [data-ohw-link-modal-root] :is(h1, h2, h3, h4, h5, h6, p, label, input, button, span, a, li),
1163
+ [data-ohw-link-popover-root] :is(h1, h2, h3, h4, h5, h6, p, label, input, button, span, a, li) {
1164
+ font-family: var(--font-sans);
1165
+ letter-spacing: normal;
1166
+ }
1167
+ [data-ohw-link-modal-root] h2,
1168
+ [data-ohw-link-popover-root] h2 {
1169
+ font-weight: 600;
1170
+ line-height: 1;
1171
+ letter-spacing: -0.025em;
1172
+ color: var(--ohw-card-foreground);
1173
+ }
1174
+ [data-ohw-link-modal-root] p,
1175
+ [data-ohw-link-popover-root] p {
1176
+ font-weight: 400;
1177
+ line-height: 1.25rem;
1178
+ color: inherit;
1179
+ }
1180
+ [data-ohw-link-modal-root] label,
1181
+ [data-ohw-link-popover-root] label {
1182
+ font-weight: 500;
1183
+ line-height: 1.25rem;
1184
+ color: var(--ohw-foreground);
1185
+ }
1186
+ [data-ohw-link-modal-root] [data-slot="button"] {
1187
+ font-weight: 500;
1188
+ line-height: 1.5rem;
1189
+ }
1190
+ [data-ohw-link-modal-root] [data-slot="button"].bg-primary {
1191
+ background-color: var(--ohw-primary);
1192
+ color: var(--ohw-primary-foreground);
1193
+ }
1194
+ [data-ohw-link-modal-root] [data-slot="button"].border-border {
1195
+ background-color: var(--ohw-background);
1196
+ border-color: var(--ohw-border);
1197
+ color: var(--ohw-foreground);
1198
+ }
1199
+ [data-ohw-link-modal-root] [data-ohw-link-field],
1200
+ [data-ohw-link-modal-root] [data-ohw-link-field] button {
1201
+ font-family: var(--font-sans);
1202
+ -webkit-appearance: none;
1203
+ -moz-appearance: none;
1204
+ appearance: none;
1205
+ }
1206
+ [data-ohw-link-modal-root] [data-ohw-link-field] input,
1207
+ [data-ohw-link-modal-root] [data-ohw-link-field] [data-slot="input"] {
1208
+ border: 0 !important;
1209
+ outline: none !important;
1210
+ box-shadow: none !important;
1211
+ background: transparent !important;
1212
+ padding: 0 !important;
1213
+ margin: 0 !important;
1214
+ min-height: 0;
1215
+ -webkit-appearance: none;
1216
+ -moz-appearance: none;
1217
+ appearance: none;
1218
+ }
1219
+ [data-ohw-link-modal-root] footer [data-slot="button"]:last-child:not(:disabled) {
1220
+ background-color: var(--ohw-primary) !important;
1221
+ color: var(--ohw-primary-foreground) !important;
1222
+ border-color: transparent !important;
1223
+ }
1224
+ [data-ohw-link-modal-root] footer [data-slot="button"]:first-child {
1225
+ background-color: var(--ohw-background) !important;
1226
+ border-color: var(--ohw-border) !important;
1227
+ color: var(--ohw-foreground) !important;
1228
+ }
483
1229
  [data-ohw-bridge-root].dark {
484
1230
  --ohw-background: #020617;
485
1231
  --ohw-foreground: #f8fafc;
@@ -517,7 +1263,7 @@
517
1263
  [data-ohw-bridge-root] {
518
1264
  font-family: var(--font-sans);
519
1265
  }
520
- [data-ohw-bridge-root] button {
1266
+ [data-ohw-bridge-root] button:not([data-slot="button"]) {
521
1267
  border: none;
522
1268
  background: none;
523
1269
  padding: 0;
@@ -529,6 +1275,21 @@
529
1275
  appearance: none;
530
1276
  }
531
1277
  }
1278
+ @property --tw-translate-x {
1279
+ syntax: "*";
1280
+ inherits: false;
1281
+ initial-value: 0;
1282
+ }
1283
+ @property --tw-translate-y {
1284
+ syntax: "*";
1285
+ inherits: false;
1286
+ initial-value: 0;
1287
+ }
1288
+ @property --tw-translate-z {
1289
+ syntax: "*";
1290
+ inherits: false;
1291
+ initial-value: 0;
1292
+ }
532
1293
  @property --tw-rotate-x {
533
1294
  syntax: "*";
534
1295
  inherits: false;
@@ -554,10 +1315,18 @@
554
1315
  inherits: false;
555
1316
  initial-value: solid;
556
1317
  }
1318
+ @property --tw-leading {
1319
+ syntax: "*";
1320
+ inherits: false;
1321
+ }
557
1322
  @property --tw-font-weight {
558
1323
  syntax: "*";
559
1324
  inherits: false;
560
1325
  }
1326
+ @property --tw-tracking {
1327
+ syntax: "*";
1328
+ inherits: false;
1329
+ }
561
1330
  @property --tw-shadow {
562
1331
  syntax: "*";
563
1332
  inherits: false;
@@ -684,13 +1453,18 @@
684
1453
  @layer properties {
685
1454
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
686
1455
  *, ::before, ::after, ::backdrop {
1456
+ --tw-translate-x: 0;
1457
+ --tw-translate-y: 0;
1458
+ --tw-translate-z: 0;
687
1459
  --tw-rotate-x: initial;
688
1460
  --tw-rotate-y: initial;
689
1461
  --tw-rotate-z: initial;
690
1462
  --tw-skew-x: initial;
691
1463
  --tw-skew-y: initial;
692
1464
  --tw-border-style: solid;
1465
+ --tw-leading: initial;
693
1466
  --tw-font-weight: initial;
1467
+ --tw-tracking: initial;
694
1468
  --tw-shadow: 0 0 #0000;
695
1469
  --tw-shadow-color: initial;
696
1470
  --tw-shadow-alpha: 100%;