fix dark mode and design bug
This commit is contained in:
@@ -21,7 +21,7 @@ const Button: FC<ButtonProps> = (props) => {
|
||||
'w-full cursor-pointer rounded-xl font-normal text-xs md:text-sm h-10 px-3 md:px-4 transition-all duration-200 hover:bg-opacity-90 disabled:opacity-50 disabled:cursor-not-allowed',
|
||||
variant === 'secondary'
|
||||
? 'bg-secondary text-secondary-foreground'
|
||||
: 'bg-secondary text-secondary-foreground dark:bg-secondary dark:text-secondary-foreground',
|
||||
: 'bg-primary text-primary-foreground',
|
||||
className
|
||||
)
|
||||
|
||||
|
||||
@@ -20,14 +20,14 @@ const SwitchComponent = (props: Props) => {
|
||||
{({ checked }) => (
|
||||
<button
|
||||
className={`${checked
|
||||
? 'bg-primary dark:bg-primary/80'
|
||||
: 'bg-gray-300 dark:bg-gray-600'
|
||||
} relative inline-flex h-6 w-11 items-center rounded-full transition-colors duration-200`}
|
||||
? 'bg-primary dark:bg-blue-500'
|
||||
: 'bg-gray-300 dark:bg-gray-700'
|
||||
} relative inline-flex h-6 w-11 items-center rounded-full transition-all duration-300 ease-in-out shadow-inner`}
|
||||
>
|
||||
<span className="sr-only">Enable notifications</span>
|
||||
<span
|
||||
className={`${checked ? 'translate-x-6' : 'translate-x-1'
|
||||
} inline-block h-4 w-4 transform rounded-full bg-white dark:bg-gray-100 shadow-sm transition-all duration-200`}
|
||||
} inline-block h-4 w-4 transform rounded-full bg-white dark:bg-gray-100 shadow-lg transition-all duration-300 ease-in-out`}
|
||||
/>
|
||||
</button>
|
||||
)}
|
||||
|
||||
@@ -145,7 +145,7 @@ const Forward: FC<ForwardProps> = ({
|
||||
onClick={expandForward}
|
||||
className='flex gap-2 cursor-pointer items-center border-r border-border pr-5 hover:text-primary transition-colors'
|
||||
>
|
||||
<img src={ForwardIcon} className='w-[17px]' />
|
||||
<img src={ForwardIcon} className='w-[17px] filterWhite' />
|
||||
<div>{t('mail.forward')}</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -160,7 +160,7 @@ const Forward: FC<ForwardProps> = ({
|
||||
{/* Forward Header */}
|
||||
<div className='flex items-center justify-between mb-4 p-3 bg-gray-50 rounded-lg border'>
|
||||
<div className='flex items-center gap-2 text-sm text-gray-600'>
|
||||
<img src={ForwardIcon} className='w-4 h-4' />
|
||||
<img src={ForwardIcon} className='w-4 h-4 filterWhite' />
|
||||
<span>ارسال به دیگران</span>
|
||||
</div>
|
||||
<div className='flex items-center gap-2'>
|
||||
|
||||
@@ -66,7 +66,7 @@ const Reply: FC<ReplyProps> = ({
|
||||
onClick={handleExpand}
|
||||
className='flex gap-2 cursor-pointer items-center hover:text-primary transition-colors'
|
||||
>
|
||||
<img src={AnswerIcon} className='w-[17px]' />
|
||||
<img src={AnswerIcon} className='w-[17px] filterWhite' />
|
||||
<div>{t('mail.answer')}</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -83,7 +83,7 @@ const Reply: FC<ReplyProps> = ({
|
||||
<div className={`mt-6 w-full ${className}`}>
|
||||
<div className='flex items-center justify-between mb-4 p-3 bg-gray-50 rounded-lg border'>
|
||||
<div className='flex items-center gap-2 text-sm text-gray-600'>
|
||||
<img src={AnswerIcon} className='w-4 h-4' />
|
||||
<img src={AnswerIcon} className='w-4 h-4 filterWhite' />
|
||||
<span>پاسخ به {originalMessage.from.name || originalMessage.from.address}</span>
|
||||
</div>
|
||||
<div className='flex items-center gap-2'>
|
||||
|
||||
@@ -114,7 +114,7 @@ const ReportBug: React.FC = () => {
|
||||
</div>
|
||||
|
||||
<div className='text-[11px] text-muted-foreground leading-6'>
|
||||
با ادامه و ارسال، شما تأیید میکنید که «دیمیل» میتواند پاسخها و اطلاعات حساب شما را بهمنظور بهبود خدمات جمعآوری و استفاده کند. برای جزئیات بیشتر لطفاً به <span className='text-blue-500'>قوانین و شرایط و سیاست حریم خصوصی</span> مراجعه کنید.
|
||||
با ادامه و ارسال، شما تأیید میکنید که «دیمیل» میتواند پاسخها و اطلاعات حساب شما را بهمنظور بهبود خدمات جمعآوری و استفاده کند. برای جزئیات بیشتر لطفاً به <a target='_blank' href='https://danakcorp.com/conditions' className='text-blue-500'>قوانین و شرایط و سیاست حریم خصوصی</a> مراجعه کنید.
|
||||
</div>
|
||||
|
||||
<div className='w-full flex justify-end'>
|
||||
|
||||
@@ -144,7 +144,7 @@ const Header: FC<{
|
||||
onClick={handleDownloadEmail}
|
||||
>
|
||||
<div className='flex gap-2 items-center xl:px-5'>
|
||||
<DocumentDownload size={20} color={'#000000'} />
|
||||
<DocumentDownload size={20} color={'#000000'} className='filterWhite' />
|
||||
<span className='pt-0.5 xl:block hidden'>{t('mail.download')}</span>
|
||||
</div>
|
||||
</Button>
|
||||
@@ -153,7 +153,7 @@ const Header: FC<{
|
||||
onClick={handlePrint}
|
||||
>
|
||||
<div className='flex gap-2 items-center xl:px-5'>
|
||||
<Printer size={20} color={'#000000'} />
|
||||
<Printer size={20} color={'#000000'} className='filterWhite' />
|
||||
<span className='pt-0.5 xl:block hidden'>{t('mail.print')}</span>
|
||||
</div>
|
||||
</Button>
|
||||
|
||||
@@ -26,7 +26,7 @@ const MessageFavorite: FC<{ flagged: boolean }> = ({ flagged }) => {
|
||||
})
|
||||
}
|
||||
setIsFavorite(!isFavorite)
|
||||
}} className='lg:size-[18px] size-[20px]' variant={isFavorite ? 'Bold' : 'Outline'} color={isFavorite ? '#FFC107' : getIconColor('muted')} />
|
||||
}} className='lg:size-[18px] size-[20px]' variant={isFavorite ? 'Bold' : 'Outline'} color={isFavorite ? '#FFC107' : getIconColor('primary')} />
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@@ -221,7 +221,7 @@ const DetailEmail: FC = () => {
|
||||
<DocumentDownload
|
||||
size={20}
|
||||
color={getIconColor('primary')}
|
||||
className='cursor-pointer hover:opacity-70 transition-opacity'
|
||||
className='cursor-pointer hover:opacity-70 transition-opacity filterWhite'
|
||||
onClick={() => handleDownloadAttachment(
|
||||
attachment.id || `ATT${String(index + 1).padStart(5, '0')}`,
|
||||
attachment.filename || `attachment-${index + 1}`
|
||||
|
||||
Reference in New Issue
Block a user