yymini-pop-center 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +29 -0
- package/package.json +36 -0
- package/pop-center.js +94 -0
- package/pop-center.json +4 -0
- package/pop-center.ttml +22 -0
- package/pop-center.ttss +165 -0
- package/pop-center.wxml +22 -0
- package/pop-center.wxss +165 -0
package/README.md
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
# yymini-pop-center
|
|
2
|
+
抖音小程序 轻量级居中确认弹出框 自定义组件，无需额外依赖，开箱即用。
|
|
3
|
+
|
|
4
|
+
## 🌟 特性
|
|
5
|
+
- 原生小程序语法，兼容所有抖音小程序基础库
|
|
6
|
+
- 支持自定义 标题、内容、按钮等
|
|
7
|
+
- 提供 确认/取消回调，支持遮罩关闭
|
|
8
|
+
- 样式简洁美观，可自定义修改
|
|
9
|
+
|
|
10
|
+
## 📦 安装
|
|
11
|
+
在你的抖音小程序项目根目录执行：
|
|
12
|
+
|
|
13
|
+
```bash
|
|
14
|
+
npm install yymini-pop-center --save
|
|
15
|
+
or
|
|
16
|
+
yarn add yymini-pop-center
|
|
17
|
+
|
|
18
|
+
然后在 开发者工具中 构建 NPM
|
|
19
|
+
|
|
20
|
+
## 抖音小程序（必读）
|
|
21
|
+
- 抖音小程序在解析组件时，把 yymini-pop-center 当成了“相对路径组件”，而不是 npm 组件
|
|
22
|
+
- 所以必须显式指向组件文件路径。
|
|
23
|
+
|
|
24
|
+
```json
|
|
25
|
+
{
|
|
26
|
+
"usingComponents": {
|
|
27
|
+
"pop-center": "/miniprogram_npm/yymini-pop-center/pop-center"
|
|
28
|
+
}
|
|
29
|
+
}
|
package/package.json
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "yymini-pop-center",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "小程序（抖音、微信）-居中确认弹出框自定义组件",
|
|
5
|
+
"main": "pop-center.js",
|
|
6
|
+
"miniprogram": ".",
|
|
7
|
+
"keywords": [
|
|
8
|
+
"douyin",
|
|
9
|
+
"weixin",
|
|
10
|
+
"miniProgram",
|
|
11
|
+
"抖音小程序",
|
|
12
|
+
"微信小程序",
|
|
13
|
+
"confirm",
|
|
14
|
+
"modal",
|
|
15
|
+
"弹出框",
|
|
16
|
+
"居中弹出框"
|
|
17
|
+
],
|
|
18
|
+
"author": "Allen.ge <gyjshow@163.com>",
|
|
19
|
+
"license": "MIT",
|
|
20
|
+
"repository": {
|
|
21
|
+
"type": "",
|
|
22
|
+
"url": ""
|
|
23
|
+
},
|
|
24
|
+
"bugs": {
|
|
25
|
+
"url": ""
|
|
26
|
+
},
|
|
27
|
+
"homepage": "",
|
|
28
|
+
"private": false,
|
|
29
|
+
"files": [
|
|
30
|
+
"pop-center.*",
|
|
31
|
+
"README.md"
|
|
32
|
+
],
|
|
33
|
+
"scripts": {
|
|
34
|
+
"test": "echo \"Error: no test specified\" && exit 1"
|
|
35
|
+
}
|
|
36
|
+
}
|
package/pop-center.js
ADDED
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
// 居中 操作弹窗
|
|
2
|
+
Component({
|
|
3
|
+
// 组件属性（通用配置）
|
|
4
|
+
properties: {
|
|
5
|
+
visible: {
|
|
6
|
+
type: Boolean,
|
|
7
|
+
value: false,
|
|
8
|
+
observer(newVal, oldVal) {
|
|
9
|
+
if (newVal !== oldVal) {
|
|
10
|
+
// 弹窗显示时自动获取数据
|
|
11
|
+
if (newVal) {
|
|
12
|
+
// do something
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
}, // 控制显示/隐藏
|
|
17
|
+
zindex: {
|
|
18
|
+
type: Number,
|
|
19
|
+
value: 999
|
|
20
|
+
},
|
|
21
|
+
title: {
|
|
22
|
+
type: String,
|
|
23
|
+
value: '提示'
|
|
24
|
+
}, // 默认标题
|
|
25
|
+
message: {
|
|
26
|
+
type: String,
|
|
27
|
+
value: ''
|
|
28
|
+
}, // 提示框内容
|
|
29
|
+
width: {
|
|
30
|
+
type: Number,
|
|
31
|
+
value: 80
|
|
32
|
+
}, // 弹窗宽度 80%
|
|
33
|
+
cancelText: {
|
|
34
|
+
type: String,
|
|
35
|
+
value: '取消'
|
|
36
|
+
},
|
|
37
|
+
confirmText: {
|
|
38
|
+
type: String,
|
|
39
|
+
value: '确认'
|
|
40
|
+
},
|
|
41
|
+
showClose: {
|
|
42
|
+
type: Boolean,
|
|
43
|
+
value: false
|
|
44
|
+
}, // 关闭按钮
|
|
45
|
+
hideFooter: {
|
|
46
|
+
type: Boolean,
|
|
47
|
+
value: false
|
|
48
|
+
}, // 是否隐藏底部按钮
|
|
49
|
+
maskCloseable: {
|
|
50
|
+
type: Boolean,
|
|
51
|
+
value: false
|
|
52
|
+
} // 遮罩点击关闭
|
|
53
|
+
},
|
|
54
|
+
|
|
55
|
+
// 组件方法
|
|
56
|
+
methods: {
|
|
57
|
+
// 遮罩点击：触发关闭+取消事件
|
|
58
|
+
onMaskClick() {
|
|
59
|
+
if (this.data.maskCloseable) {
|
|
60
|
+
this.triggerEvent('close', {
|
|
61
|
+
type: 'mask'
|
|
62
|
+
}); // 向父组件传事件
|
|
63
|
+
this.triggerEvent('cancel');
|
|
64
|
+
}
|
|
65
|
+
},
|
|
66
|
+
// 阻止弹窗主体点击穿透到遮罩
|
|
67
|
+
stopPropagation() {},
|
|
68
|
+
|
|
69
|
+
// 取消按钮
|
|
70
|
+
onCancel() {
|
|
71
|
+
this.triggerEvent('close', {
|
|
72
|
+
type: 'cancel'
|
|
73
|
+
});
|
|
74
|
+
this.triggerEvent('cancel');
|
|
75
|
+
},
|
|
76
|
+
|
|
77
|
+
// 确认按钮
|
|
78
|
+
onConfirm() {
|
|
79
|
+
this.triggerEvent('close', {
|
|
80
|
+
type: 'confirm'
|
|
81
|
+
});
|
|
82
|
+
this.triggerEvent('confirm');
|
|
83
|
+
},
|
|
84
|
+
|
|
85
|
+
// 关闭按钮
|
|
86
|
+
onClose() {
|
|
87
|
+
this.triggerEvent('close', {
|
|
88
|
+
type: 'close'
|
|
89
|
+
});
|
|
90
|
+
this.triggerEvent('cancel');
|
|
91
|
+
},
|
|
92
|
+
|
|
93
|
+
}
|
|
94
|
+
});
|
package/pop-center.json
ADDED
package/pop-center.ttml
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
<view class="view-mask {{visible ? 'show' : ''}}" style="z-index: {{zindex}};" bindtap="onMaskClick">
|
|
2
|
+
<view class="view-content {{visible ? 'show' : ''}}" style="width: {{width}}%;" catchtap="stopPropagation">
|
|
3
|
+
|
|
4
|
+
<!-- 标题 -->
|
|
5
|
+
<view tt:if="{{title}}" class="popup-title">{{title}}</view>
|
|
6
|
+
|
|
7
|
+
<!-- 内容区 -->
|
|
8
|
+
<view class="popup-msg">
|
|
9
|
+
{{message}}
|
|
10
|
+
</view>
|
|
11
|
+
|
|
12
|
+
<!-- 底部操作栏：默认 取消/确认 按钮 -->
|
|
13
|
+
<view class="popup-footer" tt:if="{{!hideFooter}}">
|
|
14
|
+
<button class="btn cancel" bindtap="onCancel">{{cancelText}}</button>
|
|
15
|
+
<button class="btn confirm" bindtap="onConfirm">{{confirmText}}</button>
|
|
16
|
+
</view>
|
|
17
|
+
|
|
18
|
+
<!-- 右上角 关闭按钮 -->
|
|
19
|
+
<view tt:if="{{showClose}}" class="popup-close" bindtap="onClose">×</view>
|
|
20
|
+
</view>
|
|
21
|
+
|
|
22
|
+
</view>
|
package/pop-center.ttss
ADDED
|
@@ -0,0 +1,165 @@
|
|
|
1
|
+
/* 遮罩： 固定定位 + 半透明（0.5） */
|
|
2
|
+
.view-mask {
|
|
3
|
+
position: fixed;
|
|
4
|
+
top: 0;
|
|
5
|
+
left: 0;
|
|
6
|
+
right: 0;
|
|
7
|
+
bottom: 0;
|
|
8
|
+
background: rgba(0, 0, 0, 0.5);
|
|
9
|
+
display: flex;
|
|
10
|
+
opacity: 0;
|
|
11
|
+
/* 初始透明 */
|
|
12
|
+
pointer-events: none;
|
|
13
|
+
/* 隐藏时不响应点击 */
|
|
14
|
+
transition: opacity 0.3s ease;
|
|
15
|
+
/* 淡入淡出过渡，时长0.3s */
|
|
16
|
+
|
|
17
|
+
/* z-index: 999; */
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
/* 遮罩层显示状态 */
|
|
21
|
+
.view-mask.show {
|
|
22
|
+
opacity: 1;
|
|
23
|
+
/* 完全不透明 */
|
|
24
|
+
pointer-events: auto;
|
|
25
|
+
/* 响应点击 */
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
/* 弹窗主体：常用圆角20rpx，白底 */
|
|
29
|
+
.view-content {
|
|
30
|
+
position: fixed;
|
|
31
|
+
top: 50%;
|
|
32
|
+
left: 50%;
|
|
33
|
+
transform: translate(-50%, -50%) scale(0.9);
|
|
34
|
+
|
|
35
|
+
background: #FFFFFF;
|
|
36
|
+
border-radius: 30rpx;
|
|
37
|
+
padding: 40rpx 40rpx 50rpx;
|
|
38
|
+
box-sizing: border-box;
|
|
39
|
+
|
|
40
|
+
opacity: 0;
|
|
41
|
+
/* 初始透明 */
|
|
42
|
+
pointer-events: none;
|
|
43
|
+
/* 隐藏时不响应点击 */
|
|
44
|
+
/* 透明度+缩放同时过渡，曲线ease更自然 */
|
|
45
|
+
transition: opacity 0.3s ease, transform 0.3s ease;
|
|
46
|
+
|
|
47
|
+
max-height: 40vh;
|
|
48
|
+
overflow: hidden;
|
|
49
|
+
display: flex;
|
|
50
|
+
flex-direction: column;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
/* 弹窗主体显示状态 */
|
|
54
|
+
.view-content.show {
|
|
55
|
+
opacity: 1;
|
|
56
|
+
/* 完全不透明 */
|
|
57
|
+
transform: translate(-50%, -50%) scale(1);
|
|
58
|
+
/* 恢复原大小 */
|
|
59
|
+
pointer-events: auto;
|
|
60
|
+
/* 响应点击 */
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.view-slot {
|
|
64
|
+
display: flex;
|
|
65
|
+
flex: 1;
|
|
66
|
+
flex-direction: column;
|
|
67
|
+
overflow-y: auto;
|
|
68
|
+
/* background-color: red; */
|
|
69
|
+
padding: 30rpx 0;
|
|
70
|
+
align-items: center;
|
|
71
|
+
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.popup-title {
|
|
77
|
+
font-size: 40rpx;
|
|
78
|
+
font-weight: 600;
|
|
79
|
+
text-align: center;
|
|
80
|
+
margin-bottom: 20rpx;
|
|
81
|
+
color: #232832;
|
|
82
|
+
font-style: italic;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.popup-footer {
|
|
86
|
+
display: flex;
|
|
87
|
+
margin-top: 30rpx;
|
|
88
|
+
gap: 50rpx;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
/* 核心重置：只解决伪元素遮挡+原生外观问题（必写） */
|
|
93
|
+
button {
|
|
94
|
+
-webkit-appearance: none !important;
|
|
95
|
+
/* 去掉原生外观（关键） */
|
|
96
|
+
appearance: none !important;
|
|
97
|
+
border: none !important;
|
|
98
|
+
/* 清空默认边框 */
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
button::after {
|
|
102
|
+
content: none !important;
|
|
103
|
+
/* 直接移除遮挡的伪元素（核心） */
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
.btn {
|
|
107
|
+
flex: 1;
|
|
108
|
+
height: 80rpx;
|
|
109
|
+
line-height: 80rpx;
|
|
110
|
+
border-radius: 40rpx;
|
|
111
|
+
color: #333333;
|
|
112
|
+
font-size: 30rpx;
|
|
113
|
+
padding: 0;
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.cancel {
|
|
117
|
+
background: #FFFFFF;
|
|
118
|
+
color: #333333;
|
|
119
|
+
border: 2rpx solid #D1D1D6 !important;
|
|
120
|
+
transition: background-color 0.1s;
|
|
121
|
+
|
|
122
|
+
/* box-shadow: 0 0 0 rgba(0, 0, 0, 0);
|
|
123
|
+
transition: box-shadow 0.1s; */
|
|
124
|
+
/* 按压 */
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.cancel:active {
|
|
128
|
+
background-color: #f5f5f5;
|
|
129
|
+
|
|
130
|
+
/* box-shadow: inset 0 2rpx 4rpx rgba(0, 0, 0, 0.2); */
|
|
131
|
+
/* 按压 */
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.confirm {
|
|
135
|
+
/* 主色调 */
|
|
136
|
+
color: #ffffff;
|
|
137
|
+
font-weight: 600;
|
|
138
|
+
|
|
139
|
+
background: linear-gradient(180deg, #FF8684 0%, #CB6DF3 100%);
|
|
140
|
+
transition: opacity 0.15s;
|
|
141
|
+
/* 过渡丝滑 */
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
.confirm:active {
|
|
145
|
+
opacity: 0.65;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.popup-close {
|
|
149
|
+
position: absolute;
|
|
150
|
+
top: 0;
|
|
151
|
+
right: 0;
|
|
152
|
+
font-size: 40rpx;
|
|
153
|
+
color: #999;
|
|
154
|
+
padding: 20rpx 20rpx 60rpx 60rpx;
|
|
155
|
+
background-color: #333;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
.popup-msg {
|
|
159
|
+
font-size: 30rpx;
|
|
160
|
+
color: #232832;
|
|
161
|
+
text-align: center;
|
|
162
|
+
line-height: 1.5;
|
|
163
|
+
/* background-color: red; */
|
|
164
|
+
padding: 20rpx 0 30rpx;
|
|
165
|
+
}
|
package/pop-center.wxml
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
<view class="view-mask {{visible ? 'show' : ''}}" style="z-index: {{zindex}};" bindtap="onMaskClick">
|
|
2
|
+
<view class="view-content {{visible ? 'show' : ''}}" style="width: {{width}}%;" catchtap="stopPropagation">
|
|
3
|
+
|
|
4
|
+
<!-- 标题 -->
|
|
5
|
+
<view wx:if="{{title}}" class="popup-title">{{title}}</view>
|
|
6
|
+
|
|
7
|
+
<!-- 内容区 -->
|
|
8
|
+
<view class="popup-msg">
|
|
9
|
+
{{message}}
|
|
10
|
+
</view>
|
|
11
|
+
|
|
12
|
+
<!-- 底部操作栏：默认 取消/确认 按钮 -->
|
|
13
|
+
<view class="popup-footer" wx:if="{{!hideFooter}}">
|
|
14
|
+
<button class="btn cancel" bindtap="onCancel">{{cancelText}}</button>
|
|
15
|
+
<button class="btn confirm" bindtap="onConfirm">{{confirmText}}</button>
|
|
16
|
+
</view>
|
|
17
|
+
|
|
18
|
+
<!-- 右上角 关闭按钮 -->
|
|
19
|
+
<view wx:if="{{showClose}}" class="popup-close" bindtap="onClose">×</view>
|
|
20
|
+
</view>
|
|
21
|
+
|
|
22
|
+
</view>
|
package/pop-center.wxss
ADDED
|
@@ -0,0 +1,165 @@
|
|
|
1
|
+
/* 遮罩： 固定定位 + 半透明（0.5） */
|
|
2
|
+
.view-mask {
|
|
3
|
+
position: fixed;
|
|
4
|
+
top: 0;
|
|
5
|
+
left: 0;
|
|
6
|
+
right: 0;
|
|
7
|
+
bottom: 0;
|
|
8
|
+
background: rgba(0, 0, 0, 0.5);
|
|
9
|
+
display: flex;
|
|
10
|
+
opacity: 0;
|
|
11
|
+
/* 初始透明 */
|
|
12
|
+
pointer-events: none;
|
|
13
|
+
/* 隐藏时不响应点击 */
|
|
14
|
+
transition: opacity 0.3s ease;
|
|
15
|
+
/* 淡入淡出过渡，时长0.3s */
|
|
16
|
+
|
|
17
|
+
/* z-index: 999; */
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
/* 遮罩层显示状态 */
|
|
21
|
+
.view-mask.show {
|
|
22
|
+
opacity: 1;
|
|
23
|
+
/* 完全不透明 */
|
|
24
|
+
pointer-events: auto;
|
|
25
|
+
/* 响应点击 */
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
/* 弹窗主体：常用圆角20rpx，白底 */
|
|
29
|
+
.view-content {
|
|
30
|
+
position: fixed;
|
|
31
|
+
top: 50%;
|
|
32
|
+
left: 50%;
|
|
33
|
+
transform: translate(-50%, -50%) scale(0.9);
|
|
34
|
+
|
|
35
|
+
background: #FFFFFF;
|
|
36
|
+
border-radius: 30rpx;
|
|
37
|
+
padding: 40rpx 40rpx 50rpx;
|
|
38
|
+
box-sizing: border-box;
|
|
39
|
+
|
|
40
|
+
opacity: 0;
|
|
41
|
+
/* 初始透明 */
|
|
42
|
+
pointer-events: none;
|
|
43
|
+
/* 隐藏时不响应点击 */
|
|
44
|
+
/* 透明度+缩放同时过渡，曲线ease更自然 */
|
|
45
|
+
transition: opacity 0.3s ease, transform 0.3s ease;
|
|
46
|
+
|
|
47
|
+
max-height: 40vh;
|
|
48
|
+
overflow: hidden;
|
|
49
|
+
display: flex;
|
|
50
|
+
flex-direction: column;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
/* 弹窗主体显示状态 */
|
|
54
|
+
.view-content.show {
|
|
55
|
+
opacity: 1;
|
|
56
|
+
/* 完全不透明 */
|
|
57
|
+
transform: translate(-50%, -50%) scale(1);
|
|
58
|
+
/* 恢复原大小 */
|
|
59
|
+
pointer-events: auto;
|
|
60
|
+
/* 响应点击 */
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.view-slot {
|
|
64
|
+
display: flex;
|
|
65
|
+
flex: 1;
|
|
66
|
+
flex-direction: column;
|
|
67
|
+
overflow-y: auto;
|
|
68
|
+
/* background-color: red; */
|
|
69
|
+
padding: 30rpx 0;
|
|
70
|
+
align-items: center;
|
|
71
|
+
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.popup-title {
|
|
77
|
+
font-size: 40rpx;
|
|
78
|
+
font-weight: 600;
|
|
79
|
+
text-align: center;
|
|
80
|
+
margin-bottom: 20rpx;
|
|
81
|
+
color: #232832;
|
|
82
|
+
font-style: italic;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.popup-footer {
|
|
86
|
+
display: flex;
|
|
87
|
+
margin-top: 30rpx;
|
|
88
|
+
gap: 50rpx;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
/* 核心重置：只解决伪元素遮挡+原生外观问题（必写） */
|
|
93
|
+
button {
|
|
94
|
+
-webkit-appearance: none !important;
|
|
95
|
+
/* 去掉原生外观（关键） */
|
|
96
|
+
appearance: none !important;
|
|
97
|
+
border: none !important;
|
|
98
|
+
/* 清空默认边框 */
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
button::after {
|
|
102
|
+
content: none !important;
|
|
103
|
+
/* 直接移除遮挡的伪元素（核心） */
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
.btn {
|
|
107
|
+
flex: 1;
|
|
108
|
+
height: 80rpx;
|
|
109
|
+
line-height: 80rpx;
|
|
110
|
+
border-radius: 40rpx;
|
|
111
|
+
color: #333333;
|
|
112
|
+
font-size: 30rpx;
|
|
113
|
+
padding: 0;
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.cancel {
|
|
117
|
+
background: #FFFFFF;
|
|
118
|
+
color: #333333;
|
|
119
|
+
border: 2rpx solid #D1D1D6 !important;
|
|
120
|
+
transition: background-color 0.1s;
|
|
121
|
+
|
|
122
|
+
/* box-shadow: 0 0 0 rgba(0, 0, 0, 0);
|
|
123
|
+
transition: box-shadow 0.1s; */
|
|
124
|
+
/* 按压 */
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.cancel:active {
|
|
128
|
+
background-color: #f5f5f5;
|
|
129
|
+
|
|
130
|
+
/* box-shadow: inset 0 2rpx 4rpx rgba(0, 0, 0, 0.2); */
|
|
131
|
+
/* 按压 */
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.confirm {
|
|
135
|
+
/* 主色调 */
|
|
136
|
+
color: #ffffff;
|
|
137
|
+
font-weight: 600;
|
|
138
|
+
|
|
139
|
+
background: linear-gradient(180deg, #FF8684 0%, #CB6DF3 100%);
|
|
140
|
+
transition: opacity 0.15s;
|
|
141
|
+
/* 过渡丝滑 */
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
.confirm:active {
|
|
145
|
+
opacity: 0.65;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.popup-close {
|
|
149
|
+
position: absolute;
|
|
150
|
+
top: 0;
|
|
151
|
+
right: 0;
|
|
152
|
+
font-size: 40rpx;
|
|
153
|
+
color: #999;
|
|
154
|
+
padding: 20rpx 20rpx 60rpx 60rpx;
|
|
155
|
+
background-color: #333;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
.popup-msg {
|
|
159
|
+
font-size: 30rpx;
|
|
160
|
+
color: #232832;
|
|
161
|
+
text-align: center;
|
|
162
|
+
line-height: 1.5;
|
|
163
|
+
/* background-color: red; */
|
|
164
|
+
padding: 20rpx 0 30rpx;
|
|
165
|
+
}
|