Feat: dark mode for independent pages (#17045)

This commit is contained in:
KVOJJJin
2025-03-31 10:28:19 +08:00
committed by GitHub
parent 46d235bca0
commit e008faf729
16 changed files with 66 additions and 110 deletions

View File

@@ -86,8 +86,8 @@ const ChangePasswordForm = () => {
{verifyTokenRes && !verifyTokenRes.is_valid && (
<div className="flex flex-col md:w-[400px]">
<div className="mx-auto w-full">
<div className="mb-3 flex h-20 w-20 items-center justify-center rounded-[20px] border border-gray-100 p-5 text-[40px] font-bold shadow-lg">🤷</div>
<h2 className="text-[32px] font-bold text-gray-900">{t('login.invalid')}</h2>
<div className="mb-3 flex h-20 w-20 items-center justify-center rounded-[20px] border border-divider-regular bg-components-option-card-option-bg p-5 text-[40px] font-bold shadow-lg">🤷</div>
<h2 className="text-[32px] font-bold text-text-primary">{t('login.invalid')}</h2>
</div>
<div className="mx-auto mt-6 w-full">
<Button variant='primary' className='w-full !text-sm'>
@@ -99,19 +99,19 @@ const ChangePasswordForm = () => {
{verifyTokenRes && verifyTokenRes.is_valid && !showSuccess && (
<div className='flex flex-col md:w-[400px]'>
<div className="mx-auto w-full">
<h2 className="text-[32px] font-bold text-gray-900">
<h2 className="text-[32px] font-bold text-text-primary">
{t('login.changePassword')}
</h2>
<p className='mt-1 text-sm text-gray-600'>
<p className='mt-1 text-sm text-text-secondary'>
{t('login.changePasswordTip')}
</p>
</div>
<div className="mx-auto mt-6 w-full">
<div className="bg-white">
<div className="relative">
{/* Password */}
<div className='mb-5'>
<label htmlFor="password" className="my-2 flex items-center justify-between text-sm font-medium text-gray-900">
<label htmlFor="password" className="my-2 flex items-center justify-between text-sm font-medium text-text-primary">
{t('common.account.newPassword')}
</label>
<Input
@@ -126,7 +126,7 @@ const ChangePasswordForm = () => {
</div>
{/* Confirm Password */}
<div className='mb-5'>
<label htmlFor="confirmPassword" className="my-2 flex items-center justify-between text-sm font-medium text-gray-900">
<label htmlFor="confirmPassword" className="my-2 flex items-center justify-between text-sm font-medium text-text-primary">
{t('common.account.confirmPassword')}
</label>
<Input
@@ -154,10 +154,10 @@ const ChangePasswordForm = () => {
{verifyTokenRes && verifyTokenRes.is_valid && showSuccess && (
<div className="flex flex-col md:w-[400px]">
<div className="mx-auto w-full">
<div className="mb-3 flex h-20 w-20 items-center justify-center rounded-[20px] border border-gray-100 p-5 text-[40px] font-bold shadow-lg">
<div className="mb-3 flex h-20 w-20 items-center justify-center rounded-[20px] border border-divider-regular bg-components-option-card-option-bg p-5 text-[40px] font-bold shadow-lg">
<CheckCircleIcon className='h-10 w-10 text-[#039855]' />
</div>
<h2 className="text-[32px] font-bold text-gray-900">
<h2 className="text-[32px] font-bold text-text-primary">
{t('login.passwordChangedTip')}
</h2>
</div>