fix(ui): align binding headers and unify handoff buttons
This commit is contained in:
stu2not
@@ -0,0 +1,17 @@
|
||||
# 绑定相关页面样式复核
|
||||
|
||||
本次统一绑定页标题字体及圆角长框，复用绑定结果页的主、次按钮样式，并修复返回按钮的绝对定位覆盖公共布局所造成的标题边框重叠。标题区左右间距与下方内容区对齐。
|
||||
|
||||
## 截图与验证范围
|
||||
|
||||
使用微信开发者工具 iPhone 12/13 (Pro) 模拟器，屏幕宽度 390px、高度 844px、基础库 3.17.3。截图来自实际小程序页面内容区，使用模拟登录及接口数据，不代表真机验收或真实绑定、解绑操作。
|
||||
|
||||
- `before-bind.png`：本轮复核前，返回按钮仍压在标题框下沿。
|
||||
- `after-bind.png`：修复后的扫码绑定页面。
|
||||
- `after-traffic.png`：流量服务关联页面。
|
||||
- `after-unbind.png`：联合解绑页面。
|
||||
- `after-metrics.json`：通过小程序选择器查询取得的页面元素边界和计算样式。
|
||||
|
||||
测量结果：返回按钮横向范围为 24–89px，标题框为 95–366px，两者不重叠；下方内容框为 24–366px，左右外缘对齐。关联和解绑页按钮横向范围为 20–370px。所检查元素均未超出 390px 页面宽度。
|
||||
|
||||
微信小程序构建通过；现有 33 项测试通过。编译产物中的主、次、等待及禁用按钮样式已核对一致。其他屏幕尺寸及真机显示仍需进一步验证。
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 86 KiB |
@@ -0,0 +1,311 @@
|
||||
{
|
||||
"system": {
|
||||
"brand": "devtools",
|
||||
"model": "iPhone 12/13 (Pro)",
|
||||
"system": "iOS 10.0.1",
|
||||
"platform": "devtools",
|
||||
"benchmarkLevel": -1,
|
||||
"pixelRatio": 3,
|
||||
"screenWidth": 390,
|
||||
"screenHeight": 844,
|
||||
"windowWidth": 390,
|
||||
"windowHeight": 844,
|
||||
"statusBarHeight": 47,
|
||||
"safeArea": {
|
||||
"top": 47,
|
||||
"left": 0,
|
||||
"right": 390,
|
||||
"bottom": 810,
|
||||
"width": 390,
|
||||
"height": 763
|
||||
},
|
||||
"language": "zh_CN",
|
||||
"version": "8.0.5",
|
||||
"fontSizeSetting": 16,
|
||||
"SDKVersion": "3.17.3",
|
||||
"host": {
|
||||
"env": "WeChat"
|
||||
},
|
||||
"enableDebug": false,
|
||||
"mode": "default",
|
||||
"deviceOrientation": "portrait",
|
||||
"bluetoothEnabled": true,
|
||||
"locationEnabled": true,
|
||||
"wifiEnabled": true,
|
||||
"albumAuthorized": true,
|
||||
"cameraAuthorized": true,
|
||||
"locationAuthorized": true,
|
||||
"microphoneAuthorized": true,
|
||||
"notificationAuthorized": true,
|
||||
"notificationAlertAuthorized": true,
|
||||
"notificationBadgeAuthorized": true,
|
||||
"notificationSoundAuthorized": true,
|
||||
"phoneCalendarAuthorized": true,
|
||||
"bluetoothAuthorized": true,
|
||||
"locationReducedAccuracy": true,
|
||||
"devicePixelRatio": 3
|
||||
},
|
||||
"pages": {
|
||||
"bind": [
|
||||
{
|
||||
"selector": ".bind-page",
|
||||
"left": 0,
|
||||
"right": 390,
|
||||
"top": 0,
|
||||
"bottom": 1142,
|
||||
"width": 390,
|
||||
"height": 1142,
|
||||
"display": "block",
|
||||
"position": "relative",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "0px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "103px 0px 96px"
|
||||
},
|
||||
{
|
||||
"selector": ".bind-header",
|
||||
"left": 0,
|
||||
"right": 390,
|
||||
"top": 103,
|
||||
"bottom": 169,
|
||||
"width": 390,
|
||||
"height": 66,
|
||||
"display": "flex",
|
||||
"position": "relative",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "0px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "11px 24px 16px"
|
||||
},
|
||||
{
|
||||
"selector": ".bind-header .back-btn",
|
||||
"left": 24,
|
||||
"right": 89,
|
||||
"top": 117.5,
|
||||
"bottom": 149.5,
|
||||
"width": 65,
|
||||
"height": 32,
|
||||
"display": "flex",
|
||||
"position": "static",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "519px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "6px 9px"
|
||||
},
|
||||
{
|
||||
"selector": ".bind-header .title",
|
||||
"left": 95,
|
||||
"right": 366,
|
||||
"top": 114,
|
||||
"bottom": 153,
|
||||
"width": 271,
|
||||
"height": 39,
|
||||
"display": "flex",
|
||||
"position": "static",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "9px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "6px"
|
||||
},
|
||||
{
|
||||
"selector": ".scan-area",
|
||||
"left": 24,
|
||||
"right": 366,
|
||||
"top": 169,
|
||||
"bottom": 331,
|
||||
"width": 342,
|
||||
"height": 162,
|
||||
"display": "block",
|
||||
"position": "relative",
|
||||
"box-sizing": "content-box",
|
||||
"border-radius": "0px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "0px"
|
||||
},
|
||||
{
|
||||
"selector": ".scan-frame",
|
||||
"left": 24,
|
||||
"right": 366,
|
||||
"top": 169,
|
||||
"bottom": 331,
|
||||
"width": 342,
|
||||
"height": 162,
|
||||
"display": "flex",
|
||||
"position": "static",
|
||||
"box-sizing": "content-box",
|
||||
"border-radius": "12px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "31px 20px"
|
||||
},
|
||||
{
|
||||
"selector": ".form-card",
|
||||
"left": 24,
|
||||
"right": 366,
|
||||
"top": 355,
|
||||
"bottom": 583,
|
||||
"width": 342,
|
||||
"height": 228,
|
||||
"display": "block",
|
||||
"position": "static",
|
||||
"box-sizing": "content-box",
|
||||
"border-radius": "10px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "14px 16px"
|
||||
},
|
||||
{
|
||||
"selector": ".field-input",
|
||||
"left": 41,
|
||||
"right": 349,
|
||||
"top": 477,
|
||||
"bottom": 522,
|
||||
"width": 308,
|
||||
"height": 45,
|
||||
"display": "block",
|
||||
"position": "static",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "8px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "0px 12px"
|
||||
}
|
||||
],
|
||||
"traffic": [
|
||||
{
|
||||
"selector": ".traffic-binding-page",
|
||||
"left": 0,
|
||||
"right": 390,
|
||||
"top": 0,
|
||||
"bottom": 753,
|
||||
"width": 390,
|
||||
"height": 753,
|
||||
"display": "block",
|
||||
"position": "static",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "0px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "37px 20px"
|
||||
},
|
||||
{
|
||||
"selector": ".title",
|
||||
"left": 20,
|
||||
"right": 370,
|
||||
"top": 37,
|
||||
"bottom": 63,
|
||||
"width": 350,
|
||||
"height": 26,
|
||||
"display": "block",
|
||||
"position": "static",
|
||||
"box-sizing": "content-box",
|
||||
"border-radius": "0px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "0px"
|
||||
},
|
||||
{
|
||||
"selector": ".description",
|
||||
"left": 20,
|
||||
"right": 370,
|
||||
"top": 78,
|
||||
"bottom": 124,
|
||||
"width": 350,
|
||||
"height": 46,
|
||||
"display": "block",
|
||||
"position": "static",
|
||||
"box-sizing": "content-box",
|
||||
"border-radius": "0px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "0px"
|
||||
},
|
||||
{
|
||||
"selector": ".traffic-action.primary",
|
||||
"left": 20,
|
||||
"right": 370,
|
||||
"top": 139,
|
||||
"bottom": 186,
|
||||
"width": 350,
|
||||
"height": 47,
|
||||
"display": "flex",
|
||||
"position": "relative",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "23px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "9px 14px"
|
||||
},
|
||||
{
|
||||
"selector": ".traffic-action.secondary",
|
||||
"left": 20,
|
||||
"right": 370,
|
||||
"top": 200,
|
||||
"bottom": 247,
|
||||
"width": 350,
|
||||
"height": 47,
|
||||
"display": "flex",
|
||||
"position": "relative",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "23px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "9px 14px"
|
||||
}
|
||||
],
|
||||
"unbind": [
|
||||
{
|
||||
"selector": ".traffic-binding-page",
|
||||
"left": 0,
|
||||
"right": 390,
|
||||
"top": 0,
|
||||
"bottom": 753,
|
||||
"width": 390,
|
||||
"height": 753,
|
||||
"display": "block",
|
||||
"position": "static",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "0px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "37px 20px"
|
||||
},
|
||||
{
|
||||
"selector": ".title",
|
||||
"left": 20,
|
||||
"right": 370,
|
||||
"top": 37,
|
||||
"bottom": 63,
|
||||
"width": 350,
|
||||
"height": 26,
|
||||
"display": "block",
|
||||
"position": "static",
|
||||
"box-sizing": "content-box",
|
||||
"border-radius": "0px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "0px"
|
||||
},
|
||||
{
|
||||
"selector": ".traffic-action.primary",
|
||||
"left": 20,
|
||||
"right": 370,
|
||||
"top": 162,
|
||||
"bottom": 209,
|
||||
"width": 350,
|
||||
"height": 47,
|
||||
"display": "flex",
|
||||
"position": "relative",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "23px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "9px 14px"
|
||||
},
|
||||
{
|
||||
"selector": ".traffic-action.secondary",
|
||||
"left": 20,
|
||||
"right": 370,
|
||||
"top": 223,
|
||||
"bottom": 270,
|
||||
"width": 350,
|
||||
"height": 47,
|
||||
"display": "flex",
|
||||
"position": "relative",
|
||||
"box-sizing": "border-box",
|
||||
"border-radius": "23px",
|
||||
"font-family": "-apple-system, system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
|
||||
"padding": "9px 14px"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 73 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 79 KiB |
Reference in New Issue
Block a user