Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat(chore): ui,color upgrade #755

Merged
merged 2 commits into from
Aug 6, 2021
Merged

feat(chore): ui,color upgrade #755

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b479292
feat: update ui
zouhangwithsweet Aug 4, 2021
2364144
fix(icon): fix refresh icon
zouhangwithsweet Aug 6, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
12 changes: 6 additions & 6 deletions components/_style/mixin/theme.basic.styl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
/// Brand Color
color-primary = #2F86F6 // 品牌色
color-primary = #198cff // 品牌色

/// Text Color
color-text-base = #111A34 // 重要信息，如一级标题
color-text-base = #01080F // 重要信息，如一级标题
color-text-base-inverse = #FFF
color-text-body = #41485D // 普通信息，如正文主要内容
color-text-minor = #666f83 // 次要信息，如利益点、摘要
color-text-caption = #858B9C // 辅助信息，如列表内容描述
color-text-disabled = #C5CAD5 // 禁用状态
color-text-disabled = #D9E0E7 // 禁用状态
color-text-placeholder = #C5CAD5 // 默认提示输入或占位
color-text-highlight = color-primary // 高亮状态
color-text-warn = #FF7D41 // 利益点，警告提示
color-text-error = #FF5257 // 强提示报错
color-text-warn = #FF4040 // 利益点，警告提示
color-text-error = #FF4040 // 强提示报错
color-text-link = #5878B4 // 文字链接

/// Border & Background Color
Expand Down Expand Up @@ -40,7 +40,7 @@ font-weight-medium = 500
font-weight-semibold = 600

/// Radius Size
radius-normal = 4px
radius-normal = 16px
radius-circle = 50%

/// Border Size
Expand Down
8 changes: 4 additions & 4 deletions components/_style/mixin/theme.components.styl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,11 +39,11 @@ button-default-fill = color-bg-inverse
button-disabled-fill = color-bg-disabled
button-warning-fill = color-text-error

button-primary-active-fill = #2A78DC
button-primary-active-fill = #167DE5
button-default-active-fill = color-bg-base
button-warning-active-fill = #E9424F

button-primary-plain-active-fill = #EAF2FE
button-primary-plain-active-fill = #EBF5FF
button-default-plain-active-fill = color-bg-base
button-warning-plain-active-fill = #FAC3C6

Expand Down Expand Up @@ -214,7 +214,7 @@ icon-size-xs = 20px
icon-size-sm = 24px
icon-size-md = 32px
icon-size-lg = 42px
icon-font-family = url("https://manhattan.didistatic.com/static/manhattan/mand-mobile/icon/2.0.2/iconfont.woff") format("woff"), url("https://manhattan.didistatic.com/static/manhattan/mand-mobile/icon/2.0.2/iconfont.ttf") format("truetype")
icon-font-family = url("https://manhattan.didistatic.com/static/manhattan/mand-mobile/icon/2.1.0/iconfont.woff") format("woff"), url("http://manhattan.didistatic.com/static/manhattan/mand-mobile/icon/2.1.0/iconfont.ttf") format("truetype")

/// image-viewer
image-viewer-index-font-size = 32px
Expand Down Expand Up @@ -375,7 +375,7 @@ tab-bg = color-bg-base
tab-height = 100px
tab-ink-height = 3px
tab-offset = h-gap-sl
tab-item-gap = h-gap-md
tab-item-gap = 27px

/// tab-picker
tab-picker-height = 500px
Expand Down
4 changes: 2 additions & 2 deletions components/action-bar/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ export default {
bottom 0
right 0
display flex
padding action-bar-padding-v action-bar-padding-h
padding action-bar-padding-v action-bar-padding-h 36px
background color-bg-inverse
clearfix()

Expand All @@ -79,7 +79,7 @@ export default {
flex 1
padding-bottom constant(safe-area-inset-bottom)
padding-bottom env(safe-area-inset-bottom)

.md-action-bar-text
display flex
flex 1
Expand Down
2 changes: 1 addition & 1 deletion components/button/demo/cases/demo4.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<template>
<div class="md-example-child md-example-child-button md-example-child-button-3">
<md-button type="link" icon="message">评论</md-button>
<md-button type="link" inactive>去看看<md-icon name="arrow-right" size="md"></md-icon></md-button>
<md-button type="link" inactive>去看看<md-icon name="arrow" size="md"></md-icon></md-button>
</div>
</template>

Expand Down
2 changes: 1 addition & 1 deletion components/button/test/__snapshots__/demo.spec.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,7 @@ exports[`Button Text link 1`] = `
</button> <button type="button" disabled="disabled" class="md-button link inactive block">
<div class="md-button-inner">
<!---->
<div class="md-button-content">去看看<i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<div class="md-button-content">去看看<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
</button></div>
`;
2 changes: 1 addition & 1 deletion components/button/test/cases/demo4.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<template>
<div class="md-example-child md-example-child-button md-example-child-button-3">
<md-button type="link" icon="message">评论</md-button>
<md-button type="link" inactive>去看看<md-icon name="arrow-right" size="md"></md-icon></md-button>
<md-button type="link" inactive>去看看<md-icon name="arrow" size="md"></md-icon></md-button>
</div>
</template>

Expand Down
4 changes: 2 additions & 2 deletions components/cell-item/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
<slot name="right">
{{ addon }}
</slot>
<md-icon v-if="arrow" name="arrow-right" size="md" />
<md-icon v-if="arrow" name="arrow" size="md" />
</div>
</div>
<div class="md-cell-item-children" v-if="$slots.children">
Expand Down Expand Up @@ -116,7 +116,7 @@ export default {
justify-content flex-end
color cell-item-right-color
font-size cell-item-right-font-size
.md-icon-arrow-right
.md-icon-arrow
margin-left 6px
margin-right -6px
color color-text-placeholder
Expand Down
16 changes: 8 additions & 8 deletions components/cell-item/test/__snapshots__/demo.spec.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ exports[`CellItem - Demo Basic 1`] = `
</div>
<div class="md-cell-item-right">

<i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<!---->
</div>
Expand Down Expand Up @@ -85,7 +85,7 @@ exports[`CellItem - Demo Content List 1`] = `
</div>
<div class="md-cell-item-right">
附加文案
<i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<!---->
</div>
Expand All @@ -98,7 +98,7 @@ exports[`CellItem - Demo Content List 1`] = `
</div>
<div class="md-cell-item-right">
附加文案
<i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<!---->
</div>
Expand All @@ -111,7 +111,7 @@ exports[`CellItem - Demo Content List 1`] = `
</div>
<div class="md-cell-item-right">
禁用的项目
<i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<!---->
</div>
Expand All @@ -124,7 +124,7 @@ exports[`CellItem - Demo Content List 1`] = `
</div>
<div class="md-cell-item-right">

<i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<div class="md-cell-item-children">
<p style="font-size:0.24rem;color:#858B9C;">
Expand Down Expand Up @@ -152,7 +152,7 @@ exports[`CellItem - Demo Simple List 1`] = `
</div>
<div class="md-cell-item-right">
可用8000.34
<i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<!---->
</div>
Expand Down Expand Up @@ -209,7 +209,7 @@ exports[`CellItem - Demo Simple List 1`] = `
</div>
<div class="md-cell-item-right">
可用8000.34
<i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<!---->
</div>
Expand All @@ -224,7 +224,7 @@ exports[`CellItem - Demo Simple List 1`] = `
</div>
<div class="md-cell-item-right">
可用8000.34
<i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<!---->
</div>
Expand Down
2 changes: 2 additions & 0 deletions components/codebox/test/__snapshots__/demo.spec.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,7 @@ exports[`Codebox System keyboard 1`] = `
<li class="keyboard-number-item"><span>9</span></li>
<li class="keyboard-number-item"><span>.</span></li>
<li class="keyboard-number-item"><span>0</span></li>
<!---->
<li class="keyboard-number-item slidedown"><span></span></li>
</ul>
</div>
Expand Down Expand Up @@ -145,6 +146,7 @@ exports[`Codebox Unlimited length 1`] = `
<li class="keyboard-number-item"><span>9</span></li>
<li class="keyboard-number-item"><span>.</span></li>
<li class="keyboard-number-item"><span>0</span></li>
<!---->
<li class="keyboard-number-item slidedown"><span></span></li>
</ul>
</div>
Expand Down
4 changes: 2 additions & 2 deletions components/date-picker/demo/cases/demo3.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<md-field-item
name="name"
title="出险时间"
arrow="arrow-right"
arrow="arrow"
align="right"
:content="datePickerValue"
@click.native="isDatePickerShow = true">
Expand Down Expand Up @@ -70,4 +70,4 @@ export default {
},
},
}
</script>
</script>
Expand Down
5 changes: 3 additions & 2 deletions components/field/item.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
</div>
<div class="md-field-item-right" v-if="arrow || addon || $slots.right">
<slot name="right">{{ addon }}</slot>
<md-icon v-if="arrow" :name="arrow === true ? 'arrow-right' : arrow" size="md" />
<md-icon v-if="arrow" :name="arrow === true ? 'arrow' : arrow" size="md" />
</div>
</div>
<div class="md-field-item-children" v-if="$slots.children">
Expand Down Expand Up @@ -161,7 +161,7 @@ export default {
justify-content flex-end
color field-item-addon-color
font-size field-item-addon-font-size
.md-icon-arrow-right
.md-icon-arrow
margin-right -6px
color color-text-placeholder

Expand All @@ -173,6 +173,7 @@ export default {
&.is-solid
.md-field-item-title
width field-item-title-width
color #01080F
&.is-disabled
.md-field-item-control,
.md-field-item-left,
Expand Down
4 changes: 2 additions & 2 deletions components/field/test/__snapshots__/demo.spec.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,15 +50,15 @@ exports[`Field Basic 1`] = `
<div class="md-field-item-control">
<!---->
</div>
<div class="md-field-item-right"> <i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<div class="md-field-item-right"> <i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<!---->
</div>
<div class="md-field-item is-solid is-disabled is-browser">
<div class="md-field-item-content"><label class="md-field-item-title">禁用条目</label>
<!---->
<div class="md-field-item-control">内容禁用状态</div>
<div class="md-field-item-right"> <i class="md-icon icon-font md-icon-arrow-right arrow-right md" style="color:;"></i></div>
<div class="md-field-item-right"> <i class="md-icon icon-font md-icon-arrow arrow md" style="color:;"></i></div>
</div>
<!---->
</div>
Expand Down
8 changes: 6 additions & 2 deletions components/icon/default-svg-list.js
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions components/icon/demo/cases/demo0.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ export default {
'rectangle',
'right',
'wrong',
'arrow',
'arrow-left',
'arrow-right',
'arrow-up',
Expand Down
24 changes: 13 additions & 11 deletions components/icon/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,7 @@ export default {
&:before
position relative
z-index 2

&.icon-svg
&.xss
width icon-size-xxs
Expand All @@ -109,40 +109,42 @@ export default {
vertical-height(icon-size-lg)

// name
.md-icon-arrow:before
content "\e68d"
.md-icon-rectangle:before
content "\e900"
content "\e68e"
.md-icon-invisible:before
content "\e601"
.md-icon-visible:before
content "\e602"
.md-icon-right:before
content "\e905"
content "\e68f"
.md-icon-wrong:before
content "\e906"
content "\e604"
.md-icon-info:before
content "\e605"
.md-icon-service:before
content "\e606"
.md-icon-edit:before
content "\e607"
.md-icon-refresh:before
content "\e901"
content "\e692"
.md-icon-question:before
content "\e608"
.md-icon-setting:before
content "\e609"
.md-icon-wait:before
content "\e902"
content "\e690"
.md-icon-check:before
content "\e904"
content "\e60c"
.md-icon-check-disabled:before
content "\e903"
content "\e636"
.md-icon-checked:before, .md-icon-success:before
content "\e908"
content "\e60d"
.md-icon-clear:before, .md-icon-fail:before
content "\e60e"
.md-icon-info-solid:before
content "\e907"
content "\e635"
.md-icon-warn:before
content "\e60b"
.md-icon-security:before
Expand Down Expand Up @@ -216,7 +218,7 @@ export default {
.md-icon-arrow-down:before
content "\e634"
.md-icon-close:before
content "\e604"
content "\e68c"

@font-face
font-family Mand-Mobile-Icon
Expand Down
3 changes: 3 additions & 0 deletions components/icon/test/__snapshots__/demo.spec.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,9 @@ exports[`Icon - Demo Font icon 1`] = `
<div class="md-example-item"><i class="md-icon icon-font md-icon-wrong wrong lg" style="color:;"></i>
<p>wrong</p>
</div>
<div class="md-example-item"><i class="md-icon icon-font md-icon-arrow arrow lg" style="color:;"></i>
<p>arrow</p>
</div>
<div class="md-example-item"><i class="md-icon icon-font md-icon-arrow-left arrow-left lg" style="color:;"></i>
<p>arrow-left</p>
</div>
Expand Down
1 change: 1 addition & 0 deletions components/icon/test/cases/demo0.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ export default {
'rectangle',
'right',
'wrong',
'arrow',
'arrow-left',
'arrow-right',
'arrow-up',
Expand Down