45 lines
3.6 KiB
Plaintext
45 lines
3.6 KiB
Plaintext
page { background: #000; color: #fff; }
|
|
.page { min-height: 100vh; padding-bottom: 80rpx; box-sizing: border-box; }
|
|
.nav-placeholder { width: 100%; }
|
|
.header { display: flex; align-items: center; padding: 24rpx 32rpx; border-bottom: 2rpx solid rgba(255,255,255,0.05); }
|
|
.nav-back { font-size: 32rpx; color: #00CED1; margin-right: 24rpx; }
|
|
.header-title { flex: 1; text-align: center; font-size: 34rpx; color: #00CED1; }
|
|
|
|
.main { padding: 32rpx; }
|
|
.card { border-radius: 32rpx; background: #1c1c1e; border: 2rpx solid rgba(255,255,255,0.05); overflow: hidden; margin-bottom: 24rpx; }
|
|
.card-head { display: flex; align-items: flex-start; gap: 24rpx; padding: 32rpx; border-bottom: 2rpx solid rgba(255,255,255,0.05); }
|
|
.card-icon { font-size: 36rpx; }
|
|
.card-title { font-size: 30rpx; color: #fff; font-weight: 500; display: block; }
|
|
.card-desc { font-size: 24rpx; color: rgba(255,255,255,0.4); display: block; margin-top: 8rpx; }
|
|
|
|
.bind-item { display: flex; align-items: center; justify-content: space-between; padding: 32rpx; border-bottom: 2rpx solid rgba(255,255,255,0.05); }
|
|
.bind-item:last-child { border-bottom: none; }
|
|
.bind-left { display: flex; align-items: center; gap: 24rpx; flex: 1; min-width: 0; }
|
|
.bind-icon { width: 64rpx; height: 64rpx; border-radius: 50%; background: rgba(255,255,255,0.1); display: flex; align-items: center; justify-content: center; font-size: 32rpx; flex-shrink: 0; }
|
|
.bind-icon.bound { background: rgba(0,206,209,0.2); }
|
|
.bind-icon.wechat.bound { background: rgba(7,193,96,0.2); }
|
|
.bind-icon.alipay.bound { background: rgba(22,119,255,0.2); }
|
|
.bind-icon.addr { background: rgba(249,115,22,0.2); }
|
|
.bind-label { font-size: 28rpx; color: #fff; display: block; }
|
|
.bind-value { font-size: 24rpx; color: rgba(255,255,255,0.4); display: block; margin-top: 4rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
.bind-action { font-size: 24rpx; color: rgba(255,255,255,0.5); }
|
|
.bind-action.brand { color: #00CED1; }
|
|
.bind-action.green { color: #07C160; }
|
|
.bind-action.blue { color: #1677FF; }
|
|
|
|
.hint { padding: 24rpx 32rpx; border-radius: 24rpx; background: rgba(249,115,22,0.1); border: 2rpx solid rgba(249,115,22,0.2); margin-bottom: 24rpx; }
|
|
.hint text { font-size: 24rpx; color: rgba(249,115,22,0.9); }
|
|
|
|
.btn-logout { width: 100%; padding: 28rpx; border-radius: 24rpx; background: #1c1c1e; border: 2rpx solid rgba(248,113,113,0.4); color: #f87171; font-size: 30rpx; font-weight: 500; text-align: center; }
|
|
|
|
.mask { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); z-index: 100; display: flex; align-items: center; justify-content: center; padding: 48rpx; box-sizing: border-box; }
|
|
.modal { width: 100%; max-width: 600rpx; background: #1c1c1e; border-radius: 32rpx; overflow: hidden; }
|
|
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 32rpx; border-bottom: 2rpx solid rgba(255,255,255,0.1); }
|
|
.modal-title { font-size: 36rpx; font-weight: 600; color: #fff; }
|
|
.modal-close { width: 64rpx; height: 64rpx; border-radius: 50%; background: rgba(255,255,255,0.1); display: flex; align-items: center; justify-content: center; font-size: 40rpx; color: rgba(255,255,255,0.6); }
|
|
.modal-body { padding: 32rpx; }
|
|
.bind-input { width: 100%; padding: 24rpx 32rpx; border-radius: 24rpx; background: rgba(0,0,0,0.3); border: 2rpx solid rgba(255,255,255,0.1); color: #fff; font-size: 28rpx; box-sizing: border-box; margin-bottom: 24rpx; }
|
|
.bind-err { font-size: 24rpx; color: #f87171; display: block; margin-bottom: 16rpx; }
|
|
.btn-primary { width: 100%; padding: 24rpx; border-radius: 24rpx; background: #00CED1; color: #000; font-size: 30rpx; font-weight: 500; text-align: center; }
|
|
.btn-primary.disabled { opacity: 0.5; }
|