小程序接入支付功能

2026-09-29 01:14:24 +08:00
1 parent edf1e51846
commit 07a90e860d
@@ -0,0 +1,102 @@
+.page {
+  min-height: 100vh;
+  padding: 32rpx 28rpx 48rpx;
+  background: var(--bg);
+}
+
+.head {
+  margin-bottom: 28rpx;
+}
+
+.head-title {
+  font-size: 40rpx;
+  font-weight: 600;
+  color: #ffffff;
+}
+
+.head-sub {
+  margin-top: 8rpx;
+  font-size: 24rpx;
+  color: rgba(255, 255, 255, 0.45);
+}
+
+.banner {
+  padding: 22rpx 26rpx;
+  margin-bottom: 20rpx;
+  border-radius: var(--r-lg);
+  background: var(--panel);
+  color: rgba(255, 255, 255, 0.6);
+  font-size: 25rpx;
+  line-height: 1.6;
+}
+
+.card {
+  padding: 26rpx 28rpx;
+  margin-bottom: 20rpx;
+  border-radius: var(--r-lg);
+  background: var(--panel);
+}
+
+.card:active {
+  background: var(--panel-2);
+}
+
+.card-name {
+  font-size: 26rpx;
+  color: rgba(255, 255, 255, 0.55);
+}
+
+.card-tag {
+  margin-left: 14rpx;
+  padding: 2rpx 14rpx;
+  border-radius: var(--r-pill);
+  background: rgba(245, 158, 11, 0.16);
+  color: #f0b45c;
+  font-size: 20rpx;
+}
+
+.card-code {
+  margin-top: 14rpx;
+  font-size: 38rpx;
+  font-weight: 600;
+  letter-spacing: 4rpx;
+  color: var(--cyan);
+  word-break: break-all;
+}
+
+.card-time {
+  font-size: 22rpx;
+  color: rgba(255, 255, 255, 0.35);
+}
+
+.card-bottom {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 12rpx;
+}
+
+.card-refund {
+  padding: 6rpx 22rpx;
+  border-radius: var(--r-pill);
+  border: 2rpx solid rgba(255, 255, 255, 0.14);
+  color: rgba(255, 255, 255, 0.55);
+  font-size: 22rpx;
+}
+
+.card-refund:active {
+  background: rgba(255, 255, 255, 0.06);
+}
+
+.tip {
+  margin-top: 10rpx;
+  font-size: 22rpx;
+  line-height: 1.7;
+  color: rgba(255, 255, 255, 0.35);
+}
+
+/* 空态跟着标题走，不用撑满整屏 */
+.placeholder {
+  height: auto;
+  padding: 140rpx 40rpx 0;
+}