@arco-themes/vue-startrek 0.0.2 → 0.0.4

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 (7) hide show
  1. package/README.md +14 -0
  2. package/css/arco.css +1 -1
  3. package/package.json +1 -1
  4. package/theme.css +12 -12
  5. package/theme.less +12 -12
  6. package/tokens.less +26 -26
  7. package/variables.less +22 -14
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arco-themes/vue-startrek",
3
- "version": "0.0.2",
3
+ "version": "0.0.4",
4
4
  "description": "",
5
5
  "author": "changxiaoru1122",
6
6
  "owners": [],
package/theme.css CHANGED
@@ -7,9 +7,9 @@ body {
7
7
  --color-border: rgb(var(--gray-3));
8
8
  --color-bg-popup: var(--color-bg-5);
9
9
  --color-bg-1: #fff;
10
- --color-bg-2: #fff;
11
- --color-bg-3: #fff;
12
- --color-bg-4: #fff;
10
+ --color-bg-2: #f2f6fd;
11
+ --color-bg-3: #f7f8fa;
12
+ --color-bg-4: #f7f8fa;
13
13
  --color-bg-5: #fff;
14
14
  --color-bg-white: #fff;
15
15
  --color-neutral-1: rgb(var(--gray-1));
@@ -25,15 +25,15 @@ body {
25
25
  --color-text-1: #12141a;
26
26
  --color-text-2: #34363f;
27
27
  --color-text-3: #5e6375;
28
- --color-text-4: #5e6375;
29
- --color-fill-1: var(--color-neutral-1);
30
- --color-fill-2: var(--color-neutral-2);
31
- --color-fill-3: var(--color-neutral-3);
32
- --color-fill-4: var(--color-neutral-4);
33
- --color-border-1: var(--color-neutral-2);
34
- --color-border-2: var(--color-neutral-3);
35
- --color-border-3: var(--color-neutral-4);
36
- --color-border-4: var(--color-neutral-6);
28
+ --color-text-4: #9799a4;
29
+ --color-fill-1: #f2f6fd;
30
+ --color-fill-2: #f0f2f5;
31
+ --color-fill-3: #dce0e5;
32
+ --color-fill-4: #c6c8cc;
33
+ --color-border-1: #f0f2f5;
34
+ --color-border-2: #dce0e5;
35
+ --color-border-3: #c6c8cc;
36
+ --color-border-4: #9799a4;
37
37
  --color-primary-light-1: rgb(var(--primary-1));
38
38
  --color-primary-light-2: rgb(var(--primary-2));
39
39
  --color-primary-light-3: rgb(var(--primary-3));
package/theme.less CHANGED
@@ -597,35 +597,35 @@
597
597
  @dark-color-white: rgba(255, 255, 255, 0.9);
598
598
  @color-text-3: rgb(94, 99, 117);
599
599
  @color-text-2: rgb(52, 54, 63);
600
- @color-text-4: rgb(94, 99, 117);
600
+ @color-text-4: rgb(151, 153, 164);
601
601
  @dark-color-text-3: rgba(255, 255, 255, 0.5);
602
- @color-border-2: var(~'@{arco-cssvars-prefix}-color-neutral-3');
603
- @color-fill-4: var(~'@{arco-cssvars-prefix}-color-neutral-4');
604
- @color-fill-2: var(~'@{arco-cssvars-prefix}-color-neutral-2');
605
- @color-fill-3: var(~'@{arco-cssvars-prefix}-color-neutral-3');
602
+ @color-border-2: rgb(220, 224, 229);
603
+ @color-fill-4: rgb(198, 200, 204);
604
+ @color-fill-2: rgb(240, 242, 245);
605
+ @color-fill-3: rgb(220, 224, 229);
606
606
  @dark-color-bg-1: #17171A;
607
607
  @dark-color-fill-4: rgba(255, 255, 255, 0.16);
608
608
  @dark-color-bg-white: #f6f6f6;
609
609
  @dark-color-border-1: @dark-gray-2;
610
610
  @color-bg-1: #ffffff;
611
- @color-border-1: var(~'@{arco-cssvars-prefix}-color-neutral-2');
611
+ @color-border-1: rgb(240, 242, 245);
612
612
  @dark-color-border-2: @dark-gray-3;
613
- @color-fill-1: var(~'@{arco-cssvars-prefix}-color-neutral-1');
613
+ @color-fill-1: rgb(242, 246, 253);
614
614
  @dark-color-border-4: @dark-gray-6;
615
615
  @dark-color-fill-1: rgba(255, 255, 255, 0.04);
616
- @color-border-4: var(~'@{arco-cssvars-prefix}-color-neutral-6');
616
+ @color-border-4: rgb(151, 153, 164);
617
617
  @dark-color-fill-2: rgba(255, 255, 255, 0.08);
618
618
  @dark-color-border-3: @dark-gray-4;
619
619
  @dark-color-fill-3: rgba(255, 255, 255, 0.12);
620
- @color-bg-3: #ffffff;
620
+ @color-bg-3: rgb(247, 248, 250);
621
621
  @dark-color-bg-2: #232324;
622
622
  @dark-color-bg-4: #313132;
623
623
  @dark-color-bg-5: #373739;
624
624
  @color-bg-5: #ffffff;
625
- @color-bg-4: #ffffff;
625
+ @color-bg-4: rgb(247, 248, 250);
626
626
  @dark-color-bg-3: #2a2a2b;
627
- @color-bg-2: #ffffff;
628
- @color-border-3: var(~'@{arco-cssvars-prefix}-color-neutral-4');
627
+ @color-bg-2: rgb(242, 246, 253);
628
+ @color-border-3: rgb(198, 200, 204);
629
629
  @textarea-prefix-cls: ~'@{prefix}-textarea';
630
630
  @color-primary-1: rgb(var(~'@{arco-cssvars-prefix}-primary-1'));
631
631
  @color-primary-5: rgb(var(~'@{arco-cssvars-prefix}-primary-5'));
package/tokens.less CHANGED
@@ -753,23 +753,23 @@
753
753
  @color-border: rgb(var(--gray-3));
754
754
  @color-bg-popup: var(--color-bg-5);
755
755
  @color-bg-1: #ffffff;
756
- @color-bg-2: #ffffff;
757
- @color-bg-3: #ffffff;
758
- @color-bg-4: #ffffff;
756
+ @color-bg-2: #f2f6fd;
757
+ @color-bg-3: #f7f8fa;
758
+ @color-bg-4: #f7f8fa;
759
759
  @color-bg-5: #ffffff;
760
760
  @color-bg-white: #ffffff;
761
761
  @color-text-1: #12141a;
762
762
  @color-text-2: #34363f;
763
763
  @color-text-3: #5e6375;
764
- @color-text-4: #5e6375;
765
- @color-fill-1: var(--color-neutral-1);
766
- @color-fill-2: var(--color-neutral-2);
767
- @color-fill-3: var(--color-neutral-3);
768
- @color-fill-4: var(--color-neutral-4);
769
- @color-border-1: var(--color-neutral-2);
770
- @color-border-2: var(--color-neutral-3);
771
- @color-border-3: var(--color-neutral-4);
772
- @color-border-4: var(--color-neutral-6);
764
+ @color-text-4: #9799a4;
765
+ @color-fill-1: #f2f6fd;
766
+ @color-fill-2: #f0f2f5;
767
+ @color-fill-3: #dce0e5;
768
+ @color-fill-4: #c6c8cc;
769
+ @color-border-1: #f0f2f5;
770
+ @color-border-2: #dce0e5;
771
+ @color-border-3: #c6c8cc;
772
+ @color-border-4: #9799a4;
773
773
  @color-primary-light-1: rgb(var(--primary-1));
774
774
  @color-primary-light-2: rgb(var(--primary-2));
775
775
  @color-primary-light-3: rgb(var(--primary-3));
@@ -988,7 +988,7 @@
988
988
  @input-color-bg: transparent;
989
989
  @input-color-bg_hover: transparent;
990
990
  @input-color-bg_focus: var(--color-bg-2);
991
- @input-color-bg_disabled: var(--color-fill-2);
991
+ @input-color-bg_disabled: #f0f2f5;
992
992
  @input-color-addon-bg: transparent;
993
993
  @input-color-addon-border: var(--color-neutral-3);
994
994
  @input-border-addon-separator-width: 1px;
@@ -997,7 +997,7 @@
997
997
  @input-size-shadow_focus: 0;
998
998
  @input-color-addon-border_default: transparent;
999
999
  @input-color-text: #34363f;
1000
- @input-color-placeholder-text: #5e6375;
1000
+ @input-color-placeholder-text: #9799a4;
1001
1001
  @input-color-text_disabled: #c6c8cc;
1002
1002
  @input-color-bg_error: transparent;
1003
1003
  @input-color-bg_error_hover: transparent;
@@ -1176,26 +1176,26 @@
1176
1176
  @picker-size-small-font-size-text: 14px;
1177
1177
  @picker-size-default-font-size-text: 14px;
1178
1178
  @picker-size-large-font-size-text: 14px;
1179
- @picker-input-border-radius: var(--border-radius-small);
1179
+ @picker-input-border-radius: 4px;
1180
1180
  @picker-color-shadow_focus: var(--color-primary-light-2);
1181
1181
  @picker-size-shadow_focus: 0;
1182
1182
  @picker-color-shadow_error_focus: var(--color-danger-light-2);
1183
1183
  @picker-size-shadow_error_focus: 0;
1184
- @picker-color-bg: var(--color-fill-2);
1184
+ @picker-color-bg: transparent;
1185
1185
  @picker-color-bg_hover: var(--color-fill-3);
1186
1186
  @picker-color-bg_focus: var(--color-bg-2);
1187
- @picker-color-bg_disabled: var(--color-fill-2);
1187
+ @picker-color-bg_disabled: #f0f2f5;
1188
1188
  @picker-color-bg_error: var(--color-danger-light-1);
1189
1189
  @picker-color-bg_error_hover: var(--color-danger-light-2);
1190
1190
  @picker-color-bg_error_focus: var(--color-bg-2);
1191
- @picker-color-border: transparent;
1191
+ @picker-color-border: #dce0e5;
1192
1192
  @picker-color-border_hover: transparent;
1193
1193
  @picker-color-border_focus: rgb(var(--primary-6));
1194
- @picker-color-border_disabled: transparent;
1194
+ @picker-color-border_disabled: #dce0e5;
1195
1195
  @picker-color-border_error: transparent;
1196
1196
  @picker-color-border_error_hover: transparent;
1197
1197
  @picker-color-border_error_focus: rgb(var(--danger-6));
1198
- @picker-color-placeholder: var(--color-text-3);
1198
+ @picker-color-placeholder: #9799a4;
1199
1199
  @picker-color-placeholder_disabled: var(--color-text-4);
1200
1200
  @picker-color-text: var(--color-text-2);
1201
1201
  @picker-color-text_disabled: var(--color-text-4);
@@ -1663,11 +1663,11 @@
1663
1663
 
1664
1664
  @btn-font-weight: 400;
1665
1665
  @btn-border-width: 1px;
1666
- @btn-border-radius: var(--border-radius-small);
1667
- @btn-size-mini-radius: var(--border-radius-small);
1668
- @btn-size-small-radius: var(--border-radius-small);
1669
- @btn-size-default-radius: var(--border-radius-small);
1670
- @btn-size-large-radius: var(--border-radius-small);
1666
+ @btn-border-radius: 4px;
1667
+ @btn-size-mini-radius: 4px;
1668
+ @btn-size-small-radius: 4px;
1669
+ @btn-size-default-radius: 4px;
1670
+ @btn-size-large-radius: 4px;
1671
1671
  @btn-size-mini-height: 24px;
1672
1672
  @btn-size-small-height: 28px;
1673
1673
  @btn-size-default-height: 32px;
@@ -1937,7 +1937,7 @@
1937
1937
  @btn-text-color-border_success_hover: transparent;
1938
1938
  @btn-text-color-border_success_active: transparent;
1939
1939
  @btn-text-border-style: solid;
1940
- @btn-size-medium-radius: var(--border-radius-small);
1940
+ @btn-size-medium-radius: 4px;
1941
1941
  @btn-size-medium-border-width: 1px;
1942
1942
  @btn-size-medium-icon-spacing: 8px;
1943
1943
  @btn-size-medium-icon-vertical-align: -2px;
package/variables.less CHANGED
@@ -591,35 +591,35 @@
591
591
  @dark-color-white: rgba(255, 255, 255, 0.9);
592
592
  @color-text-3: rgb(94, 99, 117);
593
593
  @color-text-2: rgb(52, 54, 63);
594
- @color-text-4: rgb(94, 99, 117);
594
+ @color-text-4: rgb(151, 153, 164);
595
595
  @dark-color-text-3: rgba(255, 255, 255, 0.5);
596
- @color-border-2: var(~'@{arco-cssvars-prefix}-color-neutral-3');
597
- @color-fill-4: var(~'@{arco-cssvars-prefix}-color-neutral-4');
598
- @color-fill-2: var(~'@{arco-cssvars-prefix}-color-neutral-2');
599
- @color-fill-3: var(~'@{arco-cssvars-prefix}-color-neutral-3');
596
+ @color-border-2: rgb(220, 224, 229);
597
+ @color-fill-4: rgb(198, 200, 204);
598
+ @color-fill-2: rgb(240, 242, 245);
599
+ @color-fill-3: rgb(220, 224, 229);
600
600
  @dark-color-bg-1: #17171A;
601
601
  @dark-color-fill-4: rgba(255, 255, 255, 0.16);
602
602
  @dark-color-bg-white: #f6f6f6;
603
603
  @dark-color-border-1: @dark-gray-2;
604
604
  @color-bg-1: #ffffff;
605
- @color-border-1: var(~'@{arco-cssvars-prefix}-color-neutral-2');
605
+ @color-border-1: rgb(240, 242, 245);
606
606
  @dark-color-border-2: @dark-gray-3;
607
- @color-fill-1: var(~'@{arco-cssvars-prefix}-color-neutral-1');
607
+ @color-fill-1: rgb(242, 246, 253);
608
608
  @dark-color-border-4: @dark-gray-6;
609
609
  @dark-color-fill-1: rgba(255, 255, 255, 0.04);
610
- @color-border-4: var(~'@{arco-cssvars-prefix}-color-neutral-6');
610
+ @color-border-4: rgb(151, 153, 164);
611
611
  @dark-color-fill-2: rgba(255, 255, 255, 0.08);
612
612
  @dark-color-border-3: @dark-gray-4;
613
613
  @dark-color-fill-3: rgba(255, 255, 255, 0.12);
614
- @color-bg-3: #ffffff;
614
+ @color-bg-3: rgb(247, 248, 250);
615
615
  @dark-color-bg-2: #232324;
616
616
  @dark-color-bg-4: #313132;
617
617
  @dark-color-bg-5: #373739;
618
618
  @color-bg-5: #ffffff;
619
- @color-bg-4: #ffffff;
619
+ @color-bg-4: rgb(247, 248, 250);
620
620
  @dark-color-bg-3: #2a2a2b;
621
- @color-bg-2: #ffffff;
622
- @color-border-3: var(~'@{arco-cssvars-prefix}-color-neutral-4');
621
+ @color-bg-2: rgb(242, 246, 253);
622
+ @color-border-3: rgb(198, 200, 204);
623
623
  @textarea-prefix-cls: ~'@{prefix}-textarea';
624
624
  @color-primary-1: rgb(var(~'@{arco-cssvars-prefix}-primary-1'));
625
625
  @color-primary-5: rgb(var(~'@{arco-cssvars-prefix}-primary-5'));
@@ -803,8 +803,6 @@
803
803
  @color-text-6: #dce0e5;
804
804
  @color-text-7: #f0f2f5;
805
805
  @dark-color-text-7: #f0f2f5;
806
- @color-text-8: #f2f6fd;
807
- @dark-color-text-8: #f2f6fd;
808
806
  @divider-color-bg: @color-text-7;
809
807
  @input-number-step-button-color-bg_default: var(~'@{arco-cssvars-prefix}-color-fill-2');
810
808
  @input-border-radius: @border-radius-medium;
@@ -821,3 +819,13 @@
821
819
  @input-color-bg_error_hover: @color-transparent;
822
820
  @input-color-border_error_hover: @color-danger-4;
823
821
  @upload-drag-color-bg: var(~'@{arco-cssvars-prefix}-color-fill-1');
822
+ @picker-color-bg: @color-transparent;
823
+ @picker-color-border: @color-text-6;
824
+ @picker-input-border-radius: @border-radius-medium;
825
+ @picker-color-placeholder: @color-text-4;
826
+ @picker-color-bg_disabled: @color-text-7;
827
+ @picker-color-border_disabled: @color-text-6;
828
+ @input-color-bg_disabled: @color-text-7;
829
+ @btn-border-radius: @border-radius-medium;
830
+ @color-text-8: #f2f6fd;
831
+ @dark-color-text-8: #f2f6fd;