Skip to content

Commit e0c92d6

Browse files
xiaoyatongxiaoyatong
authored
fix: 修订主题变量 (#2911)
* fix: rate 的自定义处理 * fix: taro configprovider * fix: variables * fix: 修改主题变量
1 parent 4edcfd7 commit e0c92d6

File tree

2 files changed

+102
-55
lines changed

2 files changed

+102
-55
lines changed

‎src/packages/configprovider/types.ts

Lines changed: 34 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
export type NutCSSVariables =
2-
| 'nutuiBrand6'
2+
| 'nutuiColorPrimary'
33
| 'nutuiColorPrimaryStop1'
44
| 'nutuiColorPrimaryStop2'
55
| 'nutuiColorPrimaryPressed'
66
| 'nutuiColorPrimaryDisabled'
7+
| 'nutuiColorPrimaryDisabledSpecial'
8+
| 'nutuiColorPrimaryLightPressed'
79
| 'nutuiBrand3'
810
| 'nutuiBrand1'
911
| 'nutuiColorPrimaryIcon'
@@ -18,33 +20,38 @@ export type NutCSSVariables =
1820
| 'nutuiColorInfoDisabled'
1921
| 'nutuiColorInfoLight'
2022
| 'nutuiColorInfoBackground'
21-
| 'nutuiGreen2'
22-
| 'nutuiGreen3'
23+
| 'nutuiColorSuccess'
24+
| 'nutuiColorSuccessPressed'
2325
| 'nutuiColorSuccessDisabled'
24-
| 'nutuiGreen1'
25-
| 'nutuiYellow2'
26-
| 'nutuiYellow3'
26+
| 'nutuiColorSuccessLight'
27+
| 'nutuiColorSuccessBackground'
28+
| 'nutuiColorSuccessText'
29+
| 'nutuiColorWarning'
30+
| 'nutuiColorWarningPressed'
2731
| 'nutuiColorWarningDisabled'
28-
| 'nutuiYellow1'
29-
| 'nutuiRed2'
32+
| 'nutuiColorWarningLight'
33+
| 'nutuiColorWarningBackground'
34+
| 'nutuiColorWarningText'
35+
| 'nutuiColorDanger'
3036
| 'nutuiColorDangerPressed'
3137
| 'nutuiColorDangerDisabled'
32-
| 'nutuiRed1'
38+
| 'nutuiColorDangerLight'
3339
| 'nutuiColorDangerBackground'
34-
| 'nutuiGray3'
35-
| 'nutuiGray1'
40+
| 'nutuiColorDangerText'
41+
| 'nutuiColorBackground'
42+
| 'nutuiColorBackgroundOverlay'
3643
| 'nutuiColorBackgroundSunken'
37-
| 'nutuiGray2'
38-
| 'nutuiBlack10'
39-
| 'nutuiBlack7'
40-
| 'nutuiBlack2'
41-
| 'nutuiBlack3'
42-
| 'nutuiGray4'
43-
| 'nutuiGray7'
44-
| 'nutuiGray6'
45-
| 'nutuiGray5'
46-
| 'nutuiWhite12'
47-
| 'nutuiBlue2'
44+
| 'nutuiColorMask'
45+
| 'nutuiColorMaskPart'
46+
| 'nutuiColorMaskFaultToleran'
47+
| 'nutuiColorBorder'
48+
| 'nutuiColorBorderDisabled'
49+
| 'nutuiColorTitle'
50+
| 'nutuiColorText'
51+
| 'nutuiColorTextHelp'
52+
| 'nutuiColorTextDisabled'
53+
| 'nutuiColorTextDark'
54+
| 'nutuiColorTextLink'
4855
| 'nutuiFontSizeXxs'
4956
| 'nutuiFontSizeXs'
5057
| 'nutuiFontSizeS'
@@ -176,6 +183,7 @@ export type NutCSSVariables =
176183
| 'nutuiUploaderPreviewMarginBottom'
177184
| 'nutuiUploaderPreviewTipsHeight'
178185
| 'nutuiUploaderPreviewTipsBackground'
186+
| 'nutuiBlack7'
179187
| 'nutuiUploaderPreviewTipsPadding'
180188
| 'nutuiUploaderPreviewCloseRight'
181189
| 'nutuiUploaderPreviewCloseTop'
@@ -188,6 +196,7 @@ export type NutCSSVariables =
188196
| 'nutuiPickerItemTextColor'
189197
| 'nutuiPickerItemTextFontSize'
190198
| 'nutuiPickerItemActiveLineBorder'
199+
| 'nutuiWhite12'
191200
| 'nutuiWhite7'
192201
| 'nutuiInputBorderBottom'
193202
| 'nutuiInputBorderBottomWidth'
@@ -261,8 +270,8 @@ export type NutCSSVariables =
261270
| 'nutuiCountdownNumberPrimaryBackgroundColor'
262271
| 'nutuiCountdownNumberPrimaryBorderColor'
263272
| 'nutuiPriceColor'
264-
| 'nutuiColorTextHelp'
265273
| 'nutuiPriceDarkgrayColor'
274+
| 'nutuiGray7'
266275
| 'nutuiPriceLineColor'
267276
| 'nutuiPriceSymbolPaddingRight'
268277
| 'nutuiPriceSymbolXlargeSize'
@@ -715,6 +724,7 @@ export type NutCSSVariables =
715724
| 'nutuiGridItemBorderRadius'
716725
| 'nutuiGridItemContentPadding'
717726
| 'nutuiGridItemContentBgColor'
727+
| 'nutuiGray1'
718728
| 'nutuiGridItemTextMargin'
719729
| 'nutuiGridItemTextColor'
720730
| 'nutuiGridItemTextFontSize'
@@ -841,4 +851,5 @@ export type NutCSSVariables =
841851
| 'nutuiResultpageDescriptionLineHeight'
842852
| 'nutuiResultpageActionsMarginTop'
843853
| 'nutuiSafeAreaMultiple'
854+
| 'nutuiBlack3'
844855
| 'nutuiBlack1'

‎src/styles/variables.scss

Lines changed: 68 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,18 @@
11
// ----------------------------------------------------
22
// 主色调 // done
3-
$color-primary: var(--nutui-brand-6) !default;
3+
$color-primary: var(--nutui-color-primary, #ff0f23) !default;
44
$color-primary-stop-1: var(--nutui-color-primary-stop-1, #ff475d) !default;
55
$color-primary-stop-2: var(--nutui-color-primary-stop-2, #ff0f23) !default;
66
$color-primary-pressed: var(--nutui-color-primary-pressed, #e53029) !default;
77
$color-primary-disabled: var(--nutui-color-primary-disabled, #c2c4cc) !default;
8-
$color-primary-disabled-special: var(--nutui-brand-3) !default;
9-
$color-primary-light-pressed: var(--nutui-brand-1) !default;
8+
$color-primary-disabled-special: var(
9+
--nutui-color-primary-disabled-special,
10+
#ffadbe
11+
) !default;
12+
$color-primary-light-pressed: var(
13+
--nutui-color-primary-light-pressed,
14+
#ffebf1
15+
) !default;
1016
$color-primary-gradient-1: linear-gradient(
1117
135deg,
1218
$color-primary-stop-1 0%,
@@ -40,61 +46,91 @@ $color-info-background: var(
4046
$color-info-text: var(--nutui-color-info, #0073ff) !default; // done
4147

4248
// 成功色
43-
$color-success: var(--nutui-green-2) !default; // done
44-
$color-success-pressed: var(--nutui-green-3) !default; // done
49+
$color-success: var(--nutui-color-success, #00d900) !default; // done
50+
$color-success-pressed: var(
51+
--nutui-color-success-pressed,
52+
#2aa32a
53+
) !default; // done
4554
$color-success-disabled: var(--nutui-color-success-disabled, #b2f0ae) !default;
46-
$color-success-light: var(--nutui-green-1) !default; // done
47-
$color-success-background: var(--nutui-green-2) !default; // done
48-
$color-success-text: var(--nutui-green-3) !default; // done
55+
$color-success-light: var(
56+
--nutui-color-success-light,
57+
#ebfbeb
58+
) !default; // done
59+
$color-success-background: var(
60+
--nutui-color-success-background,
61+
#00d900
62+
) !default; // done
63+
$color-success-text: var(--nutui-color-success-text, #2aa32a) !default; // done
4964

5065
// 警告色
51-
$color-warning: var(--nutui-yellow-2) !default; // done
52-
$color-warning-pressed: var(--nutui-yellow-3) !default; // done
66+
$color-warning: var(--nutui-color-warning, #ffbf00) !default; // done
67+
$color-warning-pressed: var(
68+
--nutui-color-warning-pressed,
69+
#c47600
70+
) !default; // done
5371
$color-warning-disabled: var(--nutui-color-warning-disabled, #fdd3b9) !default;
54-
$color-warning-light: var(--nutui-yellow-1) !default; // done
55-
$color-warning-background: var(--nutui-yellow-2) !default; // done
56-
$color-warning-text: var(--nutui-yellow-3) !default; // done
72+
$color-warning-light: var(
73+
--nutui-color-warning-light,
74+
#fff5cc
75+
) !default; // done
76+
$color-warning-background: var(
77+
--nutui-color-warning-background,
78+
#ffbf00
79+
) !default; // done
80+
$color-warning-text: var(--nutui-color-warning-text, #c47600) !default; // done
5781

5882
// 危险色
59-
$color-danger: var(--nutui-red-2) !default; //done
60-
$color-danger-pressed: var(--nutui-color-danger-pressed) !default;
83+
$color-danger: var(--nutui-color-danger, #ff0f23) !default; //done
84+
$color-danger-pressed: var(--nutui-color-danger-pressed, #ff3333) !default;
6185
$color-danger-disabled: var(
6286
--nutui-color-danger-disabled,
6387
$color-primary-disabled-special
6488
) !default;
65-
$color-danger-light: var(--nutui-red-1) !default; //done
66-
$color-danger-background: var(--nutui-color-danger-background) !default; //done
67-
$color-danger-text: var(--nutui-red-2) !default; //done
89+
$color-danger-light: var(--nutui-color-danger-light, #ffebef) !default; //done
90+
$color-danger-background: var(
91+
--nutui-color-danger-background,
92+
#ff0f23
93+
) !default; //done
94+
$color-danger-text: var(--nutui-color-danger-text, #ff0f23) !default; //done
6895

6996
// 背景色
70-
$color-background: var(--nutui-gray-3) !default; //done
97+
$color-background: var(--nutui-color-background, #f2f3f5) !default; //done
7198
// 卡片背景色
72-
$color-background-overlay: var(--nutui-gray-1) !default;
99+
$color-background-overlay: var(
100+
--nutui-color-background-overlay,
101+
#ffffff
102+
) !default;
73103
// 卡片内嵌背景色
74104
$color-background-sunken: var(
75105
--nutui-color-background-sunken,
76-
var(--nutui-gray-2)
106+
#f7f8fc
77107
) !default;
78108

79109
// 蒙层颜色
80110
// 页面全局蒙层
81-
$color-mask: var(--nutui-black-10) !default;
111+
$color-mask: var(--nutui-color-mask, rgba(0, 0, 0, 0.7)) !default;
82112
// 局部蒙层
83-
$color-mask-part: var(--nutui-black-7) !default;
113+
$color-mask-part: var(--nutui-color-mask-part, rgba(0, 0, 0, 0.4)) !default;
84114
// 容错蒙层
85-
$color-mask-fault-toleran: var(--nutui-black-2) !default;
115+
$color-mask-fault-toleran: var(
116+
--nutui-color-mask-fault-toleran,
117+
rgba(0, 0, 0, 0.02)
118+
) !default;
86119

87120
// 边框色
88-
$color-border: var(--nutui-black-3) !default;
89-
$color-border-disabled: var(--nutui-gray-4) !default;
121+
$color-border: var(--nutui-color-border, rgba(0, 0, 0, 0.06)) !default;
122+
$color-border-disabled: var(--nutui-color-border-disabled, #c2c4cc) !default;
90123

91124
// 文本色
92-
$color-title: var(--nutui-gray-7) !default;
93-
$color-text: var(--nutui-gray-6) !default;
94-
$color-text-help: var(--nutui-gray-5) !default;
95-
$color-text-disabled: var(--nutui-gray-4) !default;
96-
$color-text-dark: var(--nutui-white-12) !default;
97-
$color-text-link: var(--nutui-blue-2) !default;
125+
$color-title: var(--nutui-color-title, #1a1a1a) !default;
126+
$color-text: var(--nutui-color-text, #505259) !default;
127+
$color-text-help: var(--nutui-color-text-help, #888b94) !default;
128+
$color-text-disabled: var(--nutui-color-text-disabled, #c2c4cc) !default;
129+
$color-text-dark: var(
130+
--nutui-color-text-dark,
131+
rgba(255, 255, 255, 0.9)
132+
) !default;
133+
$color-text-link: var(--nutui-color-text-link, #0073ff) !default;
98134

99135
// 与品牌色一起使用，默认为白色，不区分暗黑与明亮模式。
100136
$color-primary-text: #ffffff !default;

0 commit comments

Comments
 (0)