diff --git a/packages/button/index.less b/packages/button/index.less
index 2d8fb29b..356b203e 100644
--- a/packages/button/index.less
+++ b/packages/button/index.less
@@ -8,13 +8,13 @@
justify-content: center;
box-sizing: border-box;
padding: 0;
- line-height: @button-line-height;
text-align: center;
vertical-align: middle;
-webkit-appearance: none;
-webkit-text-size-adjust: 100%;
.theme(height, '@button-default-height');
+ .theme(line-height, '@button-line-height');
.theme(font-size, '@button-default-font-size');
.theme(transition, 'opacity @animation-duration-fast');
.theme(border-radius, '@button-border-radius');
@@ -50,36 +50,36 @@
&--default {
.theme(color, '@button-default-color');
- .theme(background-color, '@button-default-background-color');
- .theme(border, '1px solid @button-default-border-color');
+ .theme(background, '@button-default-background-color');
+ .theme(border, '@button-border-width solid @button-default-border-color');
}
&--primary {
.theme(color, '@button-primary-color');
- .theme(background-color, '@button-primary-background-color');
- .theme(border, '1px solid @button-primary-border-color');
+ .theme(background, '@button-primary-background-color');
+ .theme(border, '@button-border-width solid @button-primary-border-color');
}
&--info {
.theme(color, '@button-info-color');
- .theme(background-color, '@button-info-background-color');
- .theme(border, '1px solid @button-info-border-color');
+ .theme(background, '@button-info-background-color');
+ .theme(border, '@button-border-width solid @button-info-border-color');
}
&--danger {
.theme(color, '@button-danger-color');
- .theme(background-color, '@button-danger-background-color');
- .theme(border, '1px solid @button-danger-border-color');
+ .theme(background, '@button-danger-background-color');
+ .theme(border, '@button-border-width solid @button-danger-border-color');
}
&--warning {
.theme(color, '@button-warning-color');
- .theme(background-color, '@button-warning-background-color');
- .theme(border, '1px solid @button-warning-border-color');
+ .theme(background, '@button-warning-background-color');
+ .theme(border, '@button-border-width solid @button-warning-border-color');
}
&--plain {
- .theme(background-color, '@button-plain-background-color');
+ .theme(background, '@button-plain-background-color');
&.van-button--primary {
.theme(color, '@button-primary-background-color');
diff --git a/packages/common/style/var.less b/packages/common/style/var.less
index f46d0bc3..0c8b9345 100644
--- a/packages/common/style/var.less
+++ b/packages/common/style/var.less
@@ -101,6 +101,7 @@
@button-warning-background-color: @orange;
@button-warning-border-color: @orange;
@button-line-height: 20px;
+@button-border-width: 1px;
@button-border-radius: @border-radius-sm;
@button-round-border-radius: @border-radius-max;
@button-plain-background-color: @white;
diff --git a/packages/goods-action-button/index.less b/packages/goods-action-button/index.less
index a4de88ca..a65d8d2e 100644
--- a/packages/goods-action-button/index.less
+++ b/packages/goods-action-button/index.less
@@ -6,42 +6,40 @@
}
.van-goods-action-button {
- .theme(height, '@goods-action-button-height') !important;
- .theme(font-weight, '@font-weight-bold') !important;
- .theme(line-height, '@goods-action-button-height') !important;
+ .theme(--button-warning-background-color, '@goods-action-button-warning-color');
+ .theme(--button-danger-background-color, '@goods-action-button-danger-color');
+ .theme(--button-default-height, '@goods-action-button-height');
+ .theme(--button-line-height, '@goods-action-button-height');
+ .theme(--button-plain-background-color, '@goods-action-button-plain-color');
+
+ display: block;
+
+ --button-border-width: 0;
&--first {
- display: block !important;
margin-left: 5px;
- .theme(border-top-left-radius, '@goods-action-button-border-radius') !important;
- .theme(border-bottom-left-radius, '@goods-action-button-border-radius') !important;
+
+ .theme(
+ --button-border-radius,
+ '@goods-action-button-border-radius 0 0 @goods-action-button-border-radius'
+ );
}
&--last {
- display: block !important;
margin-right: 5px;
- .theme(border-top-right-radius, '@goods-action-button-border-radius') !important;
- .theme(border-bottom-right-radius, '@goods-action-button-border-radius') !important;
- }
-
- &--warning {
- .theme(background, '@goods-action-button-warning-color');
- }
-
- &--danger {
- .theme(background, '@goods-action-button-danger-color');
- }
-
- &--ordinary {
- border: none !important;
+ .theme(
+ --button-border-radius,
+ '0 @goods-action-button-border-radius @goods-action-button-border-radius 0'
+ );
}
&--plain {
- .theme(background, '@goods-action-button-plain-color');
+ --button-border-width: @button-border-width;
}
- &--no-right-border {
- border-right-width: 0px !important;
+ &__inner {
+ width: 100%;
+ .theme(font-weight, '@font-weight-bold') !important;
}
@media (max-width: 321px) {
diff --git a/packages/goods-action-button/index.ts b/packages/goods-action-button/index.ts
index 67606ebd..5b2d963c 100644
--- a/packages/goods-action-button/index.ts
+++ b/packages/goods-action-button/index.ts
@@ -37,13 +37,8 @@ VantComponent({
const { children = [] } = this.parent;
const { length } = children;
const index = children.indexOf(this);
- let rightBorderLess = false;
- if (length > 1) {
- rightBorderLess = index !== length - 1;
- }
this.setData({
isFirst: index === 0,
- rightBorderLess,
isLast: index === length - 1
});
}
diff --git a/packages/goods-action-button/index.wxml b/packages/goods-action-button/index.wxml
index 392b96d9..69ed5aa3 100644
--- a/packages/goods-action-button/index.wxml
+++ b/packages/goods-action-button/index.wxml
@@ -1,6 +1,5 @@