feat/ui: 添加详情页面样式并更新应用包名

- 新增详情页面样式，包括服务名称、账号、验证码容器等元素的样式
- 更新应用包名从 "com.deepfal.totp.authenticator" 到 "cn.deepfal.band.TOTPauthenticator"

src/manifest.json

@@ -1,7 +1,7 @@
 {
-  "package": "com.deepfal.totp.authenticator",
+  "package": "cn.deepfal.band.TOTPauthenticator",
   "name": "TOTP",
-  "versionName": "1.0.1",
+  "versionName": "1.0.2",
   "versionCode": 1,
   "minPlatformVersion": 1000,
   "icon": "/common/logo.png",

src/pages/index/index.ux

@@ -433,4 +433,115 @@ export default {
   color: #fff;
   transition: color 500ms ease-out;
 }
+
+/* 详情页面 */
+.detail-page {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: #000;
+  flex-direction: column;
+  z-index: 100;
+}
+
+.detail-content {
+  flex: 1;
+  padding: 40px 20px 20px 20px;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+.detail-service {
+  font-size: 28px;
+  color: #fff;
+  font-weight: bold;
+  margin-bottom: 8px;
+  text-align: center;
+}
+
+.detail-account {
+  font-size: 22px;
+  color: #999;
+  margin-bottom: 30px;
+  text-align: center;
+}
+
+.detail-code-container {
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 25px;
+  padding: 20px;
+  background-color: #1a1a1a;
+  border-radius: 12px;
+  border: 2px solid #333;
+  height: 120px;
+  width: 170px;
+}
+
+.detail-code-row {
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  margin: 6px 0;
+}
+
+.detail-code-digit {
+  width: 30px;
+  height: 50px;
+  margin: 0 1px;
+  justify-content: center;
+  align-items: center;
+}
+
+.detail-code-num {
+  font-size: 32px;
+  color: #00ff88;
+  font-weight: bold;
+  font-family: monospace;
+  text-align: center;
+  line-height: 40px;
+}
+
+.detail-code-single {
+  font-size: 32px;
+  color: #00ff88;
+  font-weight: bold;
+  font-family: monospace;
+  letter-spacing: 3px;
+  text-align: center;
+  line-height: 40px;
+}
+
+.detail-time {
+  font-size: 22px;
+  color: #AAA;
+  text-align: center;
+}
+
+/* 底部按钮容器 */
+.detail-footer {
+  height: 100px;
+  justify-content: center;
+  align-items: center;
+}
+
+.detail-back-btn {
+  width: 70px;
+  height: 70px;
+  background-color: rgba(0, 0, 0, 0.6);
+  border-radius: 35px;
+  justify-content: center;
+  align-items: center;
+  border: 2px solid #333;
+}
+
+.detail-back-icon {
+  font-size: 28px;
+  color: #fff;
+  font-weight: bold;
+}
 </style>