x-button: Add less variables. Close #896

airyland · Feb 12, 2017 · 5ffe53f · 5ffe53f
1 parent cb5d70c
commit 5ffe53f
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 14 deletions.
diff --git a/src/components/button-tab/metas.yml b/src/components/button-tab/metas.yml
@@ -36,6 +36,9 @@ button-tab-item:
       en: emits when item being clicked
       zh-CN: 当前按钮点击时触发
 changes:
+  v2.1.0-rc.46:
+    zh-CN:
+      - '[feature] 添加更多`less`变量 #896 @erguotou520'
   v2.0.0:
     en:
       - '[enhance] remove tap highlight'

diff --git a/src/components/x-button/metas.yml b/src/components/x-button/metas.yml
@@ -38,3 +38,7 @@ slots:
   default:
     en: button text
     zh-CN: 按钮文字
+changes:
+  v2.1.0-rc.46:
+      zh-CN:
+        - '[feature] 添加`less`变量 #896 @erguotou520'
diff --git a/src/styles/variable.less b/src/styles/variable.less
@@ -97,9 +97,27 @@
 /**
 * Button
 */
+
+@button-global-border-radius: 5px;
+@button-global-font-color: #FFFFFF;
+@button-global-margin-top: 15px;
+@button-global-height: 42px;
+@button-global-disabled-font-color: rgba(255,255,255,.6);
+@button-global-active-font-color: rgba(255,255,255,.4);
+@button-global-font-size: 18px;
+
 @button-warn-bg-color: #EF4F4F;
 @button-warn-active-color: #C13E3E;
 
+@button-default-bg-color: #F7F7F7;
+@button-default-font-color: #454545;
+@button-default-active-bg-color: #DEDEDE;
+@button-default-disabled-font-color: #C9C9C9;
+@button-default-active-font-color: #A1A1A1;
+
+@button-primary-bg-color: @theme-color;
+@button-primary-active-bg-color: #039702;
+
 /**
 * Cell
 */

diff --git a/src/styles/weui/base/variable/weui_button.less b/src/styles/weui/base/variable/weui_button.less
@@ -1,21 +1,21 @@
-@weuiBtnDefaultGap:15px;
-@weuiBtnHeight:42px;
+@weuiBtnDefaultGap:@button-global-margin-top;
+@weuiBtnHeight:@button-global-height;
 @weuiBtnMiniHeight:1.9;
-@weuiBtnFontSize:18px;
-@weuiBtnFontColor:#FFFFFF;
-@weuiBtnDisabledFontColor:rgba(255,255,255,.6);
-@weuiBtnActiveFontColor:rgba(255,255,255,.4);
+@weuiBtnFontSize:@button-global-font-size;
+@weuiBtnFontColor:@button-global-font-color;
+@weuiBtnDisabledFontColor:@button-global-disabled-font-color;
+@weuiBtnActiveFontColor:@button-global-active-font-color;
 @weuiBtnMiniFontSize:14px;
-@weuiBtnBorderRadius:5px;
+@weuiBtnBorderRadius:@button-global-border-radius;
 
-@weuiBtnDefaultBg:#F7F7F7;
-@weuiBtnDefaultActiveBg:#DEDEDE;
-@weuiBtnDefaultFontColor:#454545;
-@weuiBtnDefaultDisabledFontColor:#C9C9C9;
-@weuiBtnDefaultActiveFontColor:#A1A1A1;
+@weuiBtnDefaultBg:@button-default-bg-color;
+@weuiBtnDefaultActiveBg:@button-default-active-bg-color;
+@weuiBtnDefaultFontColor:@button-default-font-color;
+@weuiBtnDefaultDisabledFontColor:@button-default-disabled-font-color;
+@weuiBtnDefaultActiveFontColor:@button-default-active-font-color;
 
-@weuiBtnPrimaryBg:#04BE02;
-@weuiBtnPrimaryActiveBg:#039702;
+@weuiBtnPrimaryBg:@button-primary-bg-color;
+@weuiBtnPrimaryActiveBg:@button-primary-active-bg-color;
 
 @weuiBtnWarnBg:@button-warn-bg-color;
 @weuiBtnWarnActiveBg:@button-warn-active-color;