weui/src/style/base/variable/weui-button.less

A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.

/*
* Tencent is pleased to support the open source community by making WeUI available.
* 
* Copyright (C) 2017 THL A29 Limited, a Tencent company. All rights reserved.
* 
* Licensed under the MIT License (the "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
* 
*       http://opensource.org/licenses/MIT
* 
* Unless required by applicable law or agreed to in writing, software distributed under the License is
* distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
* either express or implied. See the License for the specific language governing permissions and
* limitations under the License.
*/

@import "../../base/fn";


body,
.wx-root,
page {
  --weui-BTN-HEIGHT: 48;
  --weui-BTN-HEIGHT-MEDIUM: 40;
  --weui-BTN-HEIGHT-SMALL: 32;
}
.setColor(--weui-BTN-ACTIVE-MASK, rgba(0,0,0,0.2), rgba(255,255,255,0.2));



.setColor(--weui-BTN-DEFAULT-ACTIVE-BG, overlay(rgba(0, 0, 0, 0.05), #f2f2f2), overlay(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.08)));

@weuiBtnWidth: 184px;
@weuiBtnHeight: 48px;
@weuiBtnFontSize: 17px;
@weuiBtnBorderRadius: 8px;
@weuiBtnDefaultGap: 16px;

@weuiBtnMiniFontSize: 14px;
@weuiBtnMiniHeight: 32px;

@weuiBtnCellHeight: 56px;
@weuiBtnCellGap: 16px;
@weuiBtnCellLineHeight:unit(((@weuiBtnCellHeight - 2 * @weuiBtnCellGap) / @weuiBtnFontSize));

@weuiBtnFontColor: #fff;
@weuiBtnDisabledFontColor: var(--weui-FG-4);
@weuiBtnDisabledBg: var(--weui-FG-5);


// default
@weuiBtnDefaultFontColor: var(--weui-FG-0);
@weuiBtnDefaultDisabledFontColor: @weuiBtnDisabledFontColor;
@weuiBtnDefaultBg: var(--weui-FG-5);
@weuiBtnDefaultActiveBg: var(--weui-BTN-DEFAULT-ACTIVE-BG);
@weuiBtnDefaultDisabledBg: @weuiBtnDisabledBg;

// primary
@weuiBtnPrimaryFontColor: @weuiBtnFontColor;
@weuiBtnPrimaryDisabledFontColor: @weuiBtnDisabledFontColor;
@weuiBtnPrimaryBg: var(--weui-BRAND);
@weuiBtnPrimaryActiveBg: var(--weui-TAG-TEXT-GREEN);
@weuiBtnPrimaryDisabledBg: @weuiBtnDisabledBg;

// warn
@weuiBtnWarnFontColor: @weuiBtnFontColor;
@weuiBtnWarnDisabledFontColor: @weuiBtnDisabledFontColor;
@weuiBtnWarnBg: var(--weui-RED-100);
@weuiBtnWarnActiveBg: @weuiBtnDefaultActiveBg;
@weuiBtnwarnDisabledBg: @weuiBtnDefaultDisabledBg;