Skip to content

Commit dc1cd7f

Browse files
qifeng0748qifeng0748
committed
Merge branch 'dev'
2 parents 4ef64d3 + 480e25e commit dc1cd7f

File tree

54 files changed

+434
-222
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

54 files changed

+434
-222
lines changed

‎CHANGELOG.en-US.md‎

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,26 @@
22
title: Change Log
33
toc: hidden
44
---
5+
### 2.6.1
6+
7+
`2022-02-02`
8+
9+
- Design
10+
- 🍭 Financial design specification update
11+
- `CheckBox` Updated font color, border color, background color
12+
13+
- Feature
14+
- `Check`、`Radio`
15+
- `CheckBox`、`RadioBox` added the option to select corner position
16+
- `Icon`
17+
- By default, using SVG format in Apple [Lockdown Mode](https://support.apple.com/zh-cn/HT212650), could not use web fonts
18+
519
### 2.6.0
620

721
`2022-08-26`
822

923
- Design
10-
- 🍭Financial design specification update,
24+
- 🍭 Financial design specification update
1125
- Update the theme color, [detail](https://github.com/didi/mand-mobile/pull/755/files#diff-dafec5882d1f310bec1be2ca7fb586a99589509362a07d650e827813eee6136a)
1226
- `Toast` the background color was changed from translucent to opaque
1327
- `Button` border radius changed from '4px' to '16px'

‎CHANGELOG.md‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,20 @@ title: 更新日志
33
toc: hidden
44
---
55

6+
### 2.6.1
7+
8+
`2022-02-02`
9+
10+
- Design
11+
- 🍭金融设计规范更新
12+
- `CheckBox` 更新字体颜色、边框、背景色颜色
13+
14+
- Feature
15+
- `Check`、`Radio`
16+
- `CheckBox`、`RadioBox` 增加选中角标位置选项
17+
- `Icon`
18+
- 默认使用 SVG 格式，在 Apple [锁定模式](https://support.apple.com/zh-cn/HT212650)中，无法使用网页字体
19+
620
### 2.6.0
721

822
`2022-08-26`

‎components/_style/mixin/theme.components.styl‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -117,14 +117,19 @@ cell-item-border-color = color-border-base
117117

118118
/// check
119119
check-color = color-text-highlight
120-
121-
checkbox-color = color-text-base
120+
// checkbox-color = color-text-base
121+
checkbox-color = #61686F
122122
checkbox-font-size = font-caption-normal
123-
checkbox-disabled-color = color-text-disabled
123+
// checkbox-disabled-color = color-text-disabled
124+
checkbox-disabled-color = #C1C8CF
124125
checkbox-active-color = color-primary
125126
checkbox-active-border-color = color-primary
126-
checkbox-border-color = color-border-element
127+
// checkbox-border-color = color-border-element
128+
checkbox-border-color = #C1C8CF
127129
checkbox-border-radius = radius-normal
130+
checkbox-background-color = #FFFFFF
131+
checkbox-disabled-background-color = rgba(0,0,0,0.04)
132+
checkbox-active-background-color = rgba(25,140,255,0.06)
128133

129134
/// codebox
130135
codebox-font-size = 50px

‎components/_style/mixin/theme.variable.styl‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -151,6 +151,9 @@ checkbox-active-color = var(--checkbox-active-color)
151151
checkbox-active-border-color = var(--checkbox-active-border-color)
152152
checkbox-border-color = var(--checkbox-border-color)
153153
checkbox-border-radius = var(--checkbox-border-radius)
154+
checkbox-background-color = var(--checkbox-background-color)
155+
checkbox-disabled-background-color = var(--checkbox-disabled-background-color)
156+
checkbox-active-background-color = var(--checkbox-active-background-color)
154157
codebox-font-size = var(--codebox-font-size)
155158
codebox-width = var(--codebox-width)
156159
codebox-height = var(--codebox-height)

‎components/agree/index.vue‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -95,9 +95,6 @@ export default {
9595
position relative
9696
.md-icon
9797
display flex
98-
width auto
99-
height auto
100-
line-height 1
10198
will-change auto
10299
&.md-icon-checked,&.md-icon-square-checked
103100
position absolute

‎components/agree/test/__snapshots__/demo.spec.js.snap‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ exports[`Agree - Demo Disabled selected 1`] = `
44
<div class="md-example-child md-example-child-agree md-example-child-2">
55
<div class="md-agree disabled">
66
<div class="md-agree-icon checked">
7-
<div class="md-agree-icon-container"><span><i class="md-icon icon-font md-icon-checked checked md" style="color:;"></i> <i class="md-icon icon-font md-icon-check check md" style="color:;"></i></span></div>
7+
<div class="md-agree-icon-container"><span><svg class="md-icon icon-svg md-icon-checked md" style="fill:;"><use xlink:href="#checked"></use></svg> <svg class="md-icon icon-svg md-icon-check md" style="fill:;"><use xlink:href="#check"></use></svg></span></div>
88
</div>
99
<div class="md-agree-content">
1010
本人承诺投保人已充分了解本保险产品，并保证投保信息的真实性，理解并同意
@@ -17,7 +17,7 @@ exports[`Agree - Demo Disabled unselected 1`] = `
1717
<div class="md-example-child md-example-child-agree md-example-child-3">
1818
<div class="md-agree disabled">
1919
<div class="md-agree-icon">
20-
<div class="md-agree-icon-container"><span><i class="md-icon icon-font md-icon-checked checked md" style="color:;"></i> <i class="md-icon icon-font md-icon-check check md" style="color:;"></i></span></div>
20+
<div class="md-agree-icon-container"><span><svg class="md-icon icon-svg md-icon-checked md" style="fill:;"><use xlink:href="#checked"></use></svg> <svg class="md-icon icon-svg md-icon-check md" style="fill:;"><use xlink:href="#check"></use></svg></span></div>
2121
</div>
2222
<div class="md-agree-content">
2323
本人承诺投保人已充分了解本保险产品，并保证投保信息的真实性，理解并同意
@@ -30,7 +30,7 @@ exports[`Agree - Demo Selected 1`] = `
3030
<div class="md-example-child md-example-child-agree md-example-child-0">
3131
<div class="md-agree">
3232
<div class="md-agree-icon checked">
33-
<div class="md-agree-icon-container"><span><i class="md-icon icon-font md-icon-checked checked md" style="color:;"></i> <i class="md-icon icon-font md-icon-check check md" style="color:;"></i></span></div>
33+
<div class="md-agree-icon-container"><span><svg class="md-icon icon-svg md-icon-checked md" style="fill:;"><use xlink:href="#checked"></use></svg> <svg class="md-icon icon-svg md-icon-check md" style="fill:;"><use xlink:href="#check"></use></svg></span></div>
3434
</div>
3535
<div class="md-agree-content">
3636
本人承诺投保人已充分了解本保险产品，并保证投保信息的真实性，理解并同意<a>《投保须知》</a>, <a>《保险条款》</a></div>
@@ -42,7 +42,7 @@ exports[`Agree - Demo Square check box selected state 1`] = `
4242
<div class="md-example-child md-example-child-agree md-example-child-0">
4343
<div class="md-agree">
4444
<div class="md-agree-icon checked">
45-
<div class="md-agree-icon-container"><span><i class="md-icon icon-font md-icon-square-checked square-checked md" style="color:;"></i> <i class="md-icon icon-font md-icon-square-check square-check md" style="color:;"></i></span></div>
45+
<div class="md-agree-icon-container"><span><svg class="md-icon icon-svg md-icon-square-checked md" style="fill:;"><use xlink:href="#square-checked"></use></svg> <svg class="md-icon icon-svg md-icon-square-check md" style="fill:;"><use xlink:href="#square-check"></use></svg></span></div>
4646
</div>
4747
<div class="md-agree-content">
4848
本人承诺投保人已充分了解本保险产品，并保证投保信息的真实性，理解并同意<a>《投保须知》</a>, <a>《保险条款》</a></div>
@@ -54,7 +54,7 @@ exports[`Agree - Demo Square check box unselected state 1`] = `
5454
<div class="md-example-child md-example-child-agree md-example-child-1">
5555
<div class="md-agree">
5656
<div class="md-agree-icon">
57-
<div class="md-agree-icon-container"><span><i class="md-icon icon-font md-icon-square-checked square-checked md" style="color:;"></i> <i class="md-icon icon-font md-icon-square-check square-check md" style="color:;"></i></span></div>
57+
<div class="md-agree-icon-container"><span><svg class="md-icon icon-svg md-icon-square-checked md" style="fill:;"><use xlink:href="#square-checked"></use></svg> <svg class="md-icon icon-svg md-icon-square-check md" style="fill:;"><use xlink:href="#square-check"></use></svg></span></div>
5858
</div>
5959
<div class="md-agree-content">
6060
本人承诺投保人已充分了解本保险产品，并保证投保信息的真实性，理解并同意
@@ -67,7 +67,7 @@ exports[`Agree - Demo Unselected 1`] = `
6767
<div class="md-example-child md-example-child-agree md-example-child-1">
6868
<div class="md-agree">
6969
<div class="md-agree-icon">
70-
<div class="md-agree-icon-container"><span><i class="md-icon icon-font md-icon-checked checked md" style="color:;"></i> <i class="md-icon icon-font md-icon-check check md" style="color:;"></i></span></div>
70+
<div class="md-agree-icon-container"><span><svg class="md-icon icon-svg md-icon-checked md" style="fill:;"><use xlink:href="#checked"></use></svg> <svg class="md-icon icon-svg md-icon-check md" style="fill:;"><use xlink:href="#check"></use></svg></span></div>
7171
</div>
7272
<div class="md-agree-content">
7373
本人承诺投保人已充分了解本保险产品，并保证投保信息的真实性，理解并同意

‎components/button/test/__snapshots__/demo.spec.js.snap‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -160,7 +160,9 @@ exports[`Button Text link 1`] = `
160160
</button> <button type="button" disabled="disabled" class="md-button link inactive block">
161161
<div class="md-button-inner">
162162
<!---->
163-
<div class="md-button-content">去看看<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
163+
<div class="md-button-content">去看看<svg class="md-icon icon-svg md-icon-arrow md" style="fill:;">
164+
<use xlink:href="#arrow"></use>
165+
</svg></div>
164166
</div>
165167
</button></div>
166168
`;

‎components/captcha/test/__snapshots__/demo.spec.js.snap‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,9 @@ exports[`Captcha - Demo Customize 1`] = `
88
<div name="md-mask-fade" class="md-popup-mask" style="display:none;"></div>
99
<div name="md-fade" class="md-popup-box md-fade" style="display:none;">
1010
<div class="md-dialog-content">
11-
<div class="md-dialog-body"><a role="button" class="md-dialog-close"><i class="md-icon icon-font md-icon-close close md" style="color:;"></i></a>
11+
<div class="md-dialog-body"><a role="button" class="md-dialog-close"><svg class="md-icon icon-svg md-icon-close md" style="fill:;">
12+
<use xlink:href="#close"></use>
13+
</svg></a>
1214
<!---->
1315
<!---->
1416
<div class="md-captcha-content">

‎components/cashier/test/__snapshots__/demo.spec.js.snap‎

Lines changed: 30 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,9 @@ exports[`Cashier - Demo Baisc-captcha 1`] = `
1212
<!---->
1313
</div>
1414
<!---->
15-
<div class="title-bar-right md-popup-close"><i class="md-icon icon-font md-icon-close close lg"></i></div>
15+
<div class="title-bar-right md-popup-close"><svg class="md-icon icon-svg md-icon-close lg">
16+
<use xlink:href="#close"></use>
17+
</svg></div>
1618
</div>
1719
<div class="md-cashier-container">
1820
<div class="md-cashier-block md-cashier-captcha">
@@ -73,7 +75,9 @@ exports[`Cashier - Demo Baisc-channel 1`] = `
7375
<!---->
7476
</div>
7577
<!---->
76-
<div class="title-bar-right md-popup-close"><i class="md-icon icon-font md-icon-close close lg" style="color:;"></i></div>
78+
<div class="title-bar-right md-popup-close"><svg class="md-icon icon-svg md-icon-close lg" style="fill:;">
79+
<use xlink:href="#close"></use>
80+
</svg></div>
7781
</div>
7882
<div class="md-cashier-container">
7983
<div class="md-cashier-block md-cashier-choose">
@@ -86,14 +90,18 @@ exports[`Cashier - Demo Baisc-channel 1`] = `
8690
<div class="choose-channel">
8791
<div class="choose-channel-list">
8892
<div class="md-cashier-channel-item default">
89-
<div class="item-icon cashier-icon-1"><i class="md-icon icon-font md-icon-cashier-icon-1 cashier-icon-1 lg" style="color:;"></i></div>
93+
<div class="item-icon cashier-icon-1"><svg class="md-icon icon-svg md-icon-cashier-icon-1 lg" style="fill:;">
94+
<use xlink:href="#cashier-icon-1"></use>
95+
</svg></div>
9096
<div class="item-label">
9197
<p class="title"><span>招商银行(0056)</span>
9298
<!---->
9399
</p>
94100
<!---->
95101
</div>
96-
<div class="item-check-icon"><i class="md-icon icon-font md-icon-checked checked md" style="color:;"></i></div>
102+
<div class="item-check-icon"><svg class="md-icon icon-svg md-icon-checked md" style="fill:;">
103+
<use xlink:href="#checked"></use>
104+
</svg></div>
97105
</div>
98106
</div>
99107
<div class="choose-channel-more">更多支付方式</div>
@@ -125,7 +133,9 @@ exports[`Cashier - Demo Baisc-fail 1`] = `
125133
<!---->
126134
</div>
127135
<!---->
128-
<div class="title-bar-right md-popup-close"><i class="md-icon icon-font md-icon-close close lg"></i></div>
136+
<div class="title-bar-right md-popup-close"><svg class="md-icon icon-svg md-icon-close lg">
137+
<use xlink:href="#close"></use>
138+
</svg></div>
129139
</div>
130140
<div class="md-cashier-container">
131141
<div class="md-cashier-block md-cashier-fail">
@@ -153,7 +163,9 @@ exports[`Cashier - Demo Baisc-success 1`] = `
153163
<!---->
154164
</div>
155165
<!---->
156-
<div class="title-bar-right md-popup-close"><i class="md-icon icon-font md-icon-close close lg"></i></div>
166+
<div class="title-bar-right md-popup-close"><svg class="md-icon icon-svg md-icon-close lg">
167+
<use xlink:href="#close"></use>
168+
</svg></div>
157169
</div>
158170
<div class="md-cashier-container">
159171
<div class="md-cashier-block md-cashier-success">
@@ -198,7 +210,9 @@ exports[`Cashier - Demo Using slots and other configurations 1`] = `
198210
<!---->
199211
</div>
200212
<!---->
201-
<div class="title-bar-right md-popup-close"><i class="md-icon icon-font md-icon-close close lg" style="color:;"></i></div>
213+
<div class="title-bar-right md-popup-close"><svg class="md-icon icon-svg md-icon-close lg" style="fill:;">
214+
<use xlink:href="#close"></use>
215+
</svg></div>
202216
</div>
203217
<div class="md-cashier-container">
204218
<div>
@@ -209,7 +223,9 @@ exports[`Cashier - Demo Using slots and other configurations 1`] = `
209223
该银行3:00-12:00系统维护，请更换其他银行卡
210224
</div>
211225
</div>
212-
<div class="md-notice-bar-right"><i class="md-icon icon-font md-notice-icon md-notice-icon-right md-icon-close close md" style="color:;"></i></div>
226+
<div class="md-notice-bar-right"><svg class="md-icon icon-svg md-notice-icon md-notice-icon-right md-icon-close md" style="fill:;">
227+
<use xlink:href="#close"></use>
228+
</svg></div>
213229
</div>
214230
</div>
215231
<div class="md-cashier-block md-cashier-choose">
@@ -222,12 +238,16 @@ exports[`Cashier - Demo Using slots and other configurations 1`] = `
222238
<div class="choose-channel">
223239
<div class="choose-channel-list">
224240
<div class="md-cashier-channel-item default">
225-
<div class="item-icon cashier-icon-1"><i class="md-icon icon-font md-icon-cashier-icon-1 cashier-icon-1 lg" style="color:;"></i></div>
241+
<div class="item-icon cashier-icon-1"><svg class="md-icon icon-svg md-icon-cashier-icon-1 lg" style="fill:;">
242+
<use xlink:href="#cashier-icon-1"></use>
243+
</svg></div>
226244
<div class="item-label">
227245
<p class="title"><span>XX银行(1234)</span> <span class="title-active">更换</span></p>
228246
<p class="desc">当前银行维护中</p>
229247
</div>
230-
<div class="item-check-icon"><i class="md-icon icon-font md-icon-check-disabled check-disabled md" style="color:;"></i></div>
248+
<div class="item-check-icon"><svg class="md-icon icon-svg md-icon-check-disabled md" style="fill:;">
249+
<use xlink:href="#check-disabled"></use>
250+
</svg></div>
231251
</div>
232252
</div>
233253
<!---->

‎components/cell-item/test/__snapshots__/demo.spec.js.snap‎

Lines changed: 24 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,9 @@ exports[`CellItem - Demo Basic 1`] = `
2525
</div>
2626
<div class="md-cell-item-right">
2727
28-
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
28+
<svg class="md-icon icon-svg md-icon-arrow md" style="fill:;">
29+
<use xlink:href="#arrow"></use>
30+
</svg></div>
2931
</div>
3032
<!---->
3133
</div>
@@ -85,7 +87,9 @@ exports[`CellItem - Demo Content List 1`] = `
8587
</div>
8688
<div class="md-cell-item-right">
8789
附加文案
88-
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
90+
<svg class="md-icon icon-svg md-icon-arrow md" style="fill:;">
91+
<use xlink:href="#arrow"></use>
92+
</svg></div>
8993
</div>
9094
<!---->
9195
</div>
@@ -98,7 +102,9 @@ exports[`CellItem - Demo Content List 1`] = `
98102
</div>
99103
<div class="md-cell-item-right">
100104
附加文案
101-
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
105+
<svg class="md-icon icon-svg md-icon-arrow md" style="fill:;">
106+
<use xlink:href="#arrow"></use>
107+
</svg></div>
102108
</div>
103109
<!---->
104110
</div>
@@ -111,7 +117,9 @@ exports[`CellItem - Demo Content List 1`] = `
111117
</div>
112118
<div class="md-cell-item-right">
113119
禁用的项目
114-
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
120+
<svg class="md-icon icon-svg md-icon-arrow md" style="fill:;">
121+
<use xlink:href="#arrow"></use>
122+
</svg></div>
115123
</div>
116124
<!---->
117125
</div>
@@ -124,7 +132,9 @@ exports[`CellItem - Demo Content List 1`] = `
124132
</div>
125133
<div class="md-cell-item-right">
126134
127-
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
135+
<svg class="md-icon icon-svg md-icon-arrow md" style="fill:;">
136+
<use xlink:href="#arrow"></use>
137+
</svg></div>
128138
</div>
129139
<div class="md-cell-item-children">
130140
<p style="font-size:0.24rem;color:#858B9C;">
@@ -152,7 +162,9 @@ exports[`CellItem - Demo Simple List 1`] = `
152162
</div>
153163
<div class="md-cell-item-right">
154164
可用8000.34
155-
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
165+
<svg class="md-icon icon-svg md-icon-arrow md" style="fill:;">
166+
<use xlink:href="#arrow"></use>
167+
</svg></div>
156168
</div>
157169
<!---->
158170
</div>
@@ -209,7 +221,9 @@ exports[`CellItem - Demo Simple List 1`] = `
209221
</div>
210222
<div class="md-cell-item-right">
211223
可用8000.34
212-
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
224+
<svg class="md-icon icon-svg md-icon-arrow md" style="fill:;">
225+
<use xlink:href="#arrow"></use>
226+
</svg></div>
213227
</div>
214228
<!---->
215229
</div>
@@ -224,7 +238,9 @@ exports[`CellItem - Demo Simple List 1`] = `
224238
</div>
225239
<div class="md-cell-item-right">
226240
可用8000.34
227-
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
241+
<svg class="md-icon icon-svg md-icon-arrow md" style="fill:;">
242+
<use xlink:href="#arrow"></use>
243+
</svg></div>
228244
</div>
229245
<!---->
230246
</div>

0 commit comments

Comments
 (0)