admin/dify
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Feat: dark mode for independent pages (#17045)

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

18
web/app/forgot-password/ChangePasswordForm.tsx
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>

8
web/app/forgot-password/ForgotPasswordForm.tsx
View File

@@ -82,20 +82,20 @@ const ForgotPasswordForm = () => {
? <Loading />
: <>
<div className="sm:mx-auto sm:w-full sm:max-w-md">
<h2 className="text-[32px] font-bold text-gray-900">
<h2 className="text-[32px] font-bold text-text-primary">
{isEmailSent ? t('login.resetLinkSent') : t('login.forgotPassword')}
</h2>
<p className='mt-1 text-sm text-gray-600'>
<p className='mt-1 text-sm text-text-secondary'>
{isEmailSent ? t('login.checkEmailForResetLink') : t('login.forgotPasswordDesc')}
</p>
</div>
<div className="mt-8 grow sm:mx-auto sm:w-full sm:max-w-md">
<div className="bg-white ">
<div className="relative">
<form>
{!isEmailSent && (
<div className='mb-5'>
<label htmlFor="email"
className="my-2 flex items-center justify-between text-sm font-medium text-gray-900">
className="my-2 flex items-center justify-between text-sm font-medium text-text-primary">
{t('login.email')}
</label>
<div className="mt-1">

5
web/app/forgot-password/page.tsx
View File

@@ -13,6 +13,7 @@ const ForgotPassword = () => {
return (
<div className={classNames(
'bg-background-body',
style.background,
'flex w-full min-h-screen',
'p-4 lg:p-8',
@@ -21,13 +22,13 @@ const ForgotPassword = () => {
)}>
<div className={
classNames(
'flex w-full flex-col bg-white shadow rounded-2xl shrink-0',
'flex w-full flex-col bg-background-section-burn shadow rounded-2xl shrink-0',
'md:w-[608px] space-between',
)
}>
<Header />
{token ? <ChangePasswordForm /> : <ForgotPasswordForm />}
<div className='px-8 py-6 text-sm font-normal text-gray-500'>
<div className='px-8 py-6 text-sm font-normal text-text-tertiary'>
© {new Date().getFullYear()} LangGenius, Inc. All rights reserved.
</div>
</div>