From afc03152e434714da0babd8829fa73174488bd4f Mon Sep 17 00:00:00 2001
From: Ap_Tx <3045929398@qq.com>
Date: Tue, 20 Oct 2026 22:15:04 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E9=AA=8C=E8=AF=81=E7=A0=81=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E6=94=B9=E4=B8=BA=E5=AE=8C=E6=95=B4=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=E5=B9=B6=E8=A1=A5=E4=B8=8A=E8=A7=92=E5=BA=A6=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ui/skin-site/SkinSiteCaptchaModal.vue           | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/apps/app-frontend/src/components/ui/skin-site/SkinSiteCaptchaModal.vue b/apps/app-frontend/src/components/ui/skin-site/SkinSiteCaptchaModal.vue
index bb593c5..cda6733 100644
--- a/apps/app-frontend/src/components/ui/skin-site/SkinSiteCaptchaModal.vue
+++ b/apps/app-frontend/src/components/ui/skin-site/SkinSiteCaptchaModal.vue
@@ -100,16 +100,19 @@ defineExpose({ show })
 			<p class="m-0 text-secondary">{{ formatMessage(messages.subtitle) }}</p>
 
 			<div
-				class="size-44 overflow-hidden rounded-full border-4 border-solid border-bg-raised bg-button-bg"
+				class="relative size-64 overflow-hidden rounded-2xl border-2 border-solid border-surface-5 bg-bg"
 			>
 				<img
 					v-if="image"
 					:src="image"
 					alt=""
-					class="size-full object-cover transition-transform duration-75"
+					class="size-full object-contain transition-transform duration-75"
 					:style="{ transform: `rotate(${previewRotation})` }"
 					draggable="false"
 				/>
+				<div v-else class="flex size-full items-center justify-center text-sm text-secondary">
+					{{ formatMessage(messages.loading) }}
+				</div>
 			</div>
 
 			<div class="w-full max-w-sm">
@@ -122,11 +125,9 @@ defineExpose({ show })
 					class="w-full accent-brand"
 					:disabled="loading || submitting"
 				/>
-				<div class="mt-1 flex justify-between text-xs text-secondary">
+				<div class="mt-1 flex items-center justify-between text-xs text-secondary">
 					<span>0°</span>
-					<span>90°</span>
-					<span>180°</span>
-					<span>270°</span>
+					<span class="font-semibold text-contrast">{{ degree }}°</span>
 					<span>360°</span>
 				</div>
 			</div>