From c8acbe7686788e810316f6997ec2e6140040f230 Mon Sep 17 00:00:00 2001 From: mayuran-deriv Date: Mon, 25 Nov 2024 15:33:23 +0400 Subject: [PATCH 1/7] fix: account switcher design --- .../AccountSwitcher/AccountSwitcher.scss | 1 - src/components/Modal/index.tsx | 19 +++++++++---------- 2 files changed, 9 insertions(+), 11 deletions(-) diff --git a/src/components/AppLayout/AccountSwitcher/AccountSwitcher.scss b/src/components/AppLayout/AccountSwitcher/AccountSwitcher.scss index 8547626a..f36cb744 100644 --- a/src/components/AppLayout/AccountSwitcher/AccountSwitcher.scss +++ b/src/components/AppLayout/AccountSwitcher/AccountSwitcher.scss @@ -38,7 +38,6 @@ &--mobile { width: 90vw; position: unset; - min-height: 400px; height: auto; border-radius: 4px; } diff --git a/src/components/Modal/index.tsx b/src/components/Modal/index.tsx index 1b5c9c46..299e234f 100644 --- a/src/components/Modal/index.tsx +++ b/src/components/Modal/index.tsx @@ -1,27 +1,27 @@ -import ReactModal from 'react-modal'; -import clsx from 'clsx'; +import ReactModal from "react-modal"; +import clsx from "clsx"; -import { ModalHeader } from './ModalHeader'; -import { ModalBody } from './ModalBody'; -import { ModalFooter } from './ModalFooter'; +import { ModalHeader } from "./ModalHeader"; +import { ModalBody } from "./ModalBody"; +import { ModalFooter } from "./ModalFooter"; -import './Modal.scss' +import "./Modal.scss"; export const CUSTOM_STYLES = { content: { background: 'none', border: 'none', - borderRadius: 0, + borderRadius: '10px', bottom: 'auto', left: '50%', margin: 0, marginRight: '-50%', padding: 0, right: 'auto', - top: '50%', + top: '20%', transform: 'translate(-50%, -50%)', transition: 'all 0.35s ease-in-out', - boxShadow: '0px 32px 64px 0px rgba(14, 14, 14, 0.14)' + boxShadow: '0px 32px 64px 0px rgba(14, 14, 14, 0.14)', }, overlay: { backgroundColor: 'rgba(0, 0, 0, 0.72)', @@ -36,7 +36,6 @@ interface ModalProps extends ReactModal.Props { } } - /** * Represents a modal component.it's a wrapper around react-modal. * you can use all props exposing from the react-modal. From 833b45ea0e7ec71770df78c930f56ac00bb12a73 Mon Sep 17 00:00:00 2001 From: mayuran-deriv Date: Tue, 26 Nov 2024 11:51:29 +0400 Subject: [PATCH 2/7] fix: comments --- src/components/AppLayout/AccountSwitcher/index.tsx | 5 +++++ src/components/Modal/index.tsx | 6 +++--- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/components/AppLayout/AccountSwitcher/index.tsx b/src/components/AppLayout/AccountSwitcher/index.tsx index c100e014..8cd48b4c 100644 --- a/src/components/AppLayout/AccountSwitcher/index.tsx +++ b/src/components/AppLayout/AccountSwitcher/index.tsx @@ -31,6 +31,9 @@ type AccountSwitcherProps = { demo: string; real: string; }; + modalContentStyle?: { + content?: React.CSSProperties; + }; }; export const AccountSwitcher = ({ @@ -39,6 +42,7 @@ export const AccountSwitcher = ({ isDisabled = false, buttonClassName, tabsLabels, + modalContentStyle, }: AccountSwitcherProps) => { const [isOpen, setIsOpen] = useState(false); const ref = useRef(null); @@ -110,6 +114,7 @@ export const AccountSwitcher = ({ }} className="deriv-account-switcher__container--mobile" isOpen={isOpen} + style={modalContentStyle ?? {}} > {children && ( Date: Tue, 26 Nov 2024 11:59:02 +0400 Subject: [PATCH 3/7] fix: unwanted code remove --- src/components/Modal/index.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/Modal/index.tsx b/src/components/Modal/index.tsx index fcea8535..6c316c33 100644 --- a/src/components/Modal/index.tsx +++ b/src/components/Modal/index.tsx @@ -1,11 +1,11 @@ -import ReactModal from "react-modal"; -import clsx from "clsx"; +import ReactModal from 'react-modal'; +import clsx from 'clsx'; -import { ModalHeader } from "./ModalHeader"; -import { ModalBody } from "./ModalBody"; -import { ModalFooter } from "./ModalFooter"; +import { ModalHeader } from './ModalHeader'; +import { ModalBody } from './ModalBody'; +import { ModalFooter } from './ModalFooter'; -import "./Modal.scss"; +import './Modal.scss' export const CUSTOM_STYLES = { content: { From 4364acad971ceacd61bfc9f96fc8b89fbd96af3f Mon Sep 17 00:00:00 2001 From: mayuran-deriv Date: Tue, 26 Nov 2024 12:19:49 +0400 Subject: [PATCH 4/7] fix: trigger empty From 5d703a8034b086ffef4da6a268f5d79e91909d70 Mon Sep 17 00:00:00 2001 From: mayuran-deriv Date: Tue, 26 Nov 2024 12:52:06 +0400 Subject: [PATCH 5/7] fix: trigger empty commit From 19bd807cc3dabe0f6ca80b1bee0d1a569a1b9af3 Mon Sep 17 00:00:00 2001 From: mayuran-deriv Date: Tue, 26 Nov 2024 12:54:04 +0400 Subject: [PATCH 6/7] fix: trigger empty commit From 56f1333fd0d70766ffa79fc7045acdf2f34cfc45 Mon Sep 17 00:00:00 2001 From: mayuran-deriv Date: Tue, 26 Nov 2024 12:58:43 +0400 Subject: [PATCH 7/7] fix: trigger empty commit