feat(GoodsAction): goodsAction 组件样式调整 (#2230)

This commit is contained in:
Lindy 2019-11-04 19:27:15 +08:00 committed by neverland
parent ef01e34c17
commit 9773e86c2d
4 changed files with 22 additions and 13 deletions

View File

@ -199,6 +199,15 @@
@field-error-message-text-font-size: @font-size-sm; @field-error-message-text-font-size: @font-size-sm;
@field-text-area-min-height: 18px; @field-text-area-min-height: 18px;
// GoodsAction
@goods-action-background-color: @white;
@goods-action-icon-height: 50px;
@goods-action-icon-font-size: @font-size-xs;
@goods-action-icon-text-color: @gray-darker;
@goods-action-button-height: 40px;
@goods-action-button-warning-color: @gradient-orange;
@goods-action-button-danger-color: @gradient-red;
// Image // Image
@image-placeholder-text-color: @gray-dark; @image-placeholder-text-color: @gray-dark;
@image-placeholder-font-size: @font-size-md; @image-placeholder-font-size: @font-size-md;

View File

@ -6,31 +6,31 @@
} }
.van-goods-action-button { .van-goods-action-button {
height: 40px !important;
font-weight: 500 !important;
line-height: 40px !important;
border: none !important; border: none !important;
.theme(height, '@goods-action-button-height') !important;
.theme(font-weight, '@font-weight-bold') !important;
.theme(line-height, '@goods-action-button-height') !important;
&--first { &--first {
display: block !important; display: block !important;
margin-left: 5px; margin-left: 5px;
border-top-left-radius: 20px !important; .theme(border-top-left-radius, '@goods-action-button-height / 2') !important;
border-bottom-left-radius: 20px !important; .theme(border-bottom-left-radius, '@goods-action-button-height / 2') !important;
} }
&--last { &--last {
display: block !important; display: block !important;
margin-right: 5px; margin-right: 5px;
border-top-right-radius: 20px !important; .theme(border-top-right-radius, '@goods-action-button-height / 2') !important;
border-bottom-right-radius: 20px !important; .theme(border-bottom-right-radius, '@goods-action-button-height / 2') !important;
} }
&--warning { &--warning {
background: linear-gradient(to right, #ffd01e, #ff8917); .theme(background, '@goods-action-button-warning-color');
} }
&--danger { &--danger {
background: linear-gradient(to right, #ff6034, #ee0a24); .theme(background, '@goods-action-button-danger-color');
} }
@media (max-width: 321px) { @media (max-width: 321px) {

View File

@ -2,17 +2,17 @@
@import '../common/style/theme.less'; @import '../common/style/theme.less';
.van-goods-action-icon { .van-goods-action-icon {
width: 50px !important;
border: none !important; border: none !important;
.theme(width, '@goods-action-icon-height') !important;
&__content { &__content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
height: 100%; height: 100%;
font-size: 10px;
line-height: 1; line-height: 1;
.theme(color, '@gray-darker'); .theme(font-size, '@goods-action-icon-font-size');
.theme(color, '@goods-action-icon-text-color');
} }
&__icon { &__icon {

View File

@ -8,7 +8,7 @@
left: 0; left: 0;
display: flex; display: flex;
align-items: center; align-items: center;
.theme(background-color, '@white'); .theme(background-color, '@goods-action-background-color');
&--safe { &--safe {
padding-bottom: constant(safe-area-inset-bottom); padding-bottom: constant(safe-area-inset-bottom);