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

color sidebar and color button + ...

Browse Source
This commit is contained in:
hamid zarghami
2025-08-21 11:32:19 +03:30
parent 3e31a813ee
commit 1fbbc0519c
7 changed files with 23 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Button.tsx
+4 -2
View File
@@ -18,8 +18,10 @@ const Button: FC<ButtonProps> = (props) => {
const { label, children, className, loading, variant, type, disabled, ...rest } = props
const buttonClass = clx(
'w-full bg-primary text-primary-foreground 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-[#ECEEF5] text-black',
'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',
className
)
src/index.css
+1 -1
View File
@@ -201,7 +201,7 @@ textarea::placeholder {
--secondary: #f5f5f5;
--secondary-foreground: #000000;
--muted: #f5f5f5;
--muted-foreground: #888888;
--muted-foreground: #8c90a3;
--accent: #f5f5f5;
--accent-foreground: #000000;
--destructive: #ef4444;
src/pages/auth/Login.tsx
+1 -1
View File
@@ -132,7 +132,7 @@ const Login: FC = () => {
</div>
</div>
<div className='flex-1 min-w-[50%] lg:flex hidden justify-center items-center bg-surface'>
<div className='flex-1 min-w-[50%] lg:flex hidden justify-center items-center'>
<img src={LogoImage} className='h-14 filterWhite' />
</div>
</div>
src/shared/Header.tsx
+4 -1
View File
@@ -274,7 +274,10 @@ const Header: FC = () => {
actions={[
{
label: 'راهنما',
onClick: () => window.location.href = import.meta.env.VITE_HELP_URL + `/${import.meta.env.VITE_SERVICE_ID}`,
onClick: () => window.open(
import.meta.env.VITE_HELP_URL + `/${import.meta.env.VITE_SERVICE_ID}`,
'_blank'
),
},
{
label: 'گزارش اشکالات',
src/shared/Main.tsx
+2 -1
View File
@@ -6,6 +6,7 @@ import Button from '@/components/Button'
import { Add } from 'iconsax-react'
import { useTranslation } from 'react-i18next'
import { useSharedStore } from './store/sharedStore'
import { getIconColor } from '@/utils/colorUtils'
const Main: FC = () => {
@@ -33,7 +34,7 @@ const Main: FC = () => {
}}
>
<div className='flex gap-2 items-center'>
<Add size={18} color='black' />
<Add size={18} color={getIconColor('primary')} />
<div>{t('sidebar.new_message')}</div>
</div>
</Button>
src/shared/SideBar.tsx
+10 -10
View File
@@ -67,9 +67,9 @@ const SideBar: FC = () => {
{t('sidebar.menu')}
</div>
<div className='text-xs text-secondary-content'>
<div className='text-xs text-[#8C90A3]'>
<SideBarItem
icon={<DirectInbox variant={isActive(Paths.received) ? 'Bold' : 'Outline'} color={isActive(Paths.received) ? getIconColor('primary') : getIconColor('muted')} size={iconSizeSideBar} />}
icon={<DirectInbox variant={isActive(Paths.received) ? 'Bold' : 'Outline'} color={isActive(Paths.received) ? getIconColor('primary') : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.received')}
isActive={isActive(Paths.received)}
link={Paths.received}
@@ -77,14 +77,14 @@ const SideBar: FC = () => {
/>
<SideBarItem
icon={<DirectSend variant={isActive(Paths.sent) ? 'Bold' : 'Outline'} color={isActive(Paths.sent) ? getIconColor('primary') : getIconColor('muted')} size={iconSizeSideBar} />}
icon={<DirectSend variant={isActive(Paths.sent) ? 'Bold' : 'Outline'} color={isActive(Paths.sent) ? getIconColor('primary') : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.sent')}
isActive={isActive(Paths.sent)}
link={Paths.sent}
/>
<SideBarItem
icon={<Edit variant={isActive(Paths.draft) ? 'Bold' : 'Outline'} color={isActive(Paths.draft) ? getIconColor('primary') : getIconColor('muted')} size={iconSizeSideBar} />}
icon={<Edit variant={isActive(Paths.draft) ? 'Bold' : 'Outline'} color={isActive(Paths.draft) ? getIconColor('primary') : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.draft')}
isActive={isActive(Paths.draft)}
link={Paths.draft}
@@ -92,14 +92,14 @@ const SideBar: FC = () => {
/>
<SideBarItem
icon={<ArchiveTick variant={isActive(Paths.archive) ? 'Bold' : 'Outline'} color={isActive(Paths.archive) ? getIconColor('primary') : getIconColor('muted')} size={iconSizeSideBar} />}
icon={<ArchiveTick variant={isActive(Paths.archive) ? 'Bold' : 'Outline'} color={isActive(Paths.archive) ? getIconColor('primary') : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.archive')}
isActive={isActive(Paths.archive)}
link={Paths.archive}
/>
<SideBarItem
icon={<Trash variant={isActive(Paths.trash) ? 'Bold' : 'Outline'} color={isActive(Paths.trash) ? getIconColor('primary') : getIconColor('muted')} size={iconSizeSideBar} />}
icon={<Trash variant={isActive(Paths.trash) ? 'Bold' : 'Outline'} color={isActive(Paths.trash) ? getIconColor('primary') : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.trash')}
isActive={isActive(Paths.trash)}
link={Paths.trash}
@@ -112,14 +112,14 @@ const SideBar: FC = () => {
<div className='text-xs text-secondary-content'>
<SideBarItem
icon={<Star1 variant={isActive(Paths.favorite) ? 'Bold' : 'Outline'} color={isActive(Paths.favorite) ? getIconColor('primary') : getIconColor('muted')} size={iconSizeSideBar} />}
icon={<Star1 variant={isActive(Paths.favorite) ? 'Bold' : 'Outline'} color={isActive(Paths.favorite) ? getIconColor('primary') : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.favorite')}
isActive={isActive(Paths.favorite)}
link={Paths.favorite}
/>
<SideBarItem
icon={<InfoCircle variant={isActive(Paths.spam) ? 'Bold' : 'Outline'} color={isActive(Paths.spam) ? getIconColor('primary') : getIconColor('muted')} size={iconSizeSideBar} />}
icon={<InfoCircle variant={isActive(Paths.spam) ? 'Bold' : 'Outline'} color={isActive(Paths.spam) ? getIconColor('primary') : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.spam')}
isActive={isActive(Paths.spam)}
link={Paths.spam}
@@ -130,13 +130,13 @@ const SideBar: FC = () => {
<div className='flex-1 flex flex-col justify-end mt-10 md:mt-14 pb-6 md:pb-8'>
<div className='text-xs text-secondary-content'>
<SideBarItem
icon={<Setting2 variant={isActive(Paths.setting) ? 'Bold' : 'Outline'} color={isActive(Paths.setting) ? getIconColor('primary') : getIconColor('muted')} size={iconSizeSideBar} />}
icon={<Setting2 variant={isActive(Paths.setting) ? 'Bold' : 'Outline'} color={isActive(Paths.setting) ? getIconColor('primary') : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.settings')}
isActive={isActive(Paths.setting)}
link={Paths.setting}
/>
<SideBarItem
icon={<Logout variant={isActive('logout') ? 'Bold' : 'Outline'} color={isActive('logout') ? getIconColor('primary') : getIconColor('muted')} size={iconSizeSideBar} />}
icon={<Logout variant={isActive('logout') ? 'Bold' : 'Outline'} color={isActive('logout') ? getIconColor('primary') : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.logout')}
isActive={isActive('logout')}
link={`#`}
src/shared/SideBarItem.tsx
+1 -1
View File
@@ -34,7 +34,7 @@ const SideBarItem: FC<Props> = (props: Props) => {
}
<div className='flex flex-1 gap-3 items-center'>
{props.icon}
<div className={props.isActive || !!props.count ? 'text-foreground' : 'text-foreground'}>
<div className={props.isActive || !!props.count ? 'text-foreground' : 'text-[#8C90A3]'}>
{props.title}
</div>
<div className='flex flex-1 justify-end pl-6'>