@deframe-sdk/components 0.1.17 → 0.1.19

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
@@ -313,6 +313,9 @@
313
313
  .z-\[1\] {
314
314
  z-index: 1;
315
315
  }
316
+ .z-\[9999\] {
317
+ z-index: 9999;
318
+ }
316
319
  .container {
317
320
  width: 100%;
318
321
  @media (width >= 40rem) {
@@ -331,6 +334,9 @@
331
334
  max-width: 96rem;
332
335
  }
333
336
  }
337
+ .m-0 {
338
+ margin: calc(var(--spacing) * 0);
339
+ }
334
340
  .m-\[var\(--deframe-widget-size-gap-none\)\] {
335
341
  margin: var(--deframe-widget-size-gap-none);
336
342
  }
@@ -343,9 +349,15 @@
343
349
  .-my-5 {
344
350
  margin-block: calc(var(--spacing) * -5);
345
351
  }
352
+ .-my-\[16px\] {
353
+ margin-block: calc(16px * -1);
354
+ }
346
355
  .-my-\[var\(--deframe-widget-size-gap-sm\)\] {
347
356
  margin-block: calc(var(--deframe-widget-size-gap-sm) * -1);
348
357
  }
358
+ .my-\[var\(--deframe-widget-size-gap-sm\)\] {
359
+ margin-block: var(--deframe-widget-size-gap-sm);
360
+ }
349
361
  .my-\[var\(--deframe-widget-size-gap-xs\)\] {
350
362
  margin-block: var(--deframe-widget-size-gap-xs);
351
363
  }
@@ -367,6 +379,9 @@
367
379
  .mt-\[3px\] {
368
380
  margin-top: 3px;
369
381
  }
382
+ .mt-\[6px\] {
383
+ margin-top: 6px;
384
+ }
370
385
  .mt-\[10px\] {
371
386
  margin-top: 10px;
372
387
  }
@@ -499,9 +514,6 @@
499
514
  .h-24 {
500
515
  height: calc(var(--spacing) * 24);
501
516
  }
502
- .h-32 {
503
- height: calc(var(--spacing) * 32);
504
- }
505
517
  .h-40 {
506
518
  height: calc(var(--spacing) * 40);
507
519
  }
@@ -526,6 +538,12 @@
526
538
  .h-\[12px\] {
527
539
  height: 12px;
528
540
  }
541
+ .h-\[13px\] {
542
+ height: 13px;
543
+ }
544
+ .h-\[14px\] {
545
+ height: 14px;
546
+ }
529
547
  .h-\[15px\] {
530
548
  height: 15px;
531
549
  }
@@ -538,6 +556,9 @@
538
556
  .h-\[20px\] {
539
557
  height: 20px;
540
558
  }
559
+ .h-\[38px\] {
560
+ height: 38px;
561
+ }
541
562
  .h-\[50vh\] {
542
563
  height: 50vh;
543
564
  }
@@ -565,9 +586,6 @@
565
586
  .h-\[300px\] {
566
587
  height: 300px;
567
588
  }
568
- .h-\[420px\] {
569
- height: 420px;
570
- }
571
589
  .h-\[440px\] {
572
590
  height: 440px;
573
591
  }
@@ -577,6 +595,9 @@
577
595
  .h-\[844px\] {
578
596
  height: 844px;
579
597
  }
598
+ .h-\[min\(620px\,calc\(100vh-64px\)\)\] {
599
+ height: min(620px, calc(100vh - 64px));
600
+ }
580
601
  .h-\[var\(--deframe-widget-font-leading-lg\)\] {
581
602
  height: var(--deframe-widget-font-leading-lg);
582
603
  }
@@ -712,12 +733,33 @@
712
733
  .w-\[7px\] {
713
734
  width: 7px;
714
735
  }
736
+ .w-\[12px\] {
737
+ width: 12px;
738
+ }
739
+ .w-\[14px\] {
740
+ width: 14px;
741
+ }
715
742
  .w-\[15px\] {
716
743
  width: 15px;
717
744
  }
718
745
  .w-\[18px\] {
719
746
  width: 18px;
720
747
  }
748
+ .w-\[36px\] {
749
+ width: 36px;
750
+ }
751
+ .w-\[38px\] {
752
+ width: 38px;
753
+ }
754
+ .w-\[40\%\] {
755
+ width: 40%;
756
+ }
757
+ .w-\[50px\] {
758
+ width: 50px;
759
+ }
760
+ .w-\[60\%\] {
761
+ width: 60%;
762
+ }
721
763
  .w-\[83px\] {
722
764
  width: 83px;
723
765
  }
@@ -754,6 +796,12 @@
754
796
  .w-\[440px\] {
755
797
  width: 440px;
756
798
  }
799
+ .w-\[480px\] {
800
+ width: 480px;
801
+ }
802
+ .w-\[532px\] {
803
+ width: 532px;
804
+ }
757
805
  .w-\[clamp\(18rem\,40vw\,30rem\)\] {
758
806
  width: clamp(18rem, 40vw, 30rem);
759
807
  }
@@ -793,6 +841,12 @@
793
841
  .max-w-\[620px\] {
794
842
  max-width: 620px;
795
843
  }
844
+ .max-w-\[calc\(100\%-32px\)\] {
845
+ max-width: calc(100% - 32px);
846
+ }
847
+ .max-w-fit {
848
+ max-width: fit-content;
849
+ }
796
850
  .max-w-full {
797
851
  max-width: 100%;
798
852
  }
@@ -826,6 +880,9 @@
826
880
  .shrink-0 {
827
881
  flex-shrink: 0;
828
882
  }
883
+ .origin-left {
884
+ transform-origin: 0;
885
+ }
829
886
  .-translate-x-1\/2 {
830
887
  --tw-translate-x: calc(calc(1/2 * 100%) * -1);
831
888
  translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -842,6 +899,12 @@
842
899
  --tw-translate-y: calc(var(--spacing) * -2);
843
900
  translate: var(--tw-translate-x) var(--tw-translate-y);
844
901
  }
902
+ .scale-90 {
903
+ --tw-scale-x: 90%;
904
+ --tw-scale-y: 90%;
905
+ --tw-scale-z: 90%;
906
+ scale: var(--tw-scale-x) var(--tw-scale-y);
907
+ }
845
908
  .rotate-180 {
846
909
  rotate: 180deg;
847
910
  }
@@ -1152,10 +1215,6 @@
1152
1215
  border-style: var(--tw-border-style);
1153
1216
  border-width: 1px;
1154
1217
  }
1155
- .border-0 {
1156
- border-style: var(--tw-border-style);
1157
- border-width: 0px;
1158
- }
1159
1218
  .border-\[length\:var\(--deframe-widget-size-border-sm\)\] {
1160
1219
  border-style: var(--tw-border-style);
1161
1220
  border-width: var(--deframe-widget-size-border-sm);
@@ -1206,6 +1265,12 @@
1206
1265
  border-color: color-mix(in srgb,var(--deframe-widget-color-state-error) 32%,transparent);
1207
1266
  }
1208
1267
  }
1268
+ .border-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-info\)_28\%\,transparent\)\] {
1269
+ border-color: var(--deframe-widget-color-state-info);
1270
+ @supports (color: color-mix(in lab, red, red)) {
1271
+ border-color: color-mix(in srgb,var(--deframe-widget-color-state-info) 28%,transparent);
1272
+ }
1273
+ }
1209
1274
  .border-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-info\)_32\%\,transparent\)\] {
1210
1275
  border-color: var(--deframe-widget-color-state-info);
1211
1276
  @supports (color: color-mix(in lab, red, red)) {
@@ -1314,6 +1379,12 @@
1314
1379
  .bg-\[\#2A2A2A\] {
1315
1380
  background-color: #2A2A2A;
1316
1381
  }
1382
+ .bg-\[\#12151C\] {
1383
+ background-color: #12151C;
1384
+ }
1385
+ .bg-\[\#12151c\] {
1386
+ background-color: #12151c;
1387
+ }
1317
1388
  .bg-\[\#ff7a45\] {
1318
1389
  background-color: #ff7a45;
1319
1390
  }
@@ -1359,6 +1430,12 @@
1359
1430
  background-color: color-mix(in srgb,var(--deframe-widget-color-brand-primary) 18%,transparent);
1360
1431
  }
1361
1432
  }
1433
+ .bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-error\)_12\%\,transparent\)\] {
1434
+ background-color: var(--deframe-widget-color-state-error);
1435
+ @supports (color: color-mix(in lab, red, red)) {
1436
+ background-color: color-mix(in srgb,var(--deframe-widget-color-state-error) 12%,transparent);
1437
+ }
1438
+ }
1362
1439
  .bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-error\)_16\%\,transparent\)\] {
1363
1440
  background-color: var(--deframe-widget-color-state-error);
1364
1441
  @supports (color: color-mix(in lab, red, red)) {
@@ -1377,6 +1454,12 @@
1377
1454
  background-color: color-mix(in srgb,var(--deframe-widget-color-state-info) 16%,transparent);
1378
1455
  }
1379
1456
  }
1457
+ .bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-info\)_18\%\,transparent\)\] {
1458
+ background-color: var(--deframe-widget-color-state-info);
1459
+ @supports (color: color-mix(in lab, red, red)) {
1460
+ background-color: color-mix(in srgb,var(--deframe-widget-color-state-info) 18%,transparent);
1461
+ }
1462
+ }
1380
1463
  .bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-success\)_12\%\,transparent\)\] {
1381
1464
  background-color: var(--deframe-widget-color-state-success);
1382
1465
  @supports (color: color-mix(in lab, red, red)) {
@@ -1395,6 +1478,12 @@
1395
1478
  background-color: color-mix(in srgb,var(--deframe-widget-color-state-success) 20%,transparent);
1396
1479
  }
1397
1480
  }
1481
+ .bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-warning\)_12\%\,transparent\)\] {
1482
+ background-color: var(--deframe-widget-color-state-warning);
1483
+ @supports (color: color-mix(in lab, red, red)) {
1484
+ background-color: color-mix(in srgb,var(--deframe-widget-color-state-warning) 12%,transparent);
1485
+ }
1486
+ }
1398
1487
  .bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-warning\)_16\%\,transparent\)\] {
1399
1488
  background-color: var(--deframe-widget-color-state-warning);
1400
1489
  @supports (color: color-mix(in lab, red, red)) {
@@ -1407,6 +1496,12 @@
1407
1496
  background-color: color-mix(in srgb,var(--deframe-widget-color-state-warning) 20%,transparent);
1408
1497
  }
1409
1498
  }
1499
+ .bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-text-secondary\)_12\%\,transparent\)\] {
1500
+ background-color: var(--deframe-widget-color-text-secondary);
1501
+ @supports (color: color-mix(in lab, red, red)) {
1502
+ background-color: color-mix(in srgb,var(--deframe-widget-color-text-secondary) 12%,transparent);
1503
+ }
1504
+ }
1410
1505
  .bg-\[var\(--deframe-widget-color-bg-primary\)\] {
1411
1506
  background-color: var(--deframe-widget-color-bg-primary);
1412
1507
  }
@@ -1515,6 +1610,9 @@
1515
1610
  background-color: color-mix(in oklab, var(--deframe-widget-color-state-warning) 20%, transparent);
1516
1611
  }
1517
1612
  }
1613
+ .bg-\[var\(--deframe-widget-color-text-secondary\)\] {
1614
+ background-color: var(--deframe-widget-color-text-secondary);
1615
+ }
1518
1616
  .bg-blue-50 {
1519
1617
  background-color: var(--color-blue-50);
1520
1618
  }
@@ -1672,6 +1770,9 @@
1672
1770
  .px-\[28px\] {
1673
1771
  padding-inline: 28px;
1674
1772
  }
1773
+ .px-\[calc\(var\(--deframe-widget-size-padding-x-xs\)\+2px\)\] {
1774
+ padding-inline: calc(var(--deframe-widget-size-padding-x-xs) + 2px);
1775
+ }
1675
1776
  .px-\[var\(--deframe-widget-size-padding-x-lg\)\] {
1676
1777
  padding-inline: var(--deframe-widget-size-padding-x-lg);
1677
1778
  }
@@ -1884,6 +1985,9 @@
1884
1985
  .\[font-size\:var\(--deframe-widget-font-size-xxl\)\] {
1885
1986
  font-size: var(--deframe-widget-font-size-xxl);
1886
1987
  }
1988
+ .text-\[7px\] {
1989
+ font-size: 7px;
1990
+ }
1887
1991
  .text-\[10px\] {
1888
1992
  font-size: 10px;
1889
1993
  }
@@ -1954,6 +2058,14 @@
1954
2058
  --tw-leading: 1.25;
1955
2059
  line-height: 1.25;
1956
2060
  }
2061
+ .leading-\[14px\] {
2062
+ --tw-leading: 14px;
2063
+ line-height: 14px;
2064
+ }
2065
+ .leading-\[16px\] {
2066
+ --tw-leading: 16px;
2067
+ line-height: 16px;
2068
+ }
1957
2069
  .leading-\[140\%\] {
1958
2070
  --tw-leading: 140%;
1959
2071
  line-height: 140%;
@@ -2237,6 +2349,9 @@
2237
2349
  .opacity-75 {
2238
2350
  opacity: 75%;
2239
2351
  }
2352
+ .opacity-80 {
2353
+ opacity: 80%;
2354
+ }
2240
2355
  .opacity-95 {
2241
2356
  opacity: 95%;
2242
2357
  }
@@ -2258,6 +2373,13 @@
2258
2373
  }
2259
2374
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2260
2375
  }
2376
+ .shadow-\[0_0_0_10px_color-mix\(in_srgb\,var\(--deframe-widget-color-state-warning\)_12\%\,transparent\)\,0_0_32px_color-mix\(in_srgb\,var\(--deframe-widget-color-state-warning\)_22\%\,transparent\)\] {
2377
+ --tw-shadow: 0 0 0 10px var(--tw-shadow-color, var(--deframe-widget-color-state-warning)), 0 0 32px var(--tw-shadow-color, var(--deframe-widget-color-state-warning));
2378
+ @supports (color: color-mix(in lab, red, red)) {
2379
+ --tw-shadow: 0 0 0 10px var(--tw-shadow-color, color-mix(in srgb,var(--deframe-widget-color-state-warning) 12%,transparent)), 0 0 32px var(--tw-shadow-color, color-mix(in srgb,var(--deframe-widget-color-state-warning) 22%,transparent));
2380
+ }
2381
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2382
+ }
2261
2383
  .shadow-\[0_2px_8px_color-mix\(in_srgb\,var\(--deframe-widget-color-text-primary\)_18\%\,transparent\)\] {
2262
2384
  --tw-shadow: 0 2px 8px var(--tw-shadow-color, var(--deframe-widget-color-text-primary));
2263
2385
  @supports (color: color-mix(in lab, red, red)) {
@@ -2279,6 +2401,18 @@
2279
2401
  }
2280
2402
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2281
2403
  }
2404
+ .shadow-\[0px_2px_8px_0px_\#0000003D\] {
2405
+ --tw-shadow: 0px 2px 8px 0px var(--tw-shadow-color, #0000003D);
2406
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2407
+ }
2408
+ .shadow-\[0px_4px_16px_0px_\#00000066\,0px_24px_80px_0px_\#00000099\] {
2409
+ --tw-shadow: 0px 4px 16px 0px var(--tw-shadow-color, #00000066), 0px 24px 80px 0px var(--tw-shadow-color, #00000099);
2410
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2411
+ }
2412
+ .shadow-\[0px_4px_24px_0px_\#0000003D\] {
2413
+ --tw-shadow: 0px 4px 24px 0px var(--tw-shadow-color, #0000003D);
2414
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2415
+ }
2282
2416
  .shadow-md {
2283
2417
  --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
2284
2418
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -2511,6 +2645,16 @@
2511
2645
  }
2512
2646
  }
2513
2647
  }
2648
+ .hover\:bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-bg-tertiary\)_72\%\,transparent\)\] {
2649
+ &:hover {
2650
+ @media (hover: hover) {
2651
+ background-color: var(--deframe-widget-color-bg-tertiary);
2652
+ @supports (color: color-mix(in lab, red, red)) {
2653
+ background-color: color-mix(in srgb,var(--deframe-widget-color-bg-tertiary) 72%,transparent);
2654
+ }
2655
+ }
2656
+ }
2657
+ }
2514
2658
  .hover\:bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-bg-tertiary\)_84\%\,transparent\)\] {
2515
2659
  &:hover {
2516
2660
  @media (hover: hover) {
@@ -2600,6 +2744,13 @@
2600
2744
  }
2601
2745
  }
2602
2746
  }
2747
+ .hover\:text-\[color\:var\(--deframe-widget-color-text-secondary\)\] {
2748
+ &:hover {
2749
+ @media (hover: hover) {
2750
+ color: var(--deframe-widget-color-text-secondary);
2751
+ }
2752
+ }
2753
+ }
2603
2754
  .hover\:no-underline {
2604
2755
  &:hover {
2605
2756
  @media (hover: hover) {
@@ -2703,6 +2854,26 @@
2703
2854
  opacity: 50%;
2704
2855
  }
2705
2856
  }
2857
+ .md\:flex-row {
2858
+ @media (width >= 48rem) {
2859
+ flex-direction: row;
2860
+ }
2861
+ }
2862
+ .md\:items-end {
2863
+ @media (width >= 48rem) {
2864
+ align-items: flex-end;
2865
+ }
2866
+ }
2867
+ .md\:gap-\[var\(--deframe-widget-size-gap-md\)\] {
2868
+ @media (width >= 48rem) {
2869
+ gap: var(--deframe-widget-size-gap-md);
2870
+ }
2871
+ }
2872
+ .md\:pl-\[var\(--deframe-widget-size-padding-x-md\)\] {
2873
+ @media (width >= 48rem) {
2874
+ padding-left: var(--deframe-widget-size-padding-x-md);
2875
+ }
2876
+ }
2706
2877
  .md\:\[font-size\:var\(--deframe-widget-font-size-md\)\] {
2707
2878
  @media (width >= 48rem) {
2708
2879
  font-size: var(--deframe-widget-font-size-md);
@@ -2754,6 +2925,284 @@
2754
2925
  }
2755
2926
  }
2756
2927
  }
2928
+ .deframe-widget.widget-theme--rounded, .deframe-widget.rounded {
2929
+ --deframe-widget-font-family: "Space Grotesk", "Avenir Next", sans-serif;
2930
+ --deframe-widget-font-size-md: 14px;
2931
+ --deframe-widget-font-size-lg: 17px;
2932
+ --deframe-widget-font-size-xl: 20px;
2933
+ --deframe-widget-font-size-xxl: 24px;
2934
+ --deframe-widget-size-gap-sm: 0.625rem;
2935
+ --deframe-widget-size-gap-md: 0.875rem;
2936
+ --deframe-widget-size-gap-lg: 1.125rem;
2937
+ --deframe-widget-size-gap-xl: 1.5rem;
2938
+ --deframe-widget-size-radius-xs: 0.75rem;
2939
+ --deframe-widget-size-radius-sm: 1rem;
2940
+ --deframe-widget-size-radius-md: 1.5rem;
2941
+ --deframe-widget-size-radius-lg: 2rem;
2942
+ --deframe-widget-size-radius-xl: 2.75rem;
2943
+ --deframe-widget-color-bg-primary: #fff6f0;
2944
+ --deframe-widget-color-bg-primary-dark: #26140e;
2945
+ --deframe-widget-color-bg-primary-disabled: #f0d2c1;
2946
+ --deframe-widget-color-bg-secondary: #fffdf9;
2947
+ --deframe-widget-color-bg-secondary-dark: #3d2419;
2948
+ --deframe-widget-color-bg-secondary-disabled: #f3ded2;
2949
+ --deframe-widget-color-bg-tertiary: #ffe6d6;
2950
+ --deframe-widget-color-bg-tertiary-dark: #6b4332;
2951
+ --deframe-widget-color-bg-tertiary-disabled: #ebc7b4;
2952
+ --deframe-widget-color-text-primary: #2d1810;
2953
+ --deframe-widget-color-text-primary-dark: #fffaf4;
2954
+ --deframe-widget-color-text-primary-disabled: #c59e8a;
2955
+ --deframe-widget-color-text-secondary: #734d3d;
2956
+ --deframe-widget-color-text-secondary-dark: #d8b5a6;
2957
+ --deframe-widget-color-text-secondary-disabled: #c59e8a;
2958
+ --deframe-widget-color-text-tertiary: #9d7564;
2959
+ --deframe-widget-color-text-tertiary-dark: #bb9886;
2960
+ --deframe-widget-color-text-tertiary-disabled: #d7b6a5;
2961
+ --deframe-widget-color-placeholder-primary: #bb9886;
2962
+ --deframe-widget-color-placeholder-primary-dark: #d7b6a5;
2963
+ --deframe-widget-color-placeholder-primary-disabled: #c59e8a;
2964
+ --deframe-widget-color-placeholder-secondary: #c59e8a;
2965
+ --deframe-widget-color-placeholder-secondary-dark: #e2c3b5;
2966
+ --deframe-widget-color-placeholder-secondary-disabled: #d7b6a5;
2967
+ --deframe-widget-color-placeholder-tertiary: #d7b6a5;
2968
+ --deframe-widget-color-placeholder-tertiary-dark: #e6cabd;
2969
+ --deframe-widget-color-placeholder-tertiary-disabled: #edd6cb;
2970
+ --deframe-widget-color-border-primary: rgba(78, 36, 15, 0.28);
2971
+ --deframe-widget-color-border-primary-dark: rgba(255, 250, 244, 0.22);
2972
+ --deframe-widget-color-border-primary-disabled: rgba(78, 36, 15, 0.16);
2973
+ --deframe-widget-color-border-secondary: rgba(78, 36, 15, 0.16);
2974
+ --deframe-widget-color-border-secondary-dark: rgba(255, 250, 244, 0.18);
2975
+ --deframe-widget-color-border-secondary-disabled: rgba(78, 36, 15, 0.1);
2976
+ --deframe-widget-color-border-tertiary: rgba(78, 36, 15, 0.08);
2977
+ --deframe-widget-color-border-tertiary-dark: rgba(255, 250, 244, 0.12);
2978
+ --deframe-widget-color-border-tertiary-disabled: rgba(78, 36, 15, 0.05);
2979
+ --deframe-widget-color-brand-primary: #ff6d3f;
2980
+ --deframe-widget-color-brand-primary-dark: #ff8a65;
2981
+ --deframe-widget-color-brand-primary-disabled: rgba(255, 109, 63, 0.22);
2982
+ --deframe-widget-color-brand-secondary: #ffb089;
2983
+ --deframe-widget-color-brand-secondary-dark: #ffd4bf;
2984
+ --deframe-widget-color-brand-secondary-disabled: #e0b39e;
2985
+ --deframe-widget-color-brand-tertiary: #ff8a65;
2986
+ --deframe-widget-color-brand-tertiary-dark: #ffc3a8;
2987
+ --deframe-widget-color-brand-tertiary-disabled: #d9a48d;
2988
+ --deframe-widget-color-state-success: #3dbb78;
2989
+ --deframe-widget-color-state-warning: #ffb845;
2990
+ --deframe-widget-color-state-error: #ff6d3f;
2991
+ --deframe-widget-color-state-info: #58b4ff;
2992
+ }
2993
+ .deframe-widget.widget-theme--squared, .deframe-widget.squared {
2994
+ --deframe-widget-font-family: "IBM Plex Sans", "Helvetica Neue", sans-serif;
2995
+ --deframe-widget-size-gap-sm: 0.375rem;
2996
+ --deframe-widget-size-gap-md: 0.5rem;
2997
+ --deframe-widget-size-gap-lg: 0.75rem;
2998
+ --deframe-widget-size-gap-xl: 1rem;
2999
+ --deframe-widget-size-radius-xs: 0;
3000
+ --deframe-widget-size-radius-sm: 0;
3001
+ --deframe-widget-size-radius-md: 0;
3002
+ --deframe-widget-size-radius-lg: 0;
3003
+ --deframe-widget-size-radius-xl: 0;
3004
+ --deframe-widget-color-bg-primary: #f5f7fb;
3005
+ --deframe-widget-color-bg-primary-dark: #111827;
3006
+ --deframe-widget-color-bg-primary-disabled: #dfe6f1;
3007
+ --deframe-widget-color-bg-secondary: #ffffff;
3008
+ --deframe-widget-color-bg-secondary-dark: #1f2937;
3009
+ --deframe-widget-color-bg-secondary-disabled: #edf2f8;
3010
+ --deframe-widget-color-bg-tertiary: #e6ebf4;
3011
+ --deframe-widget-color-bg-tertiary-dark: #374151;
3012
+ --deframe-widget-color-bg-tertiary-disabled: #d7deea;
3013
+ --deframe-widget-color-text-primary: #111827;
3014
+ --deframe-widget-color-text-primary-dark: #ffffff;
3015
+ --deframe-widget-color-text-primary-disabled: #9ca3af;
3016
+ --deframe-widget-color-text-secondary: #4b5563;
3017
+ --deframe-widget-color-text-secondary-dark: #d1d5db;
3018
+ --deframe-widget-color-text-secondary-disabled: #9ca3af;
3019
+ --deframe-widget-color-text-tertiary: #6b7280;
3020
+ --deframe-widget-color-text-tertiary-dark: #9ca3af;
3021
+ --deframe-widget-color-text-tertiary-disabled: #c4c9d4;
3022
+ --deframe-widget-color-placeholder-primary: #6b7280;
3023
+ --deframe-widget-color-placeholder-primary-dark: #9ca3af;
3024
+ --deframe-widget-color-placeholder-primary-disabled: #c4c9d4;
3025
+ --deframe-widget-color-placeholder-secondary: #9ca3af;
3026
+ --deframe-widget-color-placeholder-secondary-dark: #c4c9d4;
3027
+ --deframe-widget-color-placeholder-secondary-disabled: #d7deea;
3028
+ --deframe-widget-color-placeholder-tertiary: #c4c9d4;
3029
+ --deframe-widget-color-placeholder-tertiary-dark: #d7deea;
3030
+ --deframe-widget-color-placeholder-tertiary-disabled: #edf2f8;
3031
+ --deframe-widget-color-border-primary: rgba(17, 24, 39, 0.32);
3032
+ --deframe-widget-color-border-primary-dark: rgba(255, 255, 255, 0.22);
3033
+ --deframe-widget-color-border-primary-disabled: rgba(17, 24, 39, 0.18);
3034
+ --deframe-widget-color-border-secondary: rgba(17, 24, 39, 0.18);
3035
+ --deframe-widget-color-border-secondary-dark: rgba(255, 255, 255, 0.16);
3036
+ --deframe-widget-color-border-secondary-disabled: rgba(17, 24, 39, 0.12);
3037
+ --deframe-widget-color-border-tertiary: rgba(17, 24, 39, 0.08);
3038
+ --deframe-widget-color-border-tertiary-dark: rgba(255, 255, 255, 0.1);
3039
+ --deframe-widget-color-border-tertiary-disabled: rgba(17, 24, 39, 0.06);
3040
+ --deframe-widget-color-brand-primary: #0891b2;
3041
+ --deframe-widget-color-brand-primary-dark: #22d3ee;
3042
+ --deframe-widget-color-brand-primary-disabled: rgba(8, 145, 178, 0.2);
3043
+ --deframe-widget-color-brand-secondary: #67e8f9;
3044
+ --deframe-widget-color-brand-secondary-dark: #a5f3fc;
3045
+ --deframe-widget-color-brand-secondary-disabled: #7dd3fc;
3046
+ --deframe-widget-color-brand-tertiary: #164e63;
3047
+ --deframe-widget-color-brand-tertiary-dark: #a5f3fc;
3048
+ --deframe-widget-color-brand-tertiary-disabled: #67e8f9;
3049
+ --deframe-widget-color-state-success: #14b8a6;
3050
+ --deframe-widget-color-state-warning: #f59e0b;
3051
+ --deframe-widget-color-state-error: #ef4444;
3052
+ --deframe-widget-color-state-info: #38bdf8;
3053
+ }
3054
+ .deframe-widget.widget-theme--weird, .deframe-widget.weird {
3055
+ --deframe-widget-font-family: "Bricolage Grotesque", "Trebuchet MS", sans-serif;
3056
+ --deframe-widget-font-size-xs: 0.75rem;
3057
+ --deframe-widget-font-size-sm: 0.875rem;
3058
+ --deframe-widget-font-size-md: 0.9375rem;
3059
+ --deframe-widget-font-size-lg: 1rem;
3060
+ --deframe-widget-font-size-xl: 1.0625rem;
3061
+ --deframe-widget-font-size-xxl: 1.25rem;
3062
+ --deframe-widget-size-gap-xs: 0.25rem;
3063
+ --deframe-widget-size-gap-sm: 0.875rem;
3064
+ --deframe-widget-size-gap-md: 0.625rem;
3065
+ --deframe-widget-size-gap-lg: 1.375rem;
3066
+ --deframe-widget-size-gap-xl: 1.875rem;
3067
+ --deframe-widget-size-radius-xs: 0.125rem;
3068
+ --deframe-widget-size-radius-sm: 1.25rem;
3069
+ --deframe-widget-size-radius-md: 0.375rem;
3070
+ --deframe-widget-size-radius-lg: 2.5rem;
3071
+ --deframe-widget-size-radius-xl: 3rem;
3072
+ --deframe-widget-color-bg-primary: #0d0019;
3073
+ --deframe-widget-color-bg-primary-dark: #0d0019;
3074
+ --deframe-widget-color-bg-primary-disabled: #2a1b38;
3075
+ --deframe-widget-color-bg-secondary: #21013d;
3076
+ --deframe-widget-color-bg-secondary-dark: #21013d;
3077
+ --deframe-widget-color-bg-secondary-disabled: #3c2750;
3078
+ --deframe-widget-color-bg-tertiary: #3a0e64;
3079
+ --deframe-widget-color-bg-tertiary-dark: #3a0e64;
3080
+ --deframe-widget-color-bg-tertiary-disabled: #5a3b78;
3081
+ --deframe-widget-color-text-primary: #f7ff5c;
3082
+ --deframe-widget-color-text-primary-dark: #f7ff5c;
3083
+ --deframe-widget-color-text-primary-disabled: rgba(247, 255, 92, 0.4);
3084
+ --deframe-widget-color-text-secondary: #7fffd4;
3085
+ --deframe-widget-color-text-secondary-dark: #7fffd4;
3086
+ --deframe-widget-color-text-secondary-disabled: rgba(127, 255, 212, 0.4);
3087
+ --deframe-widget-color-text-tertiary: #ff9cf7;
3088
+ --deframe-widget-color-text-tertiary-dark: #ff9cf7;
3089
+ --deframe-widget-color-text-tertiary-disabled: rgba(255, 156, 247, 0.4);
3090
+ --deframe-widget-color-placeholder-primary: #b0ffef;
3091
+ --deframe-widget-color-placeholder-primary-dark: #b0ffef;
3092
+ --deframe-widget-color-placeholder-primary-disabled: #7d6ca6;
3093
+ --deframe-widget-color-placeholder-secondary: #ffb7fa;
3094
+ --deframe-widget-color-placeholder-secondary-dark: #ffb7fa;
3095
+ --deframe-widget-color-placeholder-secondary-disabled: #7d6ca6;
3096
+ --deframe-widget-color-placeholder-tertiary: #7d6ca6;
3097
+ --deframe-widget-color-placeholder-tertiary-dark: #7d6ca6;
3098
+ --deframe-widget-color-placeholder-tertiary-disabled: #5f4f7f;
3099
+ --deframe-widget-color-border-primary: rgba(255, 136, 77, 0.46);
3100
+ --deframe-widget-color-border-primary-dark: rgba(19, 2, 33, 0.2);
3101
+ --deframe-widget-color-border-primary-disabled: rgba(255, 136, 77, 0.2);
3102
+ --deframe-widget-color-border-secondary: rgba(127, 255, 212, 0.28);
3103
+ --deframe-widget-color-border-secondary-dark: rgba(247, 255, 92, 0.22);
3104
+ --deframe-widget-color-border-secondary-disabled: rgba(127, 255, 212, 0.14);
3105
+ --deframe-widget-color-border-tertiary: rgba(247, 255, 92, 0.16);
3106
+ --deframe-widget-color-border-tertiary-dark: rgba(247, 255, 92, 0.12);
3107
+ --deframe-widget-color-border-tertiary-disabled: rgba(247, 255, 92, 0.08);
3108
+ --deframe-widget-color-brand-primary: #ff4fc4;
3109
+ --deframe-widget-color-brand-primary-dark: #ff4fc4;
3110
+ --deframe-widget-color-brand-primary-disabled: rgba(255, 79, 196, 0.2);
3111
+ --deframe-widget-color-brand-secondary: #7fffd4;
3112
+ --deframe-widget-color-brand-secondary-dark: #7fffd4;
3113
+ --deframe-widget-color-brand-secondary-disabled: rgba(127, 255, 212, 0.2);
3114
+ --deframe-widget-color-brand-tertiary: #f7ff5c;
3115
+ --deframe-widget-color-brand-tertiary-dark: #f7ff5c;
3116
+ --deframe-widget-color-brand-tertiary-disabled: rgba(247, 255, 92, 0.2);
3117
+ --deframe-widget-color-state-success: #00ffa3;
3118
+ --deframe-widget-color-state-warning: #ffb800;
3119
+ --deframe-widget-color-state-error: #ff5b7f;
3120
+ --deframe-widget-color-state-info: #7ab8ff;
3121
+ }
3122
+ .deframe-widget.widget-theme--cryptocontrol, .deframe-widget.cryptocontrol {
3123
+ --deframe-widget-font-family: Satoshi, Inter, sans-serif;
3124
+ --deframe-widget-font-size-md: 14px;
3125
+ --deframe-widget-font-size-lg: 17px;
3126
+ --deframe-widget-font-size-xl: 20px;
3127
+ --deframe-widget-font-size-xxl: 24px;
3128
+ --deframe-widget-size-gap-sm: 0.625rem;
3129
+ --deframe-widget-size-gap-md: 0.875rem;
3130
+ --deframe-widget-size-gap-lg: 1.125rem;
3131
+ --deframe-widget-size-gap-xl: 1.5rem;
3132
+ --deframe-widget-size-radius-xs: 4px;
3133
+ --deframe-widget-size-radius-sm: 8px;
3134
+ --deframe-widget-size-radius-md: 12px;
3135
+ --deframe-widget-size-radius-lg: 20px;
3136
+ --deframe-widget-size-radius-xl: 24px;
3137
+ --deframe-widget-color-text: #ffffff;
3138
+ --deframe-widget-color-text-dark: #ffffff;
3139
+ --deframe-widget-color-text-disabled: #c6c8cc;
3140
+ --deframe-widget-color-text-primary: #ffffff;
3141
+ --deframe-widget-color-text-primary-dark: #ffffff;
3142
+ --deframe-widget-color-text-primary-disabled: #525866;
3143
+ --deframe-widget-color-text-secondary: #99a0ae;
3144
+ --deframe-widget-color-text-secondary-dark: #99a0ae;
3145
+ --deframe-widget-color-text-secondary-disabled: #525866;
3146
+ --deframe-widget-color-text-tertiary: #525866;
3147
+ --deframe-widget-color-text-tertiary-dark: #525866;
3148
+ --deframe-widget-color-text-tertiary-disabled: #525866;
3149
+ --deframe-widget-color-text-inverse: #252050;
3150
+ --deframe-widget-color-text-inverse-dark: #252050;
3151
+ --deframe-widget-color-text-inverse-disabled: #FFFFFF;
3152
+ --deframe-widget-color-text-highlight: #2BA176;
3153
+ --deframe-widget-color-text-highlight-dark: #2BA176;
3154
+ --deframe-widget-color-text-highlight-disabled: #2BA176;
3155
+ --deframe-widget-color-placeholder-primary: #99a0ae;
3156
+ --deframe-widget-color-placeholder-primary-dark: #99a0ae;
3157
+ --deframe-widget-color-placeholder-primary-disabled: #525866;
3158
+ --deframe-widget-color-placeholder-secondary: #525866;
3159
+ --deframe-widget-color-placeholder-secondary-dark: #525866;
3160
+ --deframe-widget-color-placeholder-secondary-disabled: #525866;
3161
+ --deframe-widget-color-placeholder-tertiary: #525866;
3162
+ --deframe-widget-color-placeholder-tertiary-dark: #525866;
3163
+ --deframe-widget-color-placeholder-tertiary-disabled: #525866;
3164
+ --deframe-widget-color-brand-primary: #1fc16b;
3165
+ --deframe-widget-color-brand-primary-dark: #1fc16b;
3166
+ --deframe-widget-color-brand-primary-disabled: rgba(31, 193, 107, 0.10);
3167
+ --deframe-widget-color-brand-secondary: #a9abf7;
3168
+ --deframe-widget-color-brand-secondary-dark: #a9abf7;
3169
+ --deframe-widget-color-brand-secondary-disabled: #525866;
3170
+ --deframe-widget-color-brand-tertiary: #1fc16b;
3171
+ --deframe-widget-color-brand-tertiary-dark: #1fc16b;
3172
+ --deframe-widget-color-brand-tertiary-disabled: #525866;
3173
+ --deframe-widget-color-brand-tint: #EEF0FF;
3174
+ --deframe-widget-color-brand-tint-dark: #EEF0FF;
3175
+ --deframe-widget-color-brand-tint-disabled: #525866;
3176
+ --deframe-widget-color-bg-primary: #11141b;
3177
+ --deframe-widget-color-bg-primary-dark: #11141b;
3178
+ --deframe-widget-color-bg-primary-disabled: #181b25;
3179
+ --deframe-widget-color-bg-secondary: #181b25;
3180
+ --deframe-widget-color-bg-secondary-dark: #181b25;
3181
+ --deframe-widget-color-bg-secondary-disabled: #222530;
3182
+ --deframe-widget-color-bg-tertiary: #222530;
3183
+ --deframe-widget-color-bg-tertiary-dark: #222530;
3184
+ --deframe-widget-color-bg-tertiary-disabled: #181b25;
3185
+ --deframe-widget-color-bg-raised: #FFFFFF;
3186
+ --deframe-widget-color-bg-raised-dark: #FFFFFF;
3187
+ --deframe-widget-color-bg-raised-disabled: #FFFFFF;
3188
+ --deframe-widget-color-bg-inverse: #252050;
3189
+ --deframe-widget-color-bg-inverse-dark: #252050;
3190
+ --deframe-widget-color-bg-inverse-disabled: #252050;
3191
+ --deframe-widget-color-border-primary: #1FC16B66;
3192
+ --deframe-widget-color-border-primary-dark: #1FC16B66;
3193
+ --deframe-widget-color-border-primary-disabled: #1FC16B2E;
3194
+ --deframe-widget-color-border-secondary: #FFFFFF12;
3195
+ --deframe-widget-color-border-secondary-dark: #FFFFFF12;
3196
+ --deframe-widget-color-border-secondary-disabled: #FFFFFF0D;
3197
+ --deframe-widget-color-border-tertiary: #FFFFFF0D;
3198
+ --deframe-widget-color-border-tertiary-dark: #FFFFFF0D;
3199
+ --deframe-widget-color-border-tertiary-disabled: #FFFFFF08;
3200
+ --deframe-widget-color-state-success: #1fc16b;
3201
+ --deframe-widget-color-state-warning: #f6a700;
3202
+ --deframe-widget-color-state-error: #ff4d4f;
3203
+ --deframe-widget-color-state-info: #58b4ff;
3204
+ overscroll-behavior: none;
3205
+ }
2757
3206
  :root {
2758
3207
  --deframe-widget-font-family: 'Satoshi', Inter, sans-serif;
2759
3208
  --deframe-widget-font-size-xs: 11px;
@@ -2968,6 +3417,21 @@
2968
3417
  inherits: false;
2969
3418
  initial-value: 0;
2970
3419
  }
3420
+ @property --tw-scale-x {
3421
+ syntax: "*";
3422
+ inherits: false;
3423
+ initial-value: 1;
3424
+ }
3425
+ @property --tw-scale-y {
3426
+ syntax: "*";
3427
+ inherits: false;
3428
+ initial-value: 1;
3429
+ }
3430
+ @property --tw-scale-z {
3431
+ syntax: "*";
3432
+ inherits: false;
3433
+ initial-value: 1;
3434
+ }
2971
3435
  @property --tw-rotate-x {
2972
3436
  syntax: "*";
2973
3437
  inherits: false;
@@ -3250,6 +3714,9 @@
3250
3714
  --tw-translate-x: 0;
3251
3715
  --tw-translate-y: 0;
3252
3716
  --tw-translate-z: 0;
3717
+ --tw-scale-x: 1;
3718
+ --tw-scale-y: 1;
3719
+ --tw-scale-z: 1;
3253
3720
  --tw-rotate-x: initial;
3254
3721
  --tw-rotate-y: initial;
3255
3722
  --tw-rotate-z: initial;