diff --git a/miniprogram/pages/index/index.wxml b/miniprogram/pages/index/index.wxml index 5925683..97b9c01 100644 --- a/miniprogram/pages/index/index.wxml +++ b/miniprogram/pages/index/index.wxml @@ -18,15 +18,18 @@ - 💆 - {{deviceName || '我的光面膜'}} - 已连接 - 未连接 - - - 🔋 - 电量 {{battery}}% + + 💆 + + {{deviceName || '我的光面膜'}} + + 已连接 + 未连接 + 🔋 {{battery}}% + + + @@ -38,7 +41,9 @@ - - + + + + diff --git a/miniprogram/pages/index/index.wxss b/miniprogram/pages/index/index.wxss index c2b997d..accaf34 100644 --- a/miniprogram/pages/index/index.wxss +++ b/miniprogram/pages/index/index.wxss @@ -19,6 +19,69 @@ border: none; } +.device-card { + background: #fff; + border-radius: 16rpx; + padding: 28rpx; +} + +.device-card-top { + display: flex; + align-items: center; + gap: 20rpx; +} + +.device-icon { + font-size: 64rpx; + flex-shrink: 0; +} + +.device-info { + flex: 1; +} + +.device-name { + font-size: 32rpx; + font-weight: 600; + color: #333; + margin-bottom: 8rpx; +} + +.device-meta { + display: flex; + align-items: center; + gap: 16rpx; +} + +.device-battery-text { + font-size: 24rpx; + color: #666; +} + +.btn-reconnect { + display: block; + width: 100%; + margin-top: 20rpx; + padding: 20rpx; + background: #f5f5f5; + color: #E6508C; + border: 2rpx solid #E6508C; + border-radius: 12rpx; + font-size: 28rpx; + text-align: center; +} + +.btn-reconnect::after { + border: none; +} + +.action-buttons { + margin-top: 30rpx; + display: flex; + flex-direction: column; + gap: 20rpx; +} + .sub-info { display: flex; justify-content: space-between;