@fileverse/ui 5.4.0-unstable-styles-2 → 5.4.1

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/base.css CHANGED
@@ -402,6 +402,88 @@
402
402
  --color-utility-overlay: 0, 0%, 0%, 0.72; /* Black 72% */
403
403
  }
404
404
 
405
+ .theme-palm {
406
+ /* Palm (TEC-3020): Sepia is the base; only the paper/ink family changes,
407
+ taken from the sunlit-editor prototype (paper #EFE5C8, ink #3D3626). */
408
+
409
+ /* Button */
410
+ --color-button-default: 43, 24%, 15%, 1; /* #2F2A1D */
411
+ --color-button-default-hover: 42, 23%, 19%, 1; /* #3D3626 */
412
+ --color-button-secondary: 45, 55%, 86%, 1; /* #EFE5C8 */
413
+ --color-button-secondary-hover: 42, 23%, 19%, 0.06; /* #3D3626 6% */
414
+ --color-button-disabled: 42, 23%, 19%, 0.04; /* #3D3626 4% */
415
+ --color-button-danger: 0, 71%, 38%, 1; /* #A61C1C */
416
+ --color-button-danger-hover: 0, 71%, 42%, 1; /* #B71F1F */
417
+ --color-button-floating: 45, 55%, 86%, 1; /* #EFE5C8 */
418
+ --color-button-floating-hover: 42, 23%, 19%, 0.06; /* #3D3626 6% */
419
+
420
+ /* Text */
421
+ --color-text-default: 42, 23%, 19%, 1; /* #3D3626 */
422
+ --color-text-secondary: 46, 16%, 46%, 1; /* #8A8163 */
423
+ --color-text-disabled: 43, 14%, 56%, 1; /* #9F967F */
424
+ --color-text-danger: 0, 71%, 38%, 1; /* #A61C1C */
425
+ --color-text-success: 77, 23%, 35%, 1; /* #616C44 */
426
+ --color-text-inverse: 45, 55%, 86%, 1; /* #EFE5C8 */
427
+ --color-text-link: 199, 100%, 29%, 1; /* #006494 */
428
+ --color-text-on-brand: 42, 23%, 19%, 1; /* #3D3626 */
429
+
430
+ /* Background */
431
+ --color-bg-default: 45, 55%, 86%, 1; /* #EFE5C8 */
432
+ --color-bg-default-hover: 42, 23%, 19%, 0.08; /* #3D3626 8% */
433
+ --color-bg-default-active: 46, 88%, 56%, 1; /* #F2C42D */
434
+ --color-bg-default-selected: 42, 23%, 19%, 0.1; /* #3D3626 10% */
435
+ --color-bg-secondary: 44, 48%, 82%, 1; /* #E7DBBA */
436
+ --color-bg-secondary-hover: 42, 23%, 19%, 0.12; /* #3D3626 12% */
437
+ --color-bg-disabled: 42, 23%, 19%, 0.04; /* #3D3626 4% */
438
+ --color-bg-brand: 46, 88%, 56%, 1; /* #F2C42D */
439
+ --color-bg-brand-hover: 40, 84%, 50%, 1; /* #EBA515 */
440
+ --color-bg-brand-light: 47, 87%, 88%, 1; /* #FBEFC5 */
441
+ --color-bg-danger: 0, 71%, 38%, 1; /* #A61C1C */
442
+ --color-bg-danger-light: 0, 71%, 42%, 0.06; /* #B71F1F 6% */
443
+ --color-bg-default-inverse: 42, 23%, 19%, 1; /* #3D3626 */
444
+ --color-bg-tertiary: 44, 40%, 82%, 1; /* #E3D9BD */
445
+ --color-bg-success: 77, 23%, 35%, 1; /* #616C44 */
446
+ --color-bg-success-light: 76, 23%, 64%, 1; /* #ADB88E */
447
+ --color-bg-info-light: 199, 45%, 87%, 1;
448
+
449
+ /* Border */
450
+ --color-border-default: 44, 31%, 77%, 1; /* #D6CCB1 */
451
+ --color-border-hover: 45, 22%, 69%, 1; /* #C1B89E */
452
+ --color-border-light: 45, 55%, 86%, 1; /* #EFE5C8 */
453
+ --color-border-active: 42, 23%, 19%, 1; /* #3D3626 */
454
+ --color-border-focused: 199, 100%, 29%, 1; /* #006494 */
455
+ --color-border-danger: 0, 71%, 38%, 1; /* #A61C1C */
456
+ --color-border-warning: 12, 85%, 60%, 1; /* #F06543 */
457
+ --color-border-success: 77, 23%, 35%, 1; /* #616C44 */
458
+ --color-border-info: 199, 100%, 29%, 1; /* #006494 */
459
+ --color-border-disabled: 43, 14%, 56%, 1; /* #9F967F */
460
+
461
+ /* Icon */
462
+ --color-icon-default: 42, 23%, 19%, 1; /* #3D3626 */
463
+ --color-icon-default-hover: 43, 19%, 26%, 1; /* #4F4836 */
464
+ --color-icon-brand: 46, 88%, 56%, 1; /* #F2C42D */
465
+ --color-icon-secondary: 46, 16%, 46%, 1; /* #8A8163 */
466
+ --color-icon-disabled: 43, 14%, 56%, 1; /* #9F967F */
467
+ --color-icon-inverse: 45, 55%, 86%, 1; /* #EFE5C8 */
468
+ --color-icon-danger: 0, 71%, 38%, 1; /* #A61C1C */
469
+ --color-icon-warning: 12, 85%, 60%, 1; /* #F06543 */
470
+ --color-icon-info: 199, 100%, 29%, 1; /* #006494 */
471
+ --color-icon-success: 77, 23%, 35%, 1; /* #616C44 */
472
+ --color-icon-on-brand: 42, 23%, 19%, 1; /* #3D3626 */
473
+
474
+ /* Tooltip */
475
+ --color-bg-tooltip: 42, 23%, 19%, 1; /* #3D3626 */
476
+ --color-text-tooltip: 45, 55%, 86%, 1; /* #EFE5C8 */
477
+
478
+ /* Inline Comment */
479
+ --color-inline-comment: 76, 23%, 72%, 1; /* #BFC8A7 */
480
+ --color-inline-comment-active: 75, 23%, 62%, 1; /* #A9B488 */
481
+
482
+ /* Utility */
483
+ --color-bg-transparent: 42, 23%, 19%, 0.04; /* #3D3626 4% */
484
+ --color-utility-overlay: 0, 0%, 0%, 0.72; /* Black 72% */
485
+ }
486
+
405
487
  *,
406
488
  ::before,
407
489
  ::after {
package/dist/index.css CHANGED
@@ -1019,6 +1019,9 @@ video {
1019
1019
  .top-4 {
1020
1020
  top: 1rem;
1021
1021
  }
1022
+ .top-\[-41px\] {
1023
+ top: -41px;
1024
+ }
1022
1025
  .top-\[4rem\] {
1023
1026
  top: 4rem;
1024
1027
  }
@@ -1240,6 +1243,9 @@ video {
1240
1243
  .h-\[68px\] {
1241
1244
  height: 68px;
1242
1245
  }
1246
+ .h-\[71px\] {
1247
+ height: 71px;
1248
+ }
1243
1249
  .h-\[85vh\] {
1244
1250
  height: 85vh;
1245
1251
  }
@@ -1440,6 +1446,9 @@ video {
1440
1446
  .w-\[48px\] {
1441
1447
  width: 48px;
1442
1448
  }
1449
+ .w-\[51px\] {
1450
+ width: 51px;
1451
+ }
1443
1452
  .w-\[564px\] {
1444
1453
  width: 564px;
1445
1454
  }
@@ -3775,6 +3784,88 @@ video {
3775
3784
  --color-utility-overlay: 0, 0%, 0%, 0.72; /* Black 72% */
3776
3785
  }
3777
3786
 
3787
+ .theme-palm {
3788
+ /* Palm (TEC-3020): Sepia is the base; only the paper/ink family changes,
3789
+ taken from the sunlit-editor prototype (paper #EFE5C8, ink #3D3626). */
3790
+
3791
+ /* Button */
3792
+ --color-button-default: 43, 24%, 15%, 1; /* #2F2A1D */
3793
+ --color-button-default-hover: 42, 23%, 19%, 1; /* #3D3626 */
3794
+ --color-button-secondary: 45, 55%, 86%, 1; /* #EFE5C8 */
3795
+ --color-button-secondary-hover: 42, 23%, 19%, 0.06; /* #3D3626 6% */
3796
+ --color-button-disabled: 42, 23%, 19%, 0.04; /* #3D3626 4% */
3797
+ --color-button-danger: 0, 71%, 38%, 1; /* #A61C1C */
3798
+ --color-button-danger-hover: 0, 71%, 42%, 1; /* #B71F1F */
3799
+ --color-button-floating: 45, 55%, 86%, 1; /* #EFE5C8 */
3800
+ --color-button-floating-hover: 42, 23%, 19%, 0.06; /* #3D3626 6% */
3801
+
3802
+ /* Text */
3803
+ --color-text-default: 42, 23%, 19%, 1; /* #3D3626 */
3804
+ --color-text-secondary: 46, 16%, 46%, 1; /* #8A8163 */
3805
+ --color-text-disabled: 43, 14%, 56%, 1; /* #9F967F */
3806
+ --color-text-danger: 0, 71%, 38%, 1; /* #A61C1C */
3807
+ --color-text-success: 77, 23%, 35%, 1; /* #616C44 */
3808
+ --color-text-inverse: 45, 55%, 86%, 1; /* #EFE5C8 */
3809
+ --color-text-link: 199, 100%, 29%, 1; /* #006494 */
3810
+ --color-text-on-brand: 42, 23%, 19%, 1; /* #3D3626 */
3811
+
3812
+ /* Background */
3813
+ --color-bg-default: 45, 55%, 86%, 1; /* #EFE5C8 */
3814
+ --color-bg-default-hover: 42, 23%, 19%, 0.08; /* #3D3626 8% */
3815
+ --color-bg-default-active: 46, 88%, 56%, 1; /* #F2C42D */
3816
+ --color-bg-default-selected: 42, 23%, 19%, 0.1; /* #3D3626 10% */
3817
+ --color-bg-secondary: 44, 48%, 82%, 1; /* #E7DBBA */
3818
+ --color-bg-secondary-hover: 42, 23%, 19%, 0.12; /* #3D3626 12% */
3819
+ --color-bg-disabled: 42, 23%, 19%, 0.04; /* #3D3626 4% */
3820
+ --color-bg-brand: 46, 88%, 56%, 1; /* #F2C42D */
3821
+ --color-bg-brand-hover: 40, 84%, 50%, 1; /* #EBA515 */
3822
+ --color-bg-brand-light: 47, 87%, 88%, 1; /* #FBEFC5 */
3823
+ --color-bg-danger: 0, 71%, 38%, 1; /* #A61C1C */
3824
+ --color-bg-danger-light: 0, 71%, 42%, 0.06; /* #B71F1F 6% */
3825
+ --color-bg-default-inverse: 42, 23%, 19%, 1; /* #3D3626 */
3826
+ --color-bg-tertiary: 44, 40%, 82%, 1; /* #E3D9BD */
3827
+ --color-bg-success: 77, 23%, 35%, 1; /* #616C44 */
3828
+ --color-bg-success-light: 76, 23%, 64%, 1; /* #ADB88E */
3829
+ --color-bg-info-light: 199, 45%, 87%, 1;
3830
+
3831
+ /* Border */
3832
+ --color-border-default: 44, 31%, 77%, 1; /* #D6CCB1 */
3833
+ --color-border-hover: 45, 22%, 69%, 1; /* #C1B89E */
3834
+ --color-border-light: 45, 55%, 86%, 1; /* #EFE5C8 */
3835
+ --color-border-active: 42, 23%, 19%, 1; /* #3D3626 */
3836
+ --color-border-focused: 199, 100%, 29%, 1; /* #006494 */
3837
+ --color-border-danger: 0, 71%, 38%, 1; /* #A61C1C */
3838
+ --color-border-warning: 12, 85%, 60%, 1; /* #F06543 */
3839
+ --color-border-success: 77, 23%, 35%, 1; /* #616C44 */
3840
+ --color-border-info: 199, 100%, 29%, 1; /* #006494 */
3841
+ --color-border-disabled: 43, 14%, 56%, 1; /* #9F967F */
3842
+
3843
+ /* Icon */
3844
+ --color-icon-default: 42, 23%, 19%, 1; /* #3D3626 */
3845
+ --color-icon-default-hover: 43, 19%, 26%, 1; /* #4F4836 */
3846
+ --color-icon-brand: 46, 88%, 56%, 1; /* #F2C42D */
3847
+ --color-icon-secondary: 46, 16%, 46%, 1; /* #8A8163 */
3848
+ --color-icon-disabled: 43, 14%, 56%, 1; /* #9F967F */
3849
+ --color-icon-inverse: 45, 55%, 86%, 1; /* #EFE5C8 */
3850
+ --color-icon-danger: 0, 71%, 38%, 1; /* #A61C1C */
3851
+ --color-icon-warning: 12, 85%, 60%, 1; /* #F06543 */
3852
+ --color-icon-info: 199, 100%, 29%, 1; /* #006494 */
3853
+ --color-icon-success: 77, 23%, 35%, 1; /* #616C44 */
3854
+ --color-icon-on-brand: 42, 23%, 19%, 1; /* #3D3626 */
3855
+
3856
+ /* Tooltip */
3857
+ --color-bg-tooltip: 42, 23%, 19%, 1; /* #3D3626 */
3858
+ --color-text-tooltip: 45, 55%, 86%, 1; /* #EFE5C8 */
3859
+
3860
+ /* Inline Comment */
3861
+ --color-inline-comment: 76, 23%, 72%, 1; /* #BFC8A7 */
3862
+ --color-inline-comment-active: 75, 23%, 62%, 1; /* #A9B488 */
3863
+
3864
+ /* Utility */
3865
+ --color-bg-transparent: 42, 23%, 19%, 0.04; /* #3D3626 4% */
3866
+ --color-utility-overlay: 0, 0%, 0%, 0.72; /* Black 72% */
3867
+ }
3868
+
3778
3869
  *,
3779
3870
  ::before,
3780
3871
  ::after {
@@ -1204,7 +1204,7 @@ export declare interface TextFieldProps extends React_2.InputHTMLAttributes<HTML
1204
1204
  icon?: LucideIconProps["name"];
1205
1205
  }
1206
1206
 
1207
- declare type Theme = "light" | "dark" | "theme-sepia" | "theme-pink" | "theme-green";
1207
+ declare type Theme = "light" | "dark" | "theme-sepia" | "theme-pink" | "theme-green" | "theme-palm";
1208
1208
 
1209
1209
  export declare const ThemeProvider: ({ children, defaultTheme, }: ThemeProviderProps) => JSX_2.Element;
1210
1210