danak/dmail-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dark mode v1

Browse Source
This commit is contained in:
hamid zarghami
2025-08-18 15:23:31 +03:30
parent 561bf9d5d5
commit 916b88731c
49 changed files with 655 additions and 371 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/newMessage/EmailActions.tsx
+2 -1
View File
@@ -1,5 +1,6 @@
import { FC } from 'react'
import { EmojiHappy } from 'iconsax-react'
import { getIconColor } from '@/utils/colorUtils'
import Reply from './Reply'
import Forward from './Forward'
import { MessageDetail } from '@/pages/received/types/Types'
@@ -21,7 +22,7 @@ const EmailActions: FC<EmailActionsProps> = ({
{showReactions && (
<EmojiHappy
size={24}
color='black'
color={getIconColor('primary')}
className='cursor-pointer hover:opacity-70 transition-opacity'
/>
)}
src/components/newMessage/EmailEditor.tsx
+1 -1
View File
@@ -91,7 +91,7 @@ const EmailEditor: FC<EmailEditorProps> = ({
placeholder={placeholder}
modules={modules}
formats={formats}
className="bg-white rounded-lg"
className="bg-white dark:bg-[#252526] rounded-lg"
/>
</div>
)
src/components/newMessage/EmailFormActions.tsx
+2 -2
View File
@@ -49,7 +49,7 @@ const EmailFormActions: FC<EmailFormActionsProps> = ({
{/* Save Draft Button */}
{onSaveDraft && (
<Button
className='!w-full sm:!w-fit px-6 md:px-10 bg-white text-black border border-primary order-2 sm:order-1'
className='!w-full sm:!w-fit px-6 md:px-10 bg-white dark:bg-transparent text-black dark:text-white border border-primary order-2 sm:order-1'
label={t('new_message.draft')}
onClick={onSaveDraft}
loading={isSavingDraft}
@@ -59,7 +59,7 @@ const EmailFormActions: FC<EmailFormActionsProps> = ({
{/* Close Button */}
{onClose && !onSaveDraft && (
<Button
className='!w-full sm:!w-fit px-6 md:px-10 bg-white text-black border border-primary order-2 sm:order-1'
className='!w-full sm:!w-fit px-6 md:px-10 bg-white dark:bg-transparent text-black dark:text-white border border-primary order-2 sm:order-1'
label={t('common.close')}
onClick={onClose}
/>
src/components/newMessage/EmailInput.tsx
+5 -5
View File
@@ -169,11 +169,11 @@ const EmailInput: FC<EmailInputProps> = ({
return (
<div className='w-full relative'>
<div className="w-full bg-white min-h-10 text-black flex flex-wrap items-center gap-1 px-4 py-2 text-xs rounded-xl border border-border">
<div className="w-full bg-white dark:bg-[#252526] min-h-10 text-black dark:text-white flex flex-wrap items-center gap-1 px-4 py-2 text-xs rounded-xl border border-border">
{toEmails.map((email, index) => (
<div
key={index}
className="flex items-center gap-1 bg-[#EBEDF5] text-xs h-7 rounded-full px-3"
className="flex items-center gap-1 bg-[#EBEDF5] dark:bg-[#2d2d30] text-xs h-7 rounded-full px-3"
>
<span>{email}</span>
<CloseCircle
@@ -198,11 +198,11 @@ const EmailInput: FC<EmailInputProps> = ({
</div>
{showSuggestions && filteredSuggestions.length > 0 && (
<div className="absolute top-full left-0 right-0 bg-white border border-gray-200 rounded-lg shadow-lg z-[10000] mt-1">
<div className="absolute top-full left-0 right-0 bg-white dark:bg-[#252526] border border-gray-200 dark:border-[#3e3e42] rounded-lg shadow-lg z-[10000] mt-1">
{filteredSuggestions.map((suggestion, index) => (
<div
key={suggestion.address}
className={`px-4 py-2 cursor-pointer text-sm hover:bg-gray-100 border-b border-gray-100 last:border-b-0 ${selectedSuggestionIndex === index ? 'bg-blue-50 text-blue-600' : 'text-gray-700'
className={`px-4 py-2 cursor-pointer text-sm hover:bg-gray-100 dark:hover:bg-[#2d2d30] border-b border-gray-100 dark:border-[#2d2d30] last:border-b-0 ${selectedSuggestionIndex === index ? 'bg-blue-50 dark:bg-blue-900/20 text-blue-600 dark:text-blue-400' : 'text-gray-700 dark:text-gray-300'
}`}
onMouseDown={() => selectSuggestion(suggestion)}
onMouseEnter={() => setSelectedSuggestionIndex(index)}
@@ -210,7 +210,7 @@ const EmailInput: FC<EmailInputProps> = ({
<div className="flex flex-col">
<span className="font-medium">{suggestion.name || suggestion.address}</span>
{suggestion.name && (
<span className="text-xs text-gray-500">{suggestion.address}</span>
<span className="text-xs text-gray-500 dark:text-gray-400">{suggestion.address}</span>
)}
</div>
</div>
src/components/newMessage/NewMessage.tsx
+3 -2
View File
@@ -11,6 +11,7 @@ import { useNewMessage } from './hooks/useNewMessage'
import Intelligense from '@/assets/images/intelligense.svg'
import { useGenerateEmail } from '@/pages/received/hooks/useEmailData'
import { clx } from '@/helpers/utils'
import { getIconColor } from '@/utils/colorUtils'
const NewMessage: FC = () => {
const { t } = useTranslation('global')
@@ -116,7 +117,7 @@ const NewMessage: FC = () => {
}`}
onClick={handleClose}
/>
<div className={`fixed bottom-2 inset-x-2 md:bottom-4 md:inset-x-4 xl:left-4 xl:right-auto xl:bottom-4 bg-white rounded-2xl md:rounded-3xl shadow-[0_0_20px_rgba(0,0,0,0.1)] z-[9999] p-4 md:p-6 xl:p-8 xl:w-[800px] max-h-[90vh] overflow-y-auto transition-transform duration-300 ease-out ${isClosing ? 'translate-y-[120%]' : isOpening ? 'translate-y-full' : 'translate-y-0'
<div className={`fixed bottom-2 inset-x-2 md:bottom-4 md:inset-x-4 xl:left-4 xl:right-auto xl:bottom-4 bg-white dark:bg-[#252526] rounded-2xl md:rounded-3xl shadow-[0_0_20px_rgba(0,0,0,0.1)] z-[9999] p-4 md:p-6 xl:p-8 xl:w-[800px] max-h-[90vh] overflow-y-auto transition-transform duration-300 ease-out ${isClosing ? 'translate-y-[120%]' : isOpening ? 'translate-y-full' : 'translate-y-0'
}`}>
{/* Header */}
<div className='flex justify-between items-center mb-6 md:mb-8'>
@@ -124,7 +125,7 @@ const NewMessage: FC = () => {
{t('new_message.title')}
</div>
<div onClick={handleClose} className='cursor-pointer p-1'>
<CloseCircle size={20} className='md:w-6 md:h-6' color='#292D32' />
<CloseCircle size={20} className='md:w-6 md:h-6' color={getIconColor('primary')} />
</div>
</div>