amir/Account
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: border color of dark mode

Browse Source
This commit is contained in:
Sajad Mirjalili
2025-09-26 10:52:38 +03:30
parent 7eb7192b05
commit 86bca4d4a6
13 changed files with 37 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.npmrc
View File

@@ -1,2 +1,2 @@
@rkheftan:registry=https://npm.pkg.github.com
//npm.pkg.github.com/:_authToken=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
//npm.pkg.github.com/:_authToken=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

10
package-lock.json generated
View File

@@ -15,7 +15,7 @@
"@mui/stylis-plugin-rtl": "^7.2.0",
"@mui/x-data-grid-premium": "^8.10.0",
"@mui/x-date-pickers": "^8.10.0",
"@rkheftan/harmony-ui": "^0.1.8",
"@rkheftan/harmony-ui": "^0.2.86",
"@rollup/rollup-win32-x64-msvc": "^4.46.3",
"axios": "^1.11.0",
"date-fns": "^4.1.0",
@@ -1843,17 +1843,19 @@
}
},
"node_modules/@rkheftan/harmony-ui": {
"version": "0.1.8",
"resolved": "https://npm.pkg.github.com/download/@rkheftan/harmony-ui/0.1.8/ceb42e35ecc6f5ec4ab312dba32c73d8175ab861",
"integrity": "sha512-taau98lOVAqd8Oc4SuP8l0Yo6qTTLH24HPWIs/MLAcaKQrVR0et5gZ+PdQswoUko6/019fe+4Wx9871AiulLLg==",
"version": "0.2.86",
"resolved": "https://npm.pkg.github.com/download/@rkheftan/harmony-ui/0.2.86/db9acf1a2c0b61cc5ccf04e6b4be31e51ca09815",
"integrity": "sha512-oECk47uxn/CTeZI2YW0cPCWIbPE+xKkUaY5UpNrATYBFZ8PviH2CarHFxpnJOoxKmTj59eEmWa57Qu4oQl5P5Q==",
"peerDependencies": {
"@emotion/react": "^11.14.0",
"@emotion/styled": "^11.14.1",
"@mui/material": "^7.3.1",
"@mui/x-data-grid-premium": "^8.10.0",
"i18next": "^25.3.0",
"iconsax-react": "^0.0.8",
"react": "^19.1.0",
"react-dom": "^19.1.0",
"react-i18next": "^15.6.0",
"react-router-dom": "^7.8.0"
}
},

2
package.json
View File

@@ -18,7 +18,7 @@
"@mui/stylis-plugin-rtl": "^7.2.0",
"@mui/x-data-grid-premium": "^8.10.0",
"@mui/x-date-pickers": "^8.10.0",
"@rkheftan/harmony-ui": "^0.1.8",
"@rkheftan/harmony-ui": "^0.2.86",
"@rollup/rollup-win32-x64-msvc": "^4.46.3",
"axios": "^1.11.0",
"date-fns": "^4.1.0",

3
public/locales/en/setting.json
View File

@@ -16,7 +16,8 @@
"familyName": "Family Name",
"country": "Country",
"gender": "Gender",
"nationalCode": "National code(Op",
"nationalCode": "National code",
"optionalNationalCode": "National code(Optional)",
"man": "Male",
"woman": "Female",
"genderPlaceholder": "Male",

2
src/components/Layout/ProductsMenu.tsx
View File

@@ -55,7 +55,7 @@ export default function ProductsMenu({
{productsData.map((product) => (
<Stack
key={product.id}
direction="row"
direction="row-reverse"
spacing={2}
alignItems="center"
width="100%"

2
src/components/Layout/Toolbar.tsx
View File

@@ -37,7 +37,7 @@ export const Toolbar: React.FC<ToolbarProps> = ({
height: (t) => t.spacing(isMobile ? 8 : 10.5),
bgcolor: 'background.paper',
px: isMobile ? 3 : 2,
borderBottom: (t) => `1px solid ${t.palette.divider}`,
borderBottom: `1px solid var(--mui-palette-divider)`,
boxSizing: 'content-box',
display: 'flex',
alignItems: 'center',

4
src/data/products.ts
View File

@@ -6,7 +6,7 @@ export interface Product {
titleKey: string;
descriptionKey: string;
LogoComponent: FC;
demoLink: string;
demoLink: string | null;
}
export const productsData: Product[] = [
@@ -15,7 +15,7 @@ export const productsData: Product[] = [
titleKey: 'products.harmonyClub.title',
descriptionKey: 'products.harmonyClub.description',
LogoComponent: Logo, // Reference the component
demoLink: '', // FIXME: update this url
demoLink: null, // FIXME: update this url
},
// add more products here
];

4
src/features/profile/components/userInformation/PhoneNumber.tsx
View File

@@ -29,6 +29,7 @@ export function PhoneNumber() {
'default',
);
const [isVerified, setIsVerified] = useState(false);
const [isCodeSent, setIsCodeSent] = useState(false);
const [phones, setPhones] = useState<Phone[]>([]);
const [countryCode, setCountryCode] = useState<CountryCode>('+98');
const [phoneNumberError, setPhoneNumberError] = useState<string>();
@@ -132,6 +133,7 @@ export function PhoneNumber() {
if (result?.success) {
setButtonState('counting');
setIsVerified(false);
setIsCodeSent(true);
toast({
message: result.message || t('settingForm.codeSentSuccessfully'),
severity: 'success',
@@ -236,6 +238,8 @@ export function PhoneNumber() {
isVerified={isVerified}
isVerifying={isBusy}
isSendingCode={isSendingCode}
isCodeSent={isCodeSent}
setIsCodeSent={setIsCodeSent}
buttonState={buttonState}
setButtonState={setButtonState}
handleSendCode={handleSendCode}

15
src/features/profile/components/userInformation/phoneNumber/PhoneEditForm.tsx
View File

@@ -11,7 +11,7 @@ import { Edit2, TickCircle } from 'iconsax-react';
import { CountDownTimer } from '@/components/CountDownTimer';
import { Icon } from '@rkheftan/harmony-ui';
import { type PhoneEditFormProps } from '@/features/profile/types/settingsType';
import { useRef, useState } from 'react';
import { useRef } from 'react';
import { Trans, useTranslation } from 'react-i18next';
import { CountryCodeSelector } from '@/features/authentication/components/CountryCodeSelector';
import { LTRTypography } from '@/components/common/LTRTypography';
@@ -26,6 +26,8 @@ export default function PhoneEditForm({
isVerified,
isVerifying,
isSendingCode,
isCodeSent,
setIsCodeSent,
buttonState,
setButtonState,
handleSendCode,
@@ -36,7 +38,6 @@ export default function PhoneEditForm({
verificationCodeError,
}: PhoneEditFormProps) {
const { t } = useTranslation('setting');
const [codeSent, setCodeSent] = useState(false);
const textFieldRef = useRef<HTMLDivElement>(null);
const inputRef = useRef<HTMLInputElement>(null);
@@ -88,8 +89,8 @@ export default function PhoneEditForm({
size="small"
onClick={() => {
setButtonState('default');
setPhoneNumber('');
setVerificationCode('');
setIsCodeSent(false);
}}
edge="end"
>
@@ -128,10 +129,7 @@ export default function PhoneEditForm({
<Button
variant="text"
loading={isSendingCode}
onClick={() => {
setCodeSent(true);
handleSendCode();
}}
onClick={handleSendCode}
sx={{
color: 'primary.main',
width: { xs: '100%', sm: 208 },
@@ -148,8 +146,7 @@ export default function PhoneEditForm({
</Button>
)}
</Box>
{/* buttonState === 'counting' && !isVerified && */}
{codeSent && !isSendingCode && !isVerified && (
{isCodeSent && !isSendingCode && !isVerified && (
<Box
sx={{
display: 'flex',

3
src/features/profile/types/settingsType.ts
View File

@@ -1,5 +1,6 @@
import type { CountryCode } from '@/types/commonTypes';
import type { TFunction } from 'i18next';
import type { Dispatch } from 'react';
export enum Gender {
Male = 2,
@@ -115,6 +116,8 @@ export interface PhoneEditFormProps {
isVerified: boolean;
isVerifying: boolean;
isSendingCode: boolean;
isCodeSent: boolean;
setIsCodeSent: Dispatch<boolean>;
buttonState: 'default' | 'counting';
setButtonState: (v: 'default' | 'counting') => void;
handleSendCode: () => void;

4
src/theme/color.type.ts
View File

@@ -47,4 +47,8 @@ export interface Palette {
dark: PaletteColorOptions;
light: PaletteColorOptions;
};
divider: {
dark: string;
light: string;
};
}

4
src/theme/colors.ts
View File

@@ -139,4 +139,8 @@ export const PALETTE: Palette = {
disabled: '#FFFFFF38',
},
},
divider: {
dark: grey[700],
light: 'rgba(0, 0, 0,0.12)',
},
};

2
src/theme/palette.ts
View File

@@ -43,6 +43,7 @@ export const lightPalette: PaletteOptions = {
background: PALETTE.background.light,
text: PALETTE.text.light,
club: PALETTE.club.light,
divider: PALETTE.divider.light,
};
export const darkPalette: PaletteOptions = {
@@ -57,4 +58,5 @@ export const darkPalette: PaletteOptions = {
background: PALETTE.background.dark,
text: PALETTE.text.dark,
club: PALETTE.club.dark,
divider: PALETTE.divider.dark,
};