Skip to content

Commit 6db44ea

Browse files
irisSongirisSong
committed
fix: cr修改
1 parent 320ca50 commit 6db44ea

File tree

10 files changed

+81
-116
lines changed

10 files changed

+81
-116
lines changed

‎src/packages/steps/demos/h5/demo9.tsx‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,12 @@ const Demo9 = () => {
88
const newVal = (value % 3) + 1
99
setValue(newVal)
1010
}
11+
const timeCustomStyle = {
12+
marginTop: '2px',
13+
color: '#808080',
14+
fontSize: '12px',
15+
lineHeight: '18px',
16+
}
1117
return (
1218
<>
1319
<Cell>
@@ -27,7 +33,7 @@ const Demo9 = () => {
2733
你的订单已由【深圳市福田区福华路京东快递自
2834
提点】上架完成，请上门自提
2935
</p>
30-
<p className="description-time">2025-01-20 07:12:30</p>
36+
<p style={timeCustomStyle}>2025-01-20 07:12:30</p>
3137
</>
3238
}
3339
icon={<WaitReceive />}
@@ -39,7 +45,7 @@ const Demo9 = () => {
3945
description={
4046
<>
4147
<p>订单在【淮安分拣中心】完成分拣</p>
42-
<p className="description-time">2025-01-20 07:12:30</p>
48+
<p style={timeCustomStyle}>2025-01-20 07:12:30</p>
4349
</>
4450
}
4551
icon={<PickedUp />}
@@ -54,8 +60,8 @@ const Demo9 = () => {
5460
title="待安装 工程师已接单"
5561
description={
5662
<>
57-
<p>已分配工程师 XXX 为您服务，联系电话 15112786087</p>
58-
<p className="description-time">2025-01-20 07:12:30</p>
63+
<p>已分配工程师 XXX 为您服务，联系电话 136 **** 8618</p>
64+
<p style={timeCustomStyle}>2025-01-20 07:12:30</p>
5965
</>
6066
}
6167
icon={<Service />}
@@ -67,7 +73,7 @@ const Demo9 = () => {
6773
description={
6874
<>
6975
<p>京东快递 · 您的订单派送完成，已由家人签收</p>
70-
<p className="description-time">2025-01-20 07:12:30</p>
76+
<p style={timeCustomStyle}>2025-01-20 07:12:30</p>
7177
</>
7278
}
7379
icon={<Check />}

‎src/packages/steps/demos/taro/demo9.tsx‎

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { useState } from 'react'
2-
import { Steps, Step, Button, Cell } from '@nutui/nutui-react-taro'
2+
import { Steps, Step, Button, Cell, pxTransform } from '@nutui/nutui-react-taro'
33
import { Check, PickedUp, Service, WaitReceive } from '@nutui/icons-react-taro'
44

55
const Demo9 = () => {
@@ -8,6 +8,14 @@ const Demo9 = () => {
88
const newVal = (value % 3) + 1
99
setValue(newVal)
1010
}
11+
12+
const timeCustomStyle = {
13+
marginTop: pxTransform(2),
14+
color: '#808080',
15+
fontSize: pxTransform(12),
16+
lineHeight: pxTransform(18),
17+
}
18+
1119
return (
1220
<>
1321
<Cell>
@@ -27,7 +35,7 @@ const Demo9 = () => {
2735
你的订单已由【深圳市福田区福华路京东快递自
2836
提点】上架完成，请上门自提
2937
</p>
30-
<p className="description-time">2025-01-20 07:12:30</p>
38+
<p style={timeCustomStyle}>2025-01-20 07:12:30</p>
3139
</>
3240
}
3341
icon={<WaitReceive />}
@@ -39,7 +47,7 @@ const Demo9 = () => {
3947
description={
4048
<>
4149
<p>订单在【淮安分拣中心】完成分拣</p>
42-
<p className="description-time">2025-01-20 07:12:30</p>
50+
<p style={timeCustomStyle}>2025-01-20 07:12:30</p>
4351
</>
4452
}
4553
icon={<PickedUp />}
@@ -54,8 +62,8 @@ const Demo9 = () => {
5462
title="待安装 工程师已接单"
5563
description={
5664
<>
57-
<p>已分配工程师 XXX 为您服务，联系电话 15112786087</p>
58-
<p className="description-time">2025-01-20 07:12:30</p>
65+
<p>已分配工程师 XXX 为您服务，联系电话 136 **** 8618</p>
66+
<p style={timeCustomStyle}>2025-01-20 07:12:30</p>
5967
</>
6068
}
6169
icon={<Service />}
@@ -67,7 +75,7 @@ const Demo9 = () => {
6775
description={
6876
<>
6977
<p>京东快递 · 您的订单派送完成，已由家人签收</p>
70-
<p className="description-time">2025-01-20 07:12:30</p>
78+
<p style={timeCustomStyle}>2025-01-20 07:12:30</p>
7179
</>
7280
}
7381
icon={<Check />}

‎src/packages/steps/doc.en-US.md‎

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,7 @@ The component provides the following CSS variables, which can be used to customi
117117

118118
| Name | Description | Default |
119119
| --- | --- | --- |
120+
| \--nutui-steps-background-color | Steps background color | `$white` |
120121
| \--nutui-steps-base-head-height | Head height | `14px` |
121122
| \--nutui-steps-base-head-background-color | Head background color | `$color-background` |
122123
| \--nutui-steps-base-head-border | Head border | `none` |
@@ -144,14 +145,14 @@ The component provides the following CSS variables, which can be used to customi
144145
| \--nutui-steps-wait-title-color | Waiting state title color | `$color-title` |
145146
| \--nutui-steps-wait-description-color | Waiting state description color | `$color-text` |
146147
| \--nutui-steps-finish-icon-color | Finish state icon color | `$color-text-help` |
147-
| \--nutui-steps-business-title-color | Business state title color | `#994d00` |
148-
| \--nutui-steps-business-description-color | Business state description color | `#994d00` |
149-
| \--nutui-steps-business-head-text-color | Business state head text color | `#994d00` |
150-
| \--nutui-steps-business-head-dot-background-color | Business state head dot background color | `#994d00` |
151-
| \--nutui-steps-business-head-icon-color | Business state head icon color | `#994d00` |
152-
| \--nutui-steps-business-head-background-color | Business state head background color | `#fff4e8` |
148+
| \--nutui-steps-business-title-color | Business state title color | `var(--nutui-color-service-pressed)` |
149+
| \--nutui-steps-business-description-color | Business state description color | `var(--nutui-color-service-pressed)` |
150+
| \--nutui-steps-business-head-text-color | Business state head text color | `var(--nutui-color-service-pressed)` |
151+
| \--nutui-steps-business-head-dot-background-color | Business state head dot background color | `var(--nutui-color-service-pressed)` |
152+
| \--nutui-steps-business-head-icon-color | Business state head icon color | `var(--nutui-color-service-pressed)` |
153+
| \--nutui-steps-business-head-background-color | Business state head background color | `var(--nutui-color-service)` |
153154
| \--nutui-steps-enhanced-finish-head-background-color | Enhanced finish state head background color | `$color-primary-light-pressed` |
154-
| \--nutui-steps-enhanced-finish-head-dot-background-color | Enhanced finish state head dot background color | `#ffadbe` |
155+
| \--nutui-steps-enhanced-finish-head-dot-background-color | Enhanced finish state head dot background color | `$color-primary-disabled-special` |
155156
| \--nutui-steps-enhanced-finish-head-icon-color | Enhanced finish state head icon color | `$color-primary-stop-1` |
156157
| \--nutui-steps-enhanced-finish-head-text-color | Enhanced finish state head text color | `$color-primary-stop-1` |
157158
| \--nutui-steps-horizontal-item-padding-right | Horizontal item right padding | `28px` |
@@ -164,8 +165,5 @@ The component provides the following CSS variables, which can be used to customi
164165
| \--nutui-steps-vertical-line-height | Vertical line height | `18px` |
165166
| \--nutui-steps-vertical-description-font-size | Vertical description font size | `$font-size-base` |
166167
| \--nutui-steps-vertical-description-margin | Vertical description margin | `0 0 1px` |
167-
| \--nutui-steps-vertical-description-time-font-size | Vertical description time font size | `$font-size-s` |
168-
| \--nutui-steps-vertical-description-time-margin-top | Vertical description time top margin | `2px` |
169-
| \--nutui-steps-vertical-description-time-color | Vertical description time color | `#808080` |
170168

171169
<Contribution name="Steps" />

‎src/packages/steps/doc.md‎

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,7 @@ import { Steps } from '@nutui/nutui-react'
117117

118118
| 名称 | 说明 | 默认值 |
119119
| --- | --- | --- |
120+
| \--nutui-steps-background-color | 步骤条背景色 | `$white` |
120121
| \--nutui-steps-base-head-height | 头部高度 | `14px` |
121122
| \--nutui-steps-base-head-background-color | 头部背景色 | `$color-background` |
122123
| \--nutui-steps-base-head-border | 头部边框 | `none` |
@@ -144,14 +145,14 @@ import { Steps } from '@nutui/nutui-react'
144145
| \--nutui-steps-wait-title-color | 等待状态标题颜色 | `$color-title` |
145146
| \--nutui-steps-wait-description-color | 等待状态描述颜色 | `$color-text` |
146147
| \--nutui-steps-finish-icon-color | 完成状态图标颜色 | `$color-text-help` |
147-
| \--nutui-steps-business-title-color | 业务状态标题颜色 | `#994d00` |
148-
| \--nutui-steps-business-description-color | 业务状态描述颜色 | `#994d00` |
149-
| \--nutui-steps-business-head-text-color | 业务状态头部文字颜色 | `#994d00` |
150-
| \--nutui-steps-business-head-dot-background-color | 业务状态头部点状背景色 | `#994d00` |
151-
| \--nutui-steps-business-head-icon-color | 业务状态头部图标颜色 | `#994d00` |
152-
| \--nutui-steps-business-head-background-color | 业务状态头部背景色 | `#fff4e8` |
148+
| \--nutui-steps-business-title-color | 业务状态标题颜色 | `var(--nutui-color-service-pressed)` |
149+
| \--nutui-steps-business-description-color | 业务状态描述颜色 | `var(--nutui-color-service-pressed)` |
150+
| \--nutui-steps-business-head-text-color | 业务状态头部文字颜色 | `var(--nutui-color-service-pressed)` |
151+
| \--nutui-steps-business-head-dot-background-color | 业务状态头部点状背景色 | `var(--nutui-color-service-pressed)` |
152+
| \--nutui-steps-business-head-icon-color | 业务状态头部图标颜色 | `var(--nutui-color-service-pressed)` |
153+
| \--nutui-steps-business-head-background-color | 业务状态头部背景色 | `var(--nutui-color-service)` |
153154
| \--nutui-steps-enhanced-finish-head-background-color | 增强完成状态头部背景色 | `$color-primary-light-pressed` |
154-
| \--nutui-steps-enhanced-finish-head-dot-background-color | 增强完成状态头部点状背景色 | `#ffadbe` |
155+
| \--nutui-steps-enhanced-finish-head-dot-background-color | 增强完成状态头部点状背景色 | `$color-primary-disabled-special` |
155156
| \--nutui-steps-enhanced-finish-head-icon-color | 增强完成状态头部图标颜色 | `$color-primary-stop-1` |
156157
| \--nutui-steps-enhanced-finish-head-text-color | 增强完成状态头部文字颜色 | `$color-primary-stop-1` |
157158
| \--nutui-steps-horizontal-item-padding-right | 水平项右内边距 | `28px` |
@@ -164,8 +165,5 @@ import { Steps } from '@nutui/nutui-react'
164165
| \--nutui-steps-vertical-line-height | 垂直行高 | `18px` |
165166
| \--nutui-steps-vertical-description-font-size | 垂直描述字号 | `$font-size-base` |
166167
| \--nutui-steps-vertical-description-margin | 垂直描述边距 | `0 0 1px` |
167-
| \--nutui-steps-vertical-description-time-font-size | 垂直描述时间字号 | `$font-size-s` |
168-
| \--nutui-steps-vertical-description-time-margin-top | 垂直描述时间上边距 | `2px` |
169-
| \--nutui-steps-vertical-description-time-color | 垂直描述时间颜色 | `#808080` |
170168

171169
<Contribution name="Steps" />

‎src/packages/steps/doc.taro.md‎

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,7 @@ import { Steps } from '@nutui/nutui-react-taro'
117117

118118
| 名称 | 说明 | 默认值 |
119119
| --- | --- | --- |
120+
| \--nutui-steps-background-color | 步骤条背景色 | `$white` |
120121
| \--nutui-steps-base-head-height | 头部高度 | `14px` |
121122
| \--nutui-steps-base-head-background-color | 头部背景色 | `$color-background` |
122123
| \--nutui-steps-base-head-border | 头部边框 | `none` |
@@ -144,14 +145,14 @@ import { Steps } from '@nutui/nutui-react-taro'
144145
| \--nutui-steps-wait-title-color | 等待状态标题颜色 | `$color-title` |
145146
| \--nutui-steps-wait-description-color | 等待状态描述颜色 | `$color-text` |
146147
| \--nutui-steps-finish-icon-color | 完成状态图标颜色 | `$color-text-help` |
147-
| \--nutui-steps-business-title-color | 业务状态标题颜色 | `#994d00` |
148-
| \--nutui-steps-business-description-color | 业务状态描述颜色 | `#994d00` |
149-
| \--nutui-steps-business-head-text-color | 业务状态头部文字颜色 | `#994d00` |
150-
| \--nutui-steps-business-head-dot-background-color | 业务状态头部点状背景色 | `#994d00` |
151-
| \--nutui-steps-business-head-icon-color | 业务状态头部图标颜色 | `#994d00` |
152-
| \--nutui-steps-business-head-background-color | 业务状态头部背景色 | `#fff4e8` |
148+
| \--nutui-steps-business-title-color | 业务状态标题颜色 | `var(--nutui-color-service-pressed)` |
149+
| \--nutui-steps-business-description-color | 业务状态描述颜色 | `var(--nutui-color-service-pressed)` |
150+
| \--nutui-steps-business-head-text-color | 业务状态头部文字颜色 | `var(--nutui-color-service-pressed)` |
151+
| \--nutui-steps-business-head-dot-background-color | 业务状态头部点状背景色 | `var(--nutui-color-service-pressed)` |
152+
| \--nutui-steps-business-head-icon-color | 业务状态头部图标颜色 | `var(--nutui-color-service-pressed)` |
153+
| \--nutui-steps-business-head-background-color | 业务状态头部背景色 | `var(--nutui-color-service)` |
153154
| \--nutui-steps-enhanced-finish-head-background-color | 增强完成状态头部背景色 | `$color-primary-light-pressed` |
154-
| \--nutui-steps-enhanced-finish-head-dot-background-color | 增强完成状态头部点状背景色 | `#ffadbe` |
155+
| \--nutui-steps-enhanced-finish-head-dot-background-color | 增强完成状态头部点状背景色 | `$color-primary-disabled-special` |
155156
| \--nutui-steps-enhanced-finish-head-icon-color | 增强完成状态头部图标颜色 | `$color-primary-stop-1` |
156157
| \--nutui-steps-enhanced-finish-head-text-color | 增强完成状态头部文字颜色 | `$color-primary-stop-1` |
157158
| \--nutui-steps-horizontal-item-padding-right | 水平项右内边距 | `28px` |
@@ -164,8 +165,5 @@ import { Steps } from '@nutui/nutui-react-taro'
164165
| \--nutui-steps-vertical-line-height | 垂直行高 | `18px` |
165166
| \--nutui-steps-vertical-description-font-size | 垂直描述字号 | `$font-size-base` |
166167
| \--nutui-steps-vertical-description-margin | 垂直描述边距 | `0 0 1px` |
167-
| \--nutui-steps-vertical-description-time-font-size | 垂直描述时间字号 | `$font-size-s` |
168-
| \--nutui-steps-vertical-description-time-margin-top | 垂直描述时间上边距 | `2px` |
169-
| \--nutui-steps-vertical-description-time-color | 垂直描述时间颜色 | `#808080` |
170168

171169
<Contribution name="Steps" />

‎src/packages/steps/doc.zh-TW.md‎

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,7 @@ import { Steps } from '@nutui/nutui-react'
117117

118118
| 名稱 | 說明 | 默認值 |
119119
| --- | --- | --- |
120+
| \--nutui-steps-background-color | 步驟條背景色 | `$white` |
120121
| \--nutui-steps-base-head-height | 頭部高度 | `14px` |
121122
| \--nutui-steps-base-head-background-color | 頭部背景色 | `$color-background` |
122123
| \--nutui-steps-base-head-border | 頭部邊框 | `none` |
@@ -144,14 +145,14 @@ import { Steps } from '@nutui/nutui-react'
144145
| \--nutui-steps-wait-title-color | 等待狀態標題顏色 | `$color-title` |
145146
| \--nutui-steps-wait-description-color | 等待狀態描述顏色 | `$color-text` |
146147
| \--nutui-steps-finish-icon-color | 完成狀態圖標顏色 | `$color-text-help` |
147-
| \--nutui-steps-business-title-color | 業務狀態標題顏色 | `#994d00` |
148-
| \--nutui-steps-business-description-color | 業務狀態描述顏色 | `#994d00` |
149-
| \--nutui-steps-business-head-text-color | 業務狀態頭部文字顏色 | `#994d00` |
150-
| \--nutui-steps-business-head-dot-background-color | 業務狀態頭部點狀背景色 | `#994d00` |
151-
| \--nutui-steps-business-head-icon-color | 業務狀態頭部圖標顏色 | `#994d00` |
152-
| \--nutui-steps-business-head-background-color | 業務狀態頭部背景色 | `#fff4e8` |
148+
| \--nutui-steps-business-title-color | 業務狀態標題顏色 | `var(--nutui-color-service-pressed)` |
149+
| \--nutui-steps-business-description-color | 業務狀態描述顏色 | `var(--nutui-color-service-pressed)` |
150+
| \--nutui-steps-business-head-text-color | 業務狀態頭部文字顏色 | `var(--nutui-color-service-pressed)` |
151+
| \--nutui-steps-business-head-dot-background-color | 業務狀態頭部點狀背景色 | `var(--nutui-color-service-pressed)` |
152+
| \--nutui-steps-business-head-icon-color | 業務狀態頭部圖標顏色 | `var(--nutui-color-service-pressed)` |
153+
| \--nutui-steps-business-head-background-color | 業務狀態頭部背景色 | `var(--nutui-color-service)` |
153154
| \--nutui-steps-enhanced-finish-head-background-color | 增強完成狀態頭部背景色 | `$color-primary-light-pressed` |
154-
| \--nutui-steps-enhanced-finish-head-dot-background-color | 增強完成狀態頭部點狀背景色 | `#ffadbe` |
155+
| \--nutui-steps-enhanced-finish-head-dot-background-color | 增強完成狀態頭部點狀背景色 | `$color-primary-disabled-special` |
155156
| \--nutui-steps-enhanced-finish-head-icon-color | 增強完成狀態頭部圖標顏色 | `$color-primary-stop-1` |
156157
| \--nutui-steps-enhanced-finish-head-text-color | 增強完成狀態頭部文字顏色 | `$color-primary-stop-1` |
157158
| \--nutui-steps-horizontal-item-padding-right | 水平項右內邊距 | `28px` |
@@ -164,8 +165,5 @@ import { Steps } from '@nutui/nutui-react'
164165
| \--nutui-steps-vertical-line-height | 垂直行高 | `18px` |
165166
| \--nutui-steps-vertical-description-font-size | 垂直描述字號 | `$font-size-base` |
166167
| \--nutui-steps-vertical-description-margin | 垂直描述邊距 | `0 0 1px` |
167-
| \--nutui-steps-vertical-description-time-font-size | 垂直描述時間字號 | `$font-size-s` |
168-
| \--nutui-steps-vertical-description-time-margin-top | 垂直描述時間上邊距 | `2px` |
169-
| \--nutui-steps-vertical-description-time-color | 垂直描述時間顏色 | `#808080` |
170168

171169
<Contribution name="Steps" />

‎src/packages/steps/steps.scss‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -240,16 +240,9 @@
240240
margin: $steps-vertical-description-margin;
241241
height: auto;
242242
line-height: $steps-vertical-line-height;
243-
color: $color-text;
243+
color: $color-title;
244244
font-size: $steps-vertical-description-font-size;
245245
box-sizing: border-box;
246-
247-
.description-time {
248-
margin-top: $steps-vertical-description-time-margin-top;
249-
color: $steps-vertical-description-time-color;
250-
font-size: $steps-vertical-description-time-font-size;
251-
line-height: $steps-vertical-line-height;
252-
}
253246
}
254247

255248
&-head-dot-wrap,

0 commit comments

Comments
 (0)