From cff3c5b09f1694f639b4b66721246f3553e1826e Mon Sep 17 00:00:00 2001
From: deepfal <xdp@live.com>
Date: Mon, 18 Aug 2025 14:10:45 +0800
Subject: [PATCH] =?UTF-8?q?refactor(layout):=20=E4=BC=98=E5=8C=96=E9=A6=96?=
 =?UTF-8?q?=E9=A1=B5=E5=B8=83=E5=B1=80=E5=92=8C=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 调整账户列表宽度，从 208px 改为 188px
- 修改底部弧形倒计时进度条的位置和大小
- 调整头部分割线的左右位置
- 优化详情页内容的样式，包括 padding、width 等属性
- 统一代码数字的样式，缩小尺寸以适应新布局
---
 src/pages/index/index.ux | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/pages/index/index.ux b/src/pages/index/index.ux
index 48d3940..67de9af 100644
--- a/src/pages/index/index.ux
+++ b/src/pages/index/index.ux
@@ -9,7 +9,7 @@
     <div class="header-divider"></div>
     
     <!-- 账户列表 -->
-    <list class="totp-list" style="position: absolute; top: 70px; bottom: 70px; left: 2px; right: 2px; width: 208px;">
+    <list class="totp-list" style="position: absolute; top: 70px; bottom: 70px; left: 2px; right: 2px; width: 188px;">
       <list-item class="totp-item" style="height: 115px; margin-bottom: 10px; background-color: #1a1a1a; border-radius: 15px; border: 1px solid #333; flex-direction: column; justify-content: space-between; padding: 8px;" type="account" for="{{totpList}}" onclick="showDetail($idx)">
         <div style="flex-direction: column; width: 100%; margin-bottom: 8px;">
           <text style="font-size: 24px; color: #fff; font-weight: bold; margin-bottom: 3px; text-align: left; width: 100%; line-height: 26px;">{{$item.name}}</text>
@@ -30,7 +30,7 @@
     <!-- 底部弧形倒计时进度条 -->
     <div class="countdown-container" show="{{totpList.length > 0}}">
       <!-- 弧形进度条 -->
-      <progress style="position: absolute; left: 0px; bottom: 10px; center-x: 106px; center-y: 0px; width: 212px; height: 100px; radius: 100px; start-angle: 240deg; total-angle: -120deg; stroke-width: 8px; background-color: rgba(255, 255, 255, 0.2); color: {{progressColor}};" percent="{{timeProgress}}" type="arc"></progress>
+      <progress style="position: absolute; bottom: 10px; center-x: 96px; center-y: 0px; width: 192px; height: 100px; radius: 96px; start-angle: 240deg; total-angle: -120deg; stroke-width: 8px; background-color: rgba(255, 255, 255, 0.2); color: {{progressColor}};" percent="{{timeProgress}}" type="arc"></progress>
       <!-- 倒计时文字 -->
       <text class="countdown-text" style="position: absolute; bottom: 35px; left: 0px; right: 0px; text-align: center; font-size: 20px; font-weight: bold; color: {{textColor}}; transition: color 500ms ease-out;">{{timeLeft}}秒</text>
     </div>
@@ -757,8 +757,8 @@ export default {
 .header-divider {
   position: absolute;
   top: 55px;
-  left: 20px;
-  right: 20px;
+  left: 15px;
+  right: 15px;
   height: 1px;
   background: linear-gradient(to right, transparent, #333, transparent);
   flex-shrink: 0;
@@ -821,7 +821,7 @@ export default {
 
 .detail-content {
   flex: 1;
-  padding: 40px 20px 20px 20px;
+  padding: 40px 15px 20px 15px;
   flex-direction: column;
   align-items: center;
   justify-content: center;
@@ -847,12 +847,12 @@ export default {
   align-items: center;
   justify-content: center;
   margin-bottom: 25px;
-  padding: 20px;
+  padding: 15px;
   background-color: #1a1a1a;
   border-radius: 12px;
   border: 2px solid #333;
   height: 120px;
-  width: 170px;
+  width: 150px;
 }
 
 .detail-code-row {
@@ -863,30 +863,30 @@ export default {
 }
 
 .detail-code-digit {
-  width: 30px;
-  height: 50px;
+  width: 28px;
+  height: 45px;
   margin: 0 1px;
   justify-content: center;
   align-items: center;
 }
 
 .detail-code-num {
-  font-size: 32px;
+  font-size: 28px;
   color: #00ff88;
   font-weight: bold;
   font-family: monospace;
   text-align: center;
-  line-height: 40px;
+  line-height: 35px;
 }
 
 .detail-code-single {
-  font-size: 32px;
+  font-size: 28px;
   color: #00ff88;
   font-weight: bold;
   font-family: monospace;
   letter-spacing: 3px;
   text-align: center;
-  line-height: 40px;
+  line-height: 35px;
 }
 
 .detail-time {