feat: refresh login components

This commit is contained in:
2026-08-07 16:19:21 +08:00
parent 5db761c73e
commit 84371c7024
4 changed files with 18 additions and 11 deletions
+1 -1
View File
@@ -66,7 +66,7 @@ export default function LoginGuard(props: { children: React.ReactNode }) {
<Image className='login-guard-icon' src={assetUrl('/icon/个人.png')} mode='aspectFit' /> <Image className='login-guard-icon' src={assetUrl('/icon/个人.png')} mode='aspectFit' />
<Text className='login-guard-title'></Text> <Text className='login-guard-title'></Text>
<Text className='login-guard-desc'></Text> <Text className='login-guard-desc'></Text>
<View className='btn-gradient login-guard-btn' onTap={() => Taro.switchTab({ url: '/pages/profile/index' })}> <View className='btn-primary login-guard-btn' onTap={() => Taro.switchTab({ url: '/pages/profile/index' })}>
<Text></Text> <Text></Text>
</View> </View>
</View> </View>
+12 -4
View File
@@ -40,7 +40,7 @@
border-radius: 50%; border-radius: 50%;
margin: 0 auto 24px; margin: 0 auto 24px;
background: var(--bg-input); background: var(--bg-input);
border: 3px dashed var(--line-star); border: 1rpx solid var(--border);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -48,6 +48,10 @@
padding: 0; padding: 0;
} }
.avatar-btn:active {
border-color: var(--accent-primary);
}
.avatar-img { .avatar-img {
width: 100%; width: 100%;
height: 100%; height: 100%;
@@ -63,7 +67,7 @@
width: 100%; width: 100%;
height: 80px; height: 80px;
background: var(--bg-input); background: var(--bg-input);
border: 3px dashed var(--line-star); border: 1rpx solid var(--border);
border-radius: 16px; border-radius: 16px;
padding: 0 24px; padding: 0 24px;
font-size: 28px; font-size: 28px;
@@ -72,12 +76,16 @@
text-align: center; text-align: center;
} }
.nickname-input:focus {
border-color: var(--accent-primary);
}
.login-actions { .login-actions {
display: flex; display: flex;
gap: 20px; gap: 20px;
} }
.login-actions .btn-outline, .login-actions .btn-secondary,
.login-actions .btn-gradient { .login-actions .btn-primary {
flex: 1; flex: 1;
} }
+3 -4
View File
@@ -80,8 +80,7 @@ export default function LoginModal({ visible, onClose, onLogin }: { visible: boo
return ( return (
<View className='modal-overlay'> <View className='modal-overlay'>
<View className='login-card dashed-card'> <View className='surface-card login-card'>
<View className='star-badge' />
<Text className='login-title'></Text> <Text className='login-title'></Text>
<Text className='login-desc'></Text> <Text className='login-desc'></Text>
@@ -106,10 +105,10 @@ export default function LoginModal({ visible, onClose, onLogin }: { visible: boo
/> />
<View className='login-actions'> <View className='login-actions'>
<View className='btn-outline' onTap={onClose}> <View className='btn-secondary' onTap={onClose}>
<Text></Text> <Text></Text>
</View> </View>
<View className='btn-gradient' onTap={handleLogin}> <View className='btn-primary' onTap={handleLogin}>
<Text></Text> <Text></Text>
</View> </View>
</View> </View>
+2 -2
View File
@@ -5,7 +5,7 @@
width: 80px; width: 80px;
height: 80px; height: 80px;
border-radius: 50%; border-radius: 50%;
background: rgba(0, 0, 0, 0.35); background: rgba(25, 25, 25, 0.42);
backdrop-filter: blur(8px); backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
border: 1px solid rgba(255, 255, 255, 0.25); border: 1px solid rgba(255, 255, 255, 0.25);
@@ -19,7 +19,7 @@
.theme-toggle:active { .theme-toggle:active {
transform: scale(0.92); transform: scale(0.92);
background: rgba(0, 0, 0, 0.5); background: rgba(25, 25, 25, 0.52);
} }
.theme-icon { .theme-icon {