moon-inferno 0.3.5 → 0.3.7

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.
Files changed (3) hide show
  1. package/dist/index.css +308 -15
  2. package/dist/styles.css +308 -15
  3. package/package.json +5 -5
package/dist/index.css CHANGED
@@ -44,7 +44,8 @@
44
44
  }
45
45
  .mi-button--inferno {
46
46
  background-color: var(--mi-color-primary, #FF4D00);
47
- color: var(--mi-color-primary-text, #FFFFFF);
47
+ color: var(--mi-color-primary-text, #050406);
48
+ font-weight: 700;
48
49
  border-color: var(--mi-color-primary, #FF4D00);
49
50
  }
50
51
  .mi-button--inferno:hover:not(:disabled) {
@@ -809,18 +810,18 @@
809
810
  }
810
811
  .mi-badge--inferno {
811
812
  background-color: rgba(255, 77, 0, 0.15);
812
- color: var(--mi-color-primary, #FF4D00);
813
- border: 1px solid var(--mi-color-primary, #FF4D00);
813
+ color: #FF8533;
814
+ border: 1px solid #FF661A;
814
815
  }
815
816
  .mi-badge--pixel {
816
817
  background-color: var(--mi-color-bg-subtle, #14121A);
817
- color: var(--mi-color-primary, #FF4D00);
818
+ color: #FF8533;
818
819
  border: none;
819
820
  box-shadow:
820
- 0 -2px 0 0 var(--mi-color-primary, #FF4D00),
821
- 0 2px 0 0 var(--mi-color-primary, #FF4D00),
822
- -2px 0 0 0 var(--mi-color-primary, #FF4D00),
823
- 2px 0 0 0 var(--mi-color-primary, #FF4D00);
821
+ 0 -2px 0 0 #FF8533,
822
+ 0 2px 0 0 #FF8533,
823
+ -2px 0 0 0 #FF8533,
824
+ 2px 0 0 0 #FF8533;
824
825
  margin: 2px;
825
826
  }
826
827
  .mi-badge--success {
@@ -830,8 +831,8 @@
830
831
  }
831
832
  .mi-badge--error {
832
833
  background-color: rgba(255, 0, 51, 0.15);
833
- color: var(--mi-color-error, #FF0033);
834
- border: 1px solid var(--mi-color-error, #FF0033);
834
+ color: #FF6680;
835
+ border: 1px solid #FF3355;
835
836
  }
836
837
  .mi-badge--outline {
837
838
  background-color: transparent;
@@ -2190,7 +2191,7 @@
2190
2191
  display: inline-block;
2191
2192
  }
2192
2193
  .mi-neon-text--inferno {
2193
- color: #FF4D00;
2194
+ color: #FF8533;
2194
2195
  text-shadow:
2195
2196
  0 0 5px #FF4D00,
2196
2197
  0 0 10px #FF4D00,
@@ -2214,7 +2215,7 @@
2214
2215
  0 0 40px #00CC52;
2215
2216
  }
2216
2217
  .mi-neon-text--magenta {
2217
- color: #FF00E5;
2218
+ color: #FF66EB;
2218
2219
  text-shadow:
2219
2220
  0 0 5px #FF00E5,
2220
2221
  0 0 10px #FF00E5,
@@ -3067,12 +3068,20 @@
3067
3068
  align-items: center;
3068
3069
  }
3069
3070
  .mi-rpggrid-grid {
3070
- display: grid;
3071
+ display: flex;
3072
+ flex-direction: column;
3073
+ gap: 0.5rem;
3074
+ width: 100%;
3075
+ }
3076
+ .mi-rpggrid-row {
3077
+ display: flex;
3071
3078
  gap: 0.5rem;
3079
+ width: 100%;
3072
3080
  }
3073
3081
  .mi-rpggrid-slot {
3074
3082
  width: 52px;
3075
3083
  height: 52px;
3084
+ flex-shrink: 0;
3076
3085
  background-color: #0A090D;
3077
3086
  border: 1px solid var(--mi-color-border, #332D40);
3078
3087
  border-radius: var(--mi-radius-sm, 4px);
@@ -3537,6 +3546,290 @@
3537
3546
  cursor: not-allowed;
3538
3547
  }
3539
3548
 
3549
+ /* ../themes/src/moon-inferno.css */
3550
+ :root,
3551
+ [data-theme=moon-inferno] {
3552
+ --mi-color-bg: #0A090D;
3553
+ --mi-color-bg-subtle: #14121A;
3554
+ --mi-color-surface: #1E1B26;
3555
+ --mi-color-border: #332D40;
3556
+ --mi-color-border-accent: #FF4D00;
3557
+ --mi-color-primary: #FF4D00;
3558
+ --mi-color-primary-hover: #FF661A;
3559
+ --mi-color-primary-active: #FF2E00;
3560
+ --mi-color-primary-text: #050406;
3561
+ --mi-color-text: #F1F5F9;
3562
+ --mi-color-text-muted: #94A3B8;
3563
+ --mi-color-text-dim: #64748B;
3564
+ --mi-color-focus-ring: #FF4D00;
3565
+ --mi-shadow-glow: 0 0 16px rgba(255, 77, 0, 0.45);
3566
+ --mi-shadow-pixel: 3px 3px 0px #000000;
3567
+ --mi-crt-scanline: rgba(255, 77, 0, 0.05);
3568
+ --mi-font-mono:
3569
+ "JetBrains Mono",
3570
+ "Courier New",
3571
+ monospace;
3572
+ --mi-font-sans:
3573
+ system-ui,
3574
+ -apple-system,
3575
+ BlinkMacSystemFont,
3576
+ "Segoe UI",
3577
+ Roboto,
3578
+ sans-serif;
3579
+ --mi-font-pixel:
3580
+ "Press Start 2P",
3581
+ "Courier New",
3582
+ monospace;
3583
+ --mi-radius-sm: 2px;
3584
+ --mi-radius-base: 4px;
3585
+ --mi-radius-md: 8px;
3586
+ --mi-radius-full: 9999px;
3587
+ }
3588
+ ::-webkit-scrollbar {
3589
+ width: 8px;
3590
+ height: 8px;
3591
+ }
3592
+ ::-webkit-scrollbar-track {
3593
+ background: var(--mi-color-bg-subtle, #14121A);
3594
+ border: 1px solid var(--mi-color-border, #332D40);
3595
+ }
3596
+ ::-webkit-scrollbar-thumb {
3597
+ background: var(--mi-color-primary, #FF4D00);
3598
+ border-radius: 2px;
3599
+ box-shadow: 0 0 8px rgba(255, 77, 0, 0.4);
3600
+ }
3601
+ ::-webkit-scrollbar-thumb:hover {
3602
+ background: var(--mi-color-primary-hover, #FF661A);
3603
+ }
3604
+
3605
+ /* ../themes/src/terminal.css */
3606
+ [data-theme=terminal] {
3607
+ --mi-color-bg: #05130A;
3608
+ --mi-color-bg-subtle: #0B2213;
3609
+ --mi-color-surface: #10331C;
3610
+ --mi-color-border: #1A542E;
3611
+ --mi-color-border-accent: #00FF66;
3612
+ --mi-color-primary: #00FF66;
3613
+ --mi-color-primary-hover: #33FF85;
3614
+ --mi-color-primary-active: #00CC52;
3615
+ --mi-color-primary-text: #05130A;
3616
+ --mi-color-text: #00FF66;
3617
+ --mi-color-text-muted: #66FF99;
3618
+ --mi-color-text-dim: #26994D;
3619
+ --mi-color-focus-ring: #00FF66;
3620
+ --mi-shadow-glow: 0 0 16px rgba(0, 255, 102, 0.45);
3621
+ --mi-shadow-pixel: 3px 3px 0px #000000;
3622
+ --mi-crt-scanline: rgba(0, 255, 102, 0.08);
3623
+ }
3624
+
3625
+ /* ../themes/src/y2k.css */
3626
+ [data-theme=y2k] {
3627
+ --mi-color-bg: #0F0E17;
3628
+ --mi-color-bg-subtle: #1B1A2E;
3629
+ --mi-color-surface: #2A2845;
3630
+ --mi-color-border: #4D4775;
3631
+ --mi-color-border-accent: #00E5FF;
3632
+ --mi-color-primary: #00E5FF;
3633
+ --mi-color-primary-hover: #52EDFF;
3634
+ --mi-color-primary-active: #00B4CC;
3635
+ --mi-color-primary-text: #0F0E17;
3636
+ --mi-color-text: #F8FAFC;
3637
+ --mi-color-text-muted: #CBD5E1;
3638
+ --mi-color-text-dim: #8B85C1;
3639
+ --mi-color-focus-ring: #00E5FF;
3640
+ --mi-shadow-glow: 0 0 16px rgba(0, 229, 255, 0.45);
3641
+ --mi-shadow-pixel: 3px 3px 0px #0F0E17;
3642
+ --mi-crt-scanline: rgba(0, 229, 255, 0.05);
3643
+ }
3644
+
3645
+ /* src/styles/native-html.css */
3646
+ select.mi-select,
3647
+ .mi-select-native {
3648
+ width: 100%;
3649
+ padding: 0.65rem 2.25rem 0.65rem 0.875rem;
3650
+ font-family: var(--mi-font-mono, "JetBrains Mono", monospace);
3651
+ font-size: 0.875rem;
3652
+ background-color: var(--mi-color-surface, #1E1B26);
3653
+ color: var(--mi-color-text, #F1F5F9);
3654
+ border: 1px solid var(--mi-color-border, #332D40);
3655
+ border-radius: var(--mi-radius-base, 4px);
3656
+ outline: none;
3657
+ cursor: pointer;
3658
+ -webkit-appearance: none;
3659
+ -moz-appearance: none;
3660
+ appearance: none;
3661
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23FF4D00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
3662
+ background-repeat: no-repeat;
3663
+ background-position: right 0.75rem center;
3664
+ background-size: 16px;
3665
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
3666
+ min-height: 42px;
3667
+ }
3668
+ select.mi-select:focus,
3669
+ .mi-select-native:focus {
3670
+ border-color: var(--mi-color-focus-ring, #FF4D00);
3671
+ box-shadow: var(--mi-shadow-glow, 0 0 16px rgba(255, 77, 0, 0.45));
3672
+ }
3673
+ select.mi-select option,
3674
+ .mi-select-native option {
3675
+ background-color: var(--mi-color-surface, #1E1B26);
3676
+ color: var(--mi-color-text, #F1F5F9);
3677
+ padding: 0.65rem;
3678
+ }
3679
+ select.mi-select--pixel {
3680
+ border-radius: 0;
3681
+ border-width: 2px;
3682
+ box-shadow: var(--mi-shadow-pixel, 3px 3px 0 #000);
3683
+ }
3684
+ meter.mi-health-meter,
3685
+ meter.mi-healthmeter,
3686
+ .mi-meter-native {
3687
+ -webkit-appearance: none;
3688
+ -moz-appearance: none;
3689
+ appearance: none;
3690
+ width: 100%;
3691
+ height: 18px;
3692
+ background: #0A090D;
3693
+ border: 1px solid var(--mi-color-border, #332D40);
3694
+ border-radius: var(--mi-radius-sm, 4px);
3695
+ overflow: hidden;
3696
+ display: block;
3697
+ box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.8);
3698
+ }
3699
+ meter.mi-health-meter::-webkit-meter-bar,
3700
+ meter.mi-healthmeter::-webkit-meter-bar {
3701
+ background: #0A090D;
3702
+ border-radius: var(--mi-radius-sm, 4px);
3703
+ }
3704
+ meter.mi-health-meter::-webkit-meter-optimum-value,
3705
+ meter.mi-healthmeter::-webkit-meter-optimum-value,
3706
+ meter.mi-health-meter--health::-webkit-meter-optimum-value {
3707
+ background:
3708
+ linear-gradient(
3709
+ 90deg,
3710
+ #CC0029 0%,
3711
+ #FF0033 60%,
3712
+ #FF4D00 100%);
3713
+ box-shadow: 0 0 10px #FF0033;
3714
+ }
3715
+ meter.mi-health-meter--mana::-webkit-meter-optimum-value,
3716
+ meter.mi-healthmeter--mana::-webkit-meter-optimum-value {
3717
+ background:
3718
+ linear-gradient(
3719
+ 90deg,
3720
+ #0055FF 0%,
3721
+ #00AAFF 60%,
3722
+ #00E5FF 100%);
3723
+ box-shadow: 0 0 10px #00E5FF;
3724
+ }
3725
+ meter.mi-health-meter--shield::-webkit-meter-optimum-value,
3726
+ meter.mi-healthmeter--shield::-webkit-meter-optimum-value {
3727
+ background:
3728
+ linear-gradient(
3729
+ 90deg,
3730
+ #7700FF 0%,
3731
+ #AA00FF 60%,
3732
+ #FF00E5 100%);
3733
+ box-shadow: 0 0 10px #FF00E5;
3734
+ }
3735
+ meter.mi-health-meter--energy::-webkit-meter-optimum-value,
3736
+ meter.mi-healthmeter--energy::-webkit-meter-optimum-value {
3737
+ background:
3738
+ linear-gradient(
3739
+ 90deg,
3740
+ #009933 0%,
3741
+ #00FF66 60%,
3742
+ #AAFF00 100%);
3743
+ box-shadow: 0 0 10px #00FF66;
3744
+ }
3745
+ meter.mi-health-meter::-moz-meter-bar,
3746
+ meter.mi-healthmeter::-moz-meter-bar,
3747
+ meter.mi-health-meter--health::-moz-meter-bar {
3748
+ background:
3749
+ linear-gradient(
3750
+ 90deg,
3751
+ #CC0029 0%,
3752
+ #FF0033 60%,
3753
+ #FF4D00 100%);
3754
+ }
3755
+ meter.mi-health-meter--mana::-moz-meter-bar,
3756
+ meter.mi-healthmeter--mana::-moz-meter-bar {
3757
+ background:
3758
+ linear-gradient(
3759
+ 90deg,
3760
+ #0055FF 0%,
3761
+ #00AAFF 60%,
3762
+ #00E5FF 100%);
3763
+ }
3764
+ meter.mi-health-meter--shield::-moz-meter-bar,
3765
+ meter.mi-healthmeter--shield::-moz-meter-bar {
3766
+ background:
3767
+ linear-gradient(
3768
+ 90deg,
3769
+ #7700FF 0%,
3770
+ #AA00FF 60%,
3771
+ #FF00E5 100%);
3772
+ }
3773
+ meter.mi-health-meter--energy::-moz-meter-bar,
3774
+ meter.mi-healthmeter--energy::-moz-meter-bar {
3775
+ background:
3776
+ linear-gradient(
3777
+ 90deg,
3778
+ #009933 0%,
3779
+ #00FF66 60%,
3780
+ #AAFF00 100%);
3781
+ }
3782
+ progress.mi-progress {
3783
+ -webkit-appearance: none;
3784
+ -moz-appearance: none;
3785
+ appearance: none;
3786
+ width: 100%;
3787
+ height: 14px;
3788
+ background-color: var(--mi-color-bg-subtle, #14121A);
3789
+ border: 1px solid var(--mi-color-border, #332D40);
3790
+ border-radius: var(--mi-radius-full, 9999px);
3791
+ overflow: hidden;
3792
+ display: block;
3793
+ }
3794
+ progress.mi-progress::-webkit-progress-bar {
3795
+ background-color: var(--mi-color-bg-subtle, #14121A);
3796
+ }
3797
+ progress.mi-progress::-webkit-progress-value {
3798
+ background:
3799
+ linear-gradient(
3800
+ 90deg,
3801
+ var(--mi-color-primary, #FF4D00),
3802
+ #FF8000);
3803
+ box-shadow: var(--mi-shadow-glow, 0 0 16px rgba(255, 77, 0, 0.45));
3804
+ }
3805
+ progress.mi-progress::-moz-progress-bar {
3806
+ background:
3807
+ linear-gradient(
3808
+ 90deg,
3809
+ var(--mi-color-primary, #FF4D00),
3810
+ #FF8000);
3811
+ }
3812
+ textarea.mi-input,
3813
+ textarea.mi-textarea {
3814
+ width: 100%;
3815
+ min-height: 90px;
3816
+ padding: 0.625rem 0.875rem;
3817
+ font-family: var(--mi-font-mono, monospace);
3818
+ font-size: 0.875rem;
3819
+ background-color: var(--mi-color-bg-subtle, #14121A);
3820
+ color: var(--mi-color-text, #F1F5F9);
3821
+ border: 1px solid var(--mi-color-border, #332D40);
3822
+ border-radius: var(--mi-radius-base, 4px);
3823
+ outline: none;
3824
+ resize: vertical;
3825
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
3826
+ }
3827
+ textarea.mi-input:focus,
3828
+ textarea.mi-textarea:focus {
3829
+ border-color: var(--mi-color-focus-ring, #FF4D00);
3830
+ box-shadow: var(--mi-shadow-glow);
3831
+ }
3832
+
3540
3833
  /* src/styles/scrollbar.css */
3541
3834
  html,
3542
3835
  body {
@@ -3792,7 +4085,7 @@ textarea {
3792
4085
  box-shadow: 0 0 10px rgba(255, 68, 68, 0.4);
3793
4086
  }
3794
4087
  .moon-datepicker__placeholder {
3795
- color: var(--moon-color-text-muted, #707585);
4088
+ color: var(--mi-color-text-muted, #94A3B8);
3796
4089
  }
3797
4090
  .moon-datepicker__value {
3798
4091
  color: var(--moon-color-text, #ffffff);
@@ -3853,7 +4146,7 @@ textarea {
3853
4146
  .moon-datepicker__weekday {
3854
4147
  font-size: 0.75rem;
3855
4148
  font-weight: 700;
3856
- color: var(--moon-color-text-muted, #707585);
4149
+ color: var(--mi-color-text-muted, #94A3B8);
3857
4150
  }
3858
4151
  .moon-datepicker__grid {
3859
4152
  display: grid;
package/dist/styles.css CHANGED
@@ -44,7 +44,8 @@
44
44
  }
45
45
  .mi-button--inferno {
46
46
  background-color: var(--mi-color-primary, #FF4D00);
47
- color: var(--mi-color-primary-text, #FFFFFF);
47
+ color: var(--mi-color-primary-text, #050406);
48
+ font-weight: 700;
48
49
  border-color: var(--mi-color-primary, #FF4D00);
49
50
  }
50
51
  .mi-button--inferno:hover:not(:disabled) {
@@ -809,18 +810,18 @@
809
810
  }
810
811
  .mi-badge--inferno {
811
812
  background-color: rgba(255, 77, 0, 0.15);
812
- color: var(--mi-color-primary, #FF4D00);
813
- border: 1px solid var(--mi-color-primary, #FF4D00);
813
+ color: #FF8533;
814
+ border: 1px solid #FF661A;
814
815
  }
815
816
  .mi-badge--pixel {
816
817
  background-color: var(--mi-color-bg-subtle, #14121A);
817
- color: var(--mi-color-primary, #FF4D00);
818
+ color: #FF8533;
818
819
  border: none;
819
820
  box-shadow:
820
- 0 -2px 0 0 var(--mi-color-primary, #FF4D00),
821
- 0 2px 0 0 var(--mi-color-primary, #FF4D00),
822
- -2px 0 0 0 var(--mi-color-primary, #FF4D00),
823
- 2px 0 0 0 var(--mi-color-primary, #FF4D00);
821
+ 0 -2px 0 0 #FF8533,
822
+ 0 2px 0 0 #FF8533,
823
+ -2px 0 0 0 #FF8533,
824
+ 2px 0 0 0 #FF8533;
824
825
  margin: 2px;
825
826
  }
826
827
  .mi-badge--success {
@@ -830,8 +831,8 @@
830
831
  }
831
832
  .mi-badge--error {
832
833
  background-color: rgba(255, 0, 51, 0.15);
833
- color: var(--mi-color-error, #FF0033);
834
- border: 1px solid var(--mi-color-error, #FF0033);
834
+ color: #FF6680;
835
+ border: 1px solid #FF3355;
835
836
  }
836
837
  .mi-badge--outline {
837
838
  background-color: transparent;
@@ -2190,7 +2191,7 @@
2190
2191
  display: inline-block;
2191
2192
  }
2192
2193
  .mi-neon-text--inferno {
2193
- color: #FF4D00;
2194
+ color: #FF8533;
2194
2195
  text-shadow:
2195
2196
  0 0 5px #FF4D00,
2196
2197
  0 0 10px #FF4D00,
@@ -2214,7 +2215,7 @@
2214
2215
  0 0 40px #00CC52;
2215
2216
  }
2216
2217
  .mi-neon-text--magenta {
2217
- color: #FF00E5;
2218
+ color: #FF66EB;
2218
2219
  text-shadow:
2219
2220
  0 0 5px #FF00E5,
2220
2221
  0 0 10px #FF00E5,
@@ -3067,12 +3068,20 @@
3067
3068
  align-items: center;
3068
3069
  }
3069
3070
  .mi-rpggrid-grid {
3070
- display: grid;
3071
+ display: flex;
3072
+ flex-direction: column;
3073
+ gap: 0.5rem;
3074
+ width: 100%;
3075
+ }
3076
+ .mi-rpggrid-row {
3077
+ display: flex;
3071
3078
  gap: 0.5rem;
3079
+ width: 100%;
3072
3080
  }
3073
3081
  .mi-rpggrid-slot {
3074
3082
  width: 52px;
3075
3083
  height: 52px;
3084
+ flex-shrink: 0;
3076
3085
  background-color: #0A090D;
3077
3086
  border: 1px solid var(--mi-color-border, #332D40);
3078
3087
  border-radius: var(--mi-radius-sm, 4px);
@@ -3537,6 +3546,290 @@
3537
3546
  cursor: not-allowed;
3538
3547
  }
3539
3548
 
3549
+ /* ../themes/src/moon-inferno.css */
3550
+ :root,
3551
+ [data-theme=moon-inferno] {
3552
+ --mi-color-bg: #0A090D;
3553
+ --mi-color-bg-subtle: #14121A;
3554
+ --mi-color-surface: #1E1B26;
3555
+ --mi-color-border: #332D40;
3556
+ --mi-color-border-accent: #FF4D00;
3557
+ --mi-color-primary: #FF4D00;
3558
+ --mi-color-primary-hover: #FF661A;
3559
+ --mi-color-primary-active: #FF2E00;
3560
+ --mi-color-primary-text: #050406;
3561
+ --mi-color-text: #F1F5F9;
3562
+ --mi-color-text-muted: #94A3B8;
3563
+ --mi-color-text-dim: #64748B;
3564
+ --mi-color-focus-ring: #FF4D00;
3565
+ --mi-shadow-glow: 0 0 16px rgba(255, 77, 0, 0.45);
3566
+ --mi-shadow-pixel: 3px 3px 0px #000000;
3567
+ --mi-crt-scanline: rgba(255, 77, 0, 0.05);
3568
+ --mi-font-mono:
3569
+ "JetBrains Mono",
3570
+ "Courier New",
3571
+ monospace;
3572
+ --mi-font-sans:
3573
+ system-ui,
3574
+ -apple-system,
3575
+ BlinkMacSystemFont,
3576
+ "Segoe UI",
3577
+ Roboto,
3578
+ sans-serif;
3579
+ --mi-font-pixel:
3580
+ "Press Start 2P",
3581
+ "Courier New",
3582
+ monospace;
3583
+ --mi-radius-sm: 2px;
3584
+ --mi-radius-base: 4px;
3585
+ --mi-radius-md: 8px;
3586
+ --mi-radius-full: 9999px;
3587
+ }
3588
+ ::-webkit-scrollbar {
3589
+ width: 8px;
3590
+ height: 8px;
3591
+ }
3592
+ ::-webkit-scrollbar-track {
3593
+ background: var(--mi-color-bg-subtle, #14121A);
3594
+ border: 1px solid var(--mi-color-border, #332D40);
3595
+ }
3596
+ ::-webkit-scrollbar-thumb {
3597
+ background: var(--mi-color-primary, #FF4D00);
3598
+ border-radius: 2px;
3599
+ box-shadow: 0 0 8px rgba(255, 77, 0, 0.4);
3600
+ }
3601
+ ::-webkit-scrollbar-thumb:hover {
3602
+ background: var(--mi-color-primary-hover, #FF661A);
3603
+ }
3604
+
3605
+ /* ../themes/src/terminal.css */
3606
+ [data-theme=terminal] {
3607
+ --mi-color-bg: #05130A;
3608
+ --mi-color-bg-subtle: #0B2213;
3609
+ --mi-color-surface: #10331C;
3610
+ --mi-color-border: #1A542E;
3611
+ --mi-color-border-accent: #00FF66;
3612
+ --mi-color-primary: #00FF66;
3613
+ --mi-color-primary-hover: #33FF85;
3614
+ --mi-color-primary-active: #00CC52;
3615
+ --mi-color-primary-text: #05130A;
3616
+ --mi-color-text: #00FF66;
3617
+ --mi-color-text-muted: #66FF99;
3618
+ --mi-color-text-dim: #26994D;
3619
+ --mi-color-focus-ring: #00FF66;
3620
+ --mi-shadow-glow: 0 0 16px rgba(0, 255, 102, 0.45);
3621
+ --mi-shadow-pixel: 3px 3px 0px #000000;
3622
+ --mi-crt-scanline: rgba(0, 255, 102, 0.08);
3623
+ }
3624
+
3625
+ /* ../themes/src/y2k.css */
3626
+ [data-theme=y2k] {
3627
+ --mi-color-bg: #0F0E17;
3628
+ --mi-color-bg-subtle: #1B1A2E;
3629
+ --mi-color-surface: #2A2845;
3630
+ --mi-color-border: #4D4775;
3631
+ --mi-color-border-accent: #00E5FF;
3632
+ --mi-color-primary: #00E5FF;
3633
+ --mi-color-primary-hover: #52EDFF;
3634
+ --mi-color-primary-active: #00B4CC;
3635
+ --mi-color-primary-text: #0F0E17;
3636
+ --mi-color-text: #F8FAFC;
3637
+ --mi-color-text-muted: #CBD5E1;
3638
+ --mi-color-text-dim: #8B85C1;
3639
+ --mi-color-focus-ring: #00E5FF;
3640
+ --mi-shadow-glow: 0 0 16px rgba(0, 229, 255, 0.45);
3641
+ --mi-shadow-pixel: 3px 3px 0px #0F0E17;
3642
+ --mi-crt-scanline: rgba(0, 229, 255, 0.05);
3643
+ }
3644
+
3645
+ /* src/styles/native-html.css */
3646
+ select.mi-select,
3647
+ .mi-select-native {
3648
+ width: 100%;
3649
+ padding: 0.65rem 2.25rem 0.65rem 0.875rem;
3650
+ font-family: var(--mi-font-mono, "JetBrains Mono", monospace);
3651
+ font-size: 0.875rem;
3652
+ background-color: var(--mi-color-surface, #1E1B26);
3653
+ color: var(--mi-color-text, #F1F5F9);
3654
+ border: 1px solid var(--mi-color-border, #332D40);
3655
+ border-radius: var(--mi-radius-base, 4px);
3656
+ outline: none;
3657
+ cursor: pointer;
3658
+ -webkit-appearance: none;
3659
+ -moz-appearance: none;
3660
+ appearance: none;
3661
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23FF4D00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
3662
+ background-repeat: no-repeat;
3663
+ background-position: right 0.75rem center;
3664
+ background-size: 16px;
3665
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
3666
+ min-height: 42px;
3667
+ }
3668
+ select.mi-select:focus,
3669
+ .mi-select-native:focus {
3670
+ border-color: var(--mi-color-focus-ring, #FF4D00);
3671
+ box-shadow: var(--mi-shadow-glow, 0 0 16px rgba(255, 77, 0, 0.45));
3672
+ }
3673
+ select.mi-select option,
3674
+ .mi-select-native option {
3675
+ background-color: var(--mi-color-surface, #1E1B26);
3676
+ color: var(--mi-color-text, #F1F5F9);
3677
+ padding: 0.65rem;
3678
+ }
3679
+ select.mi-select--pixel {
3680
+ border-radius: 0;
3681
+ border-width: 2px;
3682
+ box-shadow: var(--mi-shadow-pixel, 3px 3px 0 #000);
3683
+ }
3684
+ meter.mi-health-meter,
3685
+ meter.mi-healthmeter,
3686
+ .mi-meter-native {
3687
+ -webkit-appearance: none;
3688
+ -moz-appearance: none;
3689
+ appearance: none;
3690
+ width: 100%;
3691
+ height: 18px;
3692
+ background: #0A090D;
3693
+ border: 1px solid var(--mi-color-border, #332D40);
3694
+ border-radius: var(--mi-radius-sm, 4px);
3695
+ overflow: hidden;
3696
+ display: block;
3697
+ box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.8);
3698
+ }
3699
+ meter.mi-health-meter::-webkit-meter-bar,
3700
+ meter.mi-healthmeter::-webkit-meter-bar {
3701
+ background: #0A090D;
3702
+ border-radius: var(--mi-radius-sm, 4px);
3703
+ }
3704
+ meter.mi-health-meter::-webkit-meter-optimum-value,
3705
+ meter.mi-healthmeter::-webkit-meter-optimum-value,
3706
+ meter.mi-health-meter--health::-webkit-meter-optimum-value {
3707
+ background:
3708
+ linear-gradient(
3709
+ 90deg,
3710
+ #CC0029 0%,
3711
+ #FF0033 60%,
3712
+ #FF4D00 100%);
3713
+ box-shadow: 0 0 10px #FF0033;
3714
+ }
3715
+ meter.mi-health-meter--mana::-webkit-meter-optimum-value,
3716
+ meter.mi-healthmeter--mana::-webkit-meter-optimum-value {
3717
+ background:
3718
+ linear-gradient(
3719
+ 90deg,
3720
+ #0055FF 0%,
3721
+ #00AAFF 60%,
3722
+ #00E5FF 100%);
3723
+ box-shadow: 0 0 10px #00E5FF;
3724
+ }
3725
+ meter.mi-health-meter--shield::-webkit-meter-optimum-value,
3726
+ meter.mi-healthmeter--shield::-webkit-meter-optimum-value {
3727
+ background:
3728
+ linear-gradient(
3729
+ 90deg,
3730
+ #7700FF 0%,
3731
+ #AA00FF 60%,
3732
+ #FF00E5 100%);
3733
+ box-shadow: 0 0 10px #FF00E5;
3734
+ }
3735
+ meter.mi-health-meter--energy::-webkit-meter-optimum-value,
3736
+ meter.mi-healthmeter--energy::-webkit-meter-optimum-value {
3737
+ background:
3738
+ linear-gradient(
3739
+ 90deg,
3740
+ #009933 0%,
3741
+ #00FF66 60%,
3742
+ #AAFF00 100%);
3743
+ box-shadow: 0 0 10px #00FF66;
3744
+ }
3745
+ meter.mi-health-meter::-moz-meter-bar,
3746
+ meter.mi-healthmeter::-moz-meter-bar,
3747
+ meter.mi-health-meter--health::-moz-meter-bar {
3748
+ background:
3749
+ linear-gradient(
3750
+ 90deg,
3751
+ #CC0029 0%,
3752
+ #FF0033 60%,
3753
+ #FF4D00 100%);
3754
+ }
3755
+ meter.mi-health-meter--mana::-moz-meter-bar,
3756
+ meter.mi-healthmeter--mana::-moz-meter-bar {
3757
+ background:
3758
+ linear-gradient(
3759
+ 90deg,
3760
+ #0055FF 0%,
3761
+ #00AAFF 60%,
3762
+ #00E5FF 100%);
3763
+ }
3764
+ meter.mi-health-meter--shield::-moz-meter-bar,
3765
+ meter.mi-healthmeter--shield::-moz-meter-bar {
3766
+ background:
3767
+ linear-gradient(
3768
+ 90deg,
3769
+ #7700FF 0%,
3770
+ #AA00FF 60%,
3771
+ #FF00E5 100%);
3772
+ }
3773
+ meter.mi-health-meter--energy::-moz-meter-bar,
3774
+ meter.mi-healthmeter--energy::-moz-meter-bar {
3775
+ background:
3776
+ linear-gradient(
3777
+ 90deg,
3778
+ #009933 0%,
3779
+ #00FF66 60%,
3780
+ #AAFF00 100%);
3781
+ }
3782
+ progress.mi-progress {
3783
+ -webkit-appearance: none;
3784
+ -moz-appearance: none;
3785
+ appearance: none;
3786
+ width: 100%;
3787
+ height: 14px;
3788
+ background-color: var(--mi-color-bg-subtle, #14121A);
3789
+ border: 1px solid var(--mi-color-border, #332D40);
3790
+ border-radius: var(--mi-radius-full, 9999px);
3791
+ overflow: hidden;
3792
+ display: block;
3793
+ }
3794
+ progress.mi-progress::-webkit-progress-bar {
3795
+ background-color: var(--mi-color-bg-subtle, #14121A);
3796
+ }
3797
+ progress.mi-progress::-webkit-progress-value {
3798
+ background:
3799
+ linear-gradient(
3800
+ 90deg,
3801
+ var(--mi-color-primary, #FF4D00),
3802
+ #FF8000);
3803
+ box-shadow: var(--mi-shadow-glow, 0 0 16px rgba(255, 77, 0, 0.45));
3804
+ }
3805
+ progress.mi-progress::-moz-progress-bar {
3806
+ background:
3807
+ linear-gradient(
3808
+ 90deg,
3809
+ var(--mi-color-primary, #FF4D00),
3810
+ #FF8000);
3811
+ }
3812
+ textarea.mi-input,
3813
+ textarea.mi-textarea {
3814
+ width: 100%;
3815
+ min-height: 90px;
3816
+ padding: 0.625rem 0.875rem;
3817
+ font-family: var(--mi-font-mono, monospace);
3818
+ font-size: 0.875rem;
3819
+ background-color: var(--mi-color-bg-subtle, #14121A);
3820
+ color: var(--mi-color-text, #F1F5F9);
3821
+ border: 1px solid var(--mi-color-border, #332D40);
3822
+ border-radius: var(--mi-radius-base, 4px);
3823
+ outline: none;
3824
+ resize: vertical;
3825
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
3826
+ }
3827
+ textarea.mi-input:focus,
3828
+ textarea.mi-textarea:focus {
3829
+ border-color: var(--mi-color-focus-ring, #FF4D00);
3830
+ box-shadow: var(--mi-shadow-glow);
3831
+ }
3832
+
3540
3833
  /* src/styles/scrollbar.css */
3541
3834
  html,
3542
3835
  body {
@@ -3792,7 +4085,7 @@ textarea {
3792
4085
  box-shadow: 0 0 10px rgba(255, 68, 68, 0.4);
3793
4086
  }
3794
4087
  .moon-datepicker__placeholder {
3795
- color: var(--moon-color-text-muted, #707585);
4088
+ color: var(--mi-color-text-muted, #94A3B8);
3796
4089
  }
3797
4090
  .moon-datepicker__value {
3798
4091
  color: var(--moon-color-text, #ffffff);
@@ -3853,7 +4146,7 @@ textarea {
3853
4146
  .moon-datepicker__weekday {
3854
4147
  font-size: 0.75rem;
3855
4148
  font-weight: 700;
3856
- color: var(--moon-color-text-muted, #707585);
4149
+ color: var(--mi-color-text-muted, #94A3B8);
3857
4150
  }
3858
4151
  .moon-datepicker__grid {
3859
4152
  display: grid;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "moon-inferno",
3
- "version": "0.3.5",
3
+ "version": "0.3.7",
4
4
  "description": "All-in-one bundle for Moon-Inferno: Expressive, accessibility-first React UI framework for retro, Y2K, CRT, cyberpunk, gaming, and Web3 applications.",
5
5
  "license": "MIT",
6
6
  "author": "Biagio Scaglia",
@@ -29,10 +29,10 @@
29
29
  "LICENSE"
30
30
  ],
31
31
  "dependencies": {
32
- "@moon-inferno/icons": "0.3.5",
33
- "@moon-inferno/react": "0.3.5",
34
- "@moon-inferno/core": "0.3.5",
35
- "@moon-inferno/themes": "0.3.5"
32
+ "@moon-inferno/core": "0.3.7",
33
+ "@moon-inferno/icons": "0.3.7",
34
+ "@moon-inferno/react": "0.3.7",
35
+ "@moon-inferno/themes": "0.3.7"
36
36
  },
37
37
  "peerDependencies": {
38
38
  "react": ">=18.0.0",