javascript/weui
1
0
Fork 0
mirror of https://github.com/Tencent/weui.git synced 2026-03-13 08:02:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: weui v2.6.11

Browse Source
This commit is contained in:
xushengni
2024-01-12 15:03:19 +08:00
parent 86b6c9ebdb
commit 610e504bdf
21 changed files with 237 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
CHANGELOG.md
View File

@@ -1,3 +1,28 @@
### v2.6.11 (2024-01-12)
### v2.6.10 (2024-01-12)
#### Bugfixes
* fix: 修复form组件上下结构带来的兼容问题
* fix: 调整button组件loading颜色
### v2.6.9 (2023-12-22)
#### Features
* feat: 组件Button UI升级
* feat: 桌面端下鼠标形状统一为箭头
#### Bugfixes
* fix: 调整组件weui-agree的热区
* fix: 调整组件weui-mask透明度
### v2.6.7 (2023-11-01)
#### Features

2
dist/example/example.css vendored
View File

File diff suppressed because one or more lines are too long

14
dist/example/index.html vendored
View File

@@ -467,12 +467,15 @@
<div class="button-sp-area">
<a href="javascript:" role="button" class="weui-btn weui-btn_primary">主要操作</a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_primary weui-btn_loading"><i class="weui-mask-loading weui-mask-loading_only"></i></a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_primary weui-btn_loading"><i class="weui-mask-loading"></i>主要操作</a>
<a href="javascript:" role="button" aria-disabled="true" disabled class="weui-btn weui-btn_disabled weui-btn_primary">主要操作</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_default">次要操作</a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_default weui-btn_loading"><i class="weui-mask-loading weui-mask-loading_only"></i></a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_default weui-btn_loading"><i class="weui-mask-loading"></i>次要操作</a>
<a href="javascript:" role="button" aria-disabled="true" disabled class="weui-btn weui-btn_disabled weui-btn_default">次要操作</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_warn">警示操作</a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_warn weui-btn_loading"><i class="weui-mask-loading weui-mask-loading_only"></i></a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_warn weui-btn_loading"><i class="weui-mask-loading"></i>警示操作</a>
<a href="javascript:" role="button" aria-disabled="true" disabled class="weui-btn weui-btn_disabled weui-btn_warn">警示操作</a>
</div>
@@ -484,9 +487,14 @@
</div>
<div class="button-sp-area overlay">
<a href="javascript:" role="button" class="weui-btn weui-btn_overlay">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_overlay weui-btn_medium">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_overlay weui-btn_mini">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_primary weui-btn_overlay">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_default weui-btn_overlay">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_warn weui-btn_overlay">overlay 按钮</a>
</div>
<div class="button-sp-area overlay">
<a href="javascript:" role="button" class="weui-btn weui-btn_primary weui-btn_overlay weui-btn_disabled">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_default weui-btn_overlay weui-btn_disabled">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_warn weui-btn_overlay weui-btn_disabled">overlay 按钮</a>
</div>
<div class="button-sp-area cell">

154
dist/style/weui.css vendored
View File

File diff suppressed because one or more lines are too long

6
dist/style/weui.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "weui",
"version": "2.6.7",
"version": "2.6.11",
"description": "A UI library by WeChat official design team, includes the most useful widgets/modules in mobile web applications.",
"keywords": [
"weui",

14
src/example/button/button_default.html
View File

@@ -7,12 +7,15 @@
<div class="button-sp-area">
<a href="javascript:" role="button" class="weui-btn weui-btn_primary">主要操作</a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_primary weui-btn_loading"><i class="weui-mask-loading weui-mask-loading_only"></i></a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_primary weui-btn_loading"><i class="weui-mask-loading"></i>主要操作</a>
<a href="javascript:" role="button" aria-disabled="true" disabled class="weui-btn weui-btn_disabled weui-btn_primary">主要操作</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_default">次要操作</a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_default weui-btn_loading"><i class="weui-mask-loading weui-mask-loading_only"></i></a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_default weui-btn_loading"><i class="weui-mask-loading"></i>次要操作</a>
<a href="javascript:" role="button" aria-disabled="true" disabled class="weui-btn weui-btn_disabled weui-btn_default">次要操作</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_warn">警示操作</a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_warn weui-btn_loading"><i class="weui-mask-loading weui-mask-loading_only"></i></a>
<a href="javascript:" role="button" title="正在操作" class="weui-btn weui-btn_warn weui-btn_loading"><i class="weui-mask-loading"></i>警示操作</a>
<a href="javascript:" role="button" aria-disabled="true" disabled class="weui-btn weui-btn_disabled weui-btn_warn">警示操作</a>
</div>
@@ -24,9 +27,14 @@
</div>
<div class="button-sp-area overlay">
<a href="javascript:" role="button" class="weui-btn weui-btn_overlay">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_overlay weui-btn_medium">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_overlay weui-btn_mini">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_primary weui-btn_overlay">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_default weui-btn_overlay">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_warn weui-btn_overlay">overlay 按钮</a>
</div>
<div class="button-sp-area overlay">
<a href="javascript:" role="button" class="weui-btn weui-btn_primary weui-btn_overlay weui-btn_disabled">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_default weui-btn_overlay weui-btn_disabled">overlay 按钮</a>
<a href="javascript:" role="button" class="weui-btn weui-btn_warn weui-btn_overlay weui-btn_disabled">overlay 按钮</a>
</div>
<div class="button-sp-area cell">

2
src/example/example.less
View File

@@ -207,7 +207,7 @@ body,
background-color: var(--weui-BG-2);
overflow: hidden;
border-radius: 2px;
cursor: pointer;
cursor: default;
&.js_show {
.weui-flex {
opacity: 0.5;

2
src/style/base/reset.less
View File

@@ -39,6 +39,8 @@ a img {
a {
text-decoration: none;
.setTapColor();
cursor: default;
}
input,
textarea {

6
src/style/base/variable/weui-button.less
View File

@@ -24,7 +24,7 @@ page {
--weui-BTN-HEIGHT-MEDIUM: 40;
--weui-BTN-HEIGHT-SMALL: 32;
}
.setColor(--weui-BTN-ACTIVE-MASK, rgba(0,0,0,0.1), rgba(255,255,255,0.1));
.setColor(--weui-BTN-ACTIVE-MASK, rgba(0,0,0,0.2), rgba(255,255,255,0.2));
@@ -63,8 +63,8 @@ page {
@weuiBtnPrimaryDisabledBg: @weuiBtnDisabledBg;
// warn
@weuiBtnWarnFontColor: @weuiColorWarn;
@weuiBtnWarnFontColor: @weuiBtnFontColor;
@weuiBtnWarnDisabledFontColor: @weuiBtnDisabledFontColor;
@weuiBtnWarnBg: @weuiBtnDefaultBg;
@weuiBtnWarnBg: var(--weui-RED-100);
@weuiBtnWarnActiveBg: @weuiBtnDefaultActiveBg;
@weuiBtnwarnDisabledBg: @weuiBtnDefaultDisabledBg;

7
src/style/widget/weui-agree/weui-agree.less
View File

@@ -17,10 +17,11 @@
@import "../../base/fn";
.weui-agree {
display: flex;
text-align: justify;
justify-content: center;
display: inline-flex;
vertical-align: bottom;
max-width: 100%;
align-items: center;
text-align: justify;
.hyphens;
line-height: 1.6;

6
src/style/widget/weui-button/weui-btn_default.less
View File

@@ -17,9 +17,9 @@
@import "../../base/fn";
.weui-btn_default {
color: @weuiBtnDefaultFontColor;
background-color: @weuiBtnDefaultBg;
color: var(--weui-FG-0);
background-color: var(--weui-FG-5);
&:not(.weui-btn_disabled):visited {
color: @weuiBtnDefaultFontColor;
color: var(--weui-FG-0);
}
}

2
src/style/widget/weui-button/weui-btn_disabled.less
View File

@@ -19,5 +19,5 @@
.weui-btn_disabled,
.weui-btn[disabled] {
color: var(--weui-FG-4);
background-color: var(--weui-BG-1);
background-color: var(--weui-FG-5);
}

3
src/style/widget/weui-button/weui-btn_global.less
View File

@@ -28,11 +28,12 @@
font-size: @weuiBtnFontSize;
text-align: center;
text-decoration: none;
color: @weuiBtnFontColor;
color: #fff;
line-height: unit(((@weuiBtnHeight - 24) / @weuiBtnFontSize));
border-radius: @weuiBtnBorderRadius;
.setTapColor();
cursor: default;
user-select: none;
&:active {

29
src/style/widget/weui-button/weui-btn_loading.less
View File

@@ -17,22 +17,35 @@
@import "../../base/fn";
.weui-btn_loading {
.weui-loading {
margin: -0.2em 8px 0 0;
}
.weui-mask-loading {
margin: -0.2em 8px 0 0;
font-size: 20px;
margin: -0.2em 4px 0 0;
color: currentColor;
// 临时用，为了向后兼容，等designtoken完成后再改成默认loading，按需loading+text
&.weui-mask-loading_only {
margin-right: 0;
}
}
&.weui-btn_default {
.weui-mask-loading {
color: #606060;
}
}
.weui-loading {
font-size: 20px;
margin: -0.2em 4px 0 0;
}
.weui-primary-loading {
margin: -0.2em 8px 0 0;
font-size: 20px;
margin: -0.2em 4px 0 0;
vertical-align: middle;
color: currentColor;
&::before {
content: "";
}
}
&.weui-btn_primary {
color: var(--weui-WHITE);
}
}

33
src/style/widget/weui-button/weui-btn_overlay.less
View File

@@ -16,10 +16,35 @@
@import "../../base/fn";
.weui-btn_overlay {
color: var(--weui-BRAND);
background-color: @LIGHT_BG_5;
&:not(.weui-btn_disabled):visited {
color: var(--weui-BRAND);
&.weui-btn_primary {
color: @LIGHT_FG_0;
background-color: #fff;
&:not(.weui-btn_disabled):visited {
color: @LIGHT_FG_0;
}
}
&.weui-btn_default {
color: #fff;
background-color: rgba(247, 247, 247, 0.3);
&:not(.weui-btn_disabled):visited {
color: #fff;
}
}
&.weui-btn_warn {
color: #fff;
background-color: var(--weui-RED-100);
&:not(.weui-btn_disabled):visited {
color: #fff;
}
}
&.weui-btn_disabled,
&[disabled] {
color: rgba(247, 247, 247, 0.3);
background-color: rgba(255, 255, 255, 0.3);
}
}

4
src/style/widget/weui-button/weui-btn_primary.less
View File

@@ -17,8 +17,8 @@
@import "../../base/fn";
.weui-btn_primary {
background-color: @weuiBtnPrimaryBg;
background-color: var(--weui-BRAND);
&:not(.weui-btn_disabled):visited {
color: @weuiBtnPrimaryFontColor;
color: #fff;
}
}

5
src/style/widget/weui-button/weui-btn_warn.less
View File

@@ -17,9 +17,8 @@
@import "../../base/fn";
.weui-btn_warn {
color: @weuiBtnWarnFontColor;
background-color: @weuiBtnWarnBg;
background-color: var(--weui-RED-100);
&:not(.weui-btn_disabled):visited {
color: @weuiBtnWarnFontColor;
color: #fff;
}
}

13
src/style/widget/weui-cell/weui-cell_global.less
View File

@@ -109,19 +109,6 @@ z-index:
.weui-cell_primary {
align-items: flex-start;
}
.weui-cell_vertical {
flex-direction: column;
align-items: flex-start;
.weui-cell__hd {
padding-right: 0;
margin-bottom: 12px;
}
.weui-cell__hd,
.weui-cell__bd {
width: 100%;
}
}
.weui-cell__bd {
flex: 1;
min-width: 0;

29
src/style/widget/weui-cell/weui-cells__group.less
View File

@@ -48,13 +48,28 @@ body {
left: var(--weui-cellPaddingLR);
right: var(--weui-cellPaddingLR);
}
&:not(.weui-cell_vertical) {
.weui-cell__hd {
padding-right: 16px;
}
.weui-cell__ft {
padding-left: 16px;
}
.weui-cell__hd {
padding-right: 16px;
}
.weui-cell__ft {
padding-left: 16px;
}
}
.weui-cell_vertical {
flex-direction: column;
align-items: flex-start;
.weui-cell__hd {
padding-right: 0;
margin-bottom: 12px;
}
.weui-cell__ft {
padding-left: 0;
}
.weui-cell__hd,
.weui-cell__bd {
width: 100%;
}
}

2
src/style/widget/weui-tips/weui-mask.less
View File

@@ -23,7 +23,7 @@
right: 0;
left: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.6);
background: rgba(0, 0, 0, 0.5);
}
.weui-mask_transparent {