feat: v2.6.21

This commit is contained in:
uxsi
2024-12-23 18:00:06 +08:00
parent 50a521d984
commit 3c703238de
13 changed files with 137 additions and 49 deletions

View File

@@ -1,3 +1,14 @@
### v2.6.21 (2024-12-23)
#### Features
* feat: 新增weui-toast__wrp结构用于适配toast宽度动态变化
#### Bugfixes
* fix: 修复toast组件超长英文溢出问题
* fix: 修复表单悬浮按钮、半屏弹窗悬浮按钮、验证码按钮、搜索按钮等未适配button组件新规范的问题
### v2.6.20 (2024-12-23)
#### Features

View File

@@ -538,7 +538,7 @@
</label>
</div>
<div class="weui-bottom-fixed-opr" id="js_opr">
<a href="javascript:;" role="button" class="weui-btn weui-btn_primary" id="js_btn">阅读并同意</a>
<a href="javascript:;" role="button" class="weui-btn weui-btn_primary" id="js_btn"><span class="weui-btn__inner">阅读并同意</span></a>
<a href="javascript:;" role="button" class="weui-btn weui-btn_default">取消</a>
</div>
</div>
@@ -1740,7 +1740,7 @@
</span>
</label>
</div>
<div class="weui-form__opr-area">
<div class="weui-form__opr-area weui-bottom-fixed-opr">
<button class="weui-btn weui-btn_primary" type="button" id="showTooltips">确定</button>
</div>
</div>
@@ -2466,46 +2466,56 @@
<!--BEGIN toast-->
<div role="alert" id="toast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast">
<i class="weui-icon-success-no-circle weui-icon_toast"></i>
<p class="weui-toast__content">已完成</p>
<div class="weui-toast__wrp">
<div class="weui-toast">
<i class="weui-icon-success-no-circle weui-icon_toast"></i>
<p class="weui-toast__content">已完成</p>
</div>
</div>
</div>
<!--BEGIN toast-->
<div role="alert" id="textMoreToast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast weui-toast_text-more">
<i class="weui-icon-warn weui-icon_toast"></i>
<p class="weui-toast__content">此处为长文案提示详情</p>
<div class="weui-toast__wrp">
<div class="weui-toast weui-toast_text-more">
<i class="weui-icon-warn weui-icon_toast"></i>
<p class="weui-toast__content">长文案提示详情长文案提示详情长文案提示详情</p>
</div>
</div>
</div>
<!--BEGIN toast-->
<div role="alert" id="warnToast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast">
<i class="weui-icon-warn weui-icon_toast"></i>
<p class="weui-toast__content">获取链接失败</p>
<div class="weui-toast__wrp">
<div class="weui-toast">
<i class="weui-icon-warn weui-icon_toast"></i>
<p class="weui-toast__content">获取链接失败</p>
</div>
</div>
</div>
<!-- loading toast -->
<div role="alert" id="loadingToast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast">
<span class="weui-primary-loading weui-icon_toast">
<span class="weui-primary-loading__dot"></span>
</span>
<p class="weui-toast__content">正在加载</p>
<div class="weui-toast__wrp">
<div class="weui-toast">
<span class="weui-primary-loading weui-icon_toast">
<span class="weui-primary-loading__dot"></span>
</span>
<p class="weui-toast__content">正在加载</p>
</div>
</div>
</div>
<!-- text toast -->
<div role="alert" id="textToast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast weui-toast_text">
<p class="weui-toast__content">文字提示</p>
<div class="weui-toast__wrp">
<div class="weui-toast weui-toast_text">
<p class="weui-toast__content">文字提示</p>
</div>
</div>
</div>
</div>

45
dist/style/weui.css vendored
View File

File diff suppressed because one or more lines are too long

View File

File diff suppressed because one or more lines are too long

View File

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

View File

@@ -11,7 +11,7 @@
</label>
</div>
<div class="weui-bottom-fixed-opr" id="js_opr">
<a href="javascript:;" role="button" class="weui-btn weui-btn_primary" id="js_btn">阅读并同意</a>
<a href="javascript:;" role="button" class="weui-btn weui-btn_primary" id="js_btn"><span class="weui-btn__inner">阅读并同意</span></a>
<a href="javascript:;" role="button" class="weui-btn weui-btn_default">取消</a>
</div>
</div>

View File

@@ -86,7 +86,7 @@
</span>
</label>
</div>
<div class="weui-form__opr-area">
<div class="weui-form__opr-area weui-bottom-fixed-opr">
<button class="weui-btn weui-btn_primary" type="button" id="showTooltips">确定</button>
</div>
</div>

View File

@@ -14,46 +14,56 @@
<!--BEGIN toast-->
<div role="alert" id="toast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast">
<i class="weui-icon-success-no-circle weui-icon_toast"></i>
<p class="weui-toast__content">已完成</p>
<div class="weui-toast__wrp">
<div class="weui-toast">
<i class="weui-icon-success-no-circle weui-icon_toast"></i>
<p class="weui-toast__content">已完成</p>
</div>
</div>
</div>
<!--BEGIN toast-->
<div role="alert" id="textMoreToast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast weui-toast_text-more">
<i class="weui-icon-warn weui-icon_toast"></i>
<p class="weui-toast__content">此处为长文案提示详情</p>
<div class="weui-toast__wrp">
<div class="weui-toast weui-toast_text-more">
<i class="weui-icon-warn weui-icon_toast"></i>
<p class="weui-toast__content">长文案提示详情,长文案提示详情,长文案提示详情</p>
</div>
</div>
</div>
<!--BEGIN toast-->
<div role="alert" id="warnToast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast">
<i class="weui-icon-warn weui-icon_toast"></i>
<p class="weui-toast__content">获取链接失败</p>
<div class="weui-toast__wrp">
<div class="weui-toast">
<i class="weui-icon-warn weui-icon_toast"></i>
<p class="weui-toast__content">获取链接失败</p>
</div>
</div>
</div>
<!-- loading toast -->
<div role="alert" id="loadingToast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast">
<span class="weui-primary-loading weui-icon_toast">
<span class="weui-primary-loading__dot"></span>
</span>
<p class="weui-toast__content">正在加载</p>
<div class="weui-toast__wrp">
<div class="weui-toast">
<span class="weui-primary-loading weui-icon_toast">
<span class="weui-primary-loading__dot"></span>
</span>
<p class="weui-toast__content">正在加载</p>
</div>
</div>
</div>
<!-- text toast -->
<div role="alert" id="textToast" style="display: none;">
<div class="weui-mask_transparent"></div>
<div class="weui-toast weui-toast_text">
<p class="weui-toast__content">文字提示</p>
<div class="weui-toast__wrp">
<div class="weui-toast weui-toast_text">
<p class="weui-toast__content">文字提示</p>
</div>
</div>
</div>
</div>

View File

@@ -28,6 +28,7 @@
.weui-btn:nth-last-child(n+2) + .weui-btn {
margin: 0 8px;
width: 136px;
min-width: 0;
&:first-child {
margin-left: 0;
}

View File

@@ -38,6 +38,7 @@ input {
&.weui-btn_inline,
&.weui-btn_mini {
width: auto;
min-width: 0;
}
}
@@ -49,7 +50,7 @@ input {
.weui-btn_mini {
display: inline-block;
width: auto;
min-width: 0;
line-height: ~"calc((32 - 12) / 14)";
padding: 6px 12px;
font-size: 14px;
@@ -58,7 +59,7 @@ input {
.weui-btn_xmini {
display: inline-block;
width: auto;
min-width: 0;
padding: 4px 12px;
line-height: ~"calc((28 - 8) / 14)";
font-size: 14px;

View File

@@ -181,7 +181,7 @@ body {
font-size: 16px;
padding: 0 12px;
height: auto;
width: auto;
min-width: 0;
line-height: 2;
border-radius: 6px;
color: @weuiBtnDefaultFontColor;

View File

@@ -237,7 +237,7 @@ input[type="search"]::-webkit-search-results-decoration {
.weui-search-bar__search-btn {
display: flex;
align-items: center;
width: auto;
min-width: 0;
padding: 8px 12px;
font-size: 15px;
font-weight: 400;

View File

@@ -37,8 +37,27 @@
box-sizing: border-box;
line-height: 1.4;
}
.weui-toast__wrp {
z-index: 5500;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
.weui-toast {
position: static;
transform: none;
margin-top: -10%;
}
}
.weui-toast_text {
padding: 12px 20px;
min-width: 0;
min-height: 0;
}
.weui-icon_toast {
// 重置weui-icon权重
@@ -49,6 +68,7 @@
display: block;
margin-bottom: 16px;
flex-shrink: 0;
&.weui-icon-success-no-circle {
color: rgba(255, 255, 255, 0.9);
}
@@ -84,6 +104,8 @@
.weui-toast__content {
font-size: 14px;
.hyphens;
max-width: 100%;
}
// 多行文本场景