From f08ab815f7d33bf74ba8100f26ffd30b698b5abd Mon Sep 17 00:00:00 2001
From: sanjam chhatwal <sanjam@deriv.com>
Date: Mon, 29 May 2023 12:33:56 +0400
Subject: [PATCH 1/2] fix: content fix

---
 .../CopyTokenDialog.module.scss               |  5 +++++
 .../ApiTokenTable/CopyTokenDialog/index.tsx   | 21 ++++++++++++-------
 2 files changed, 19 insertions(+), 7 deletions(-)
 create mode 100644 src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/CopyTokenDialog.module.scss

diff --git a/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/CopyTokenDialog.module.scss b/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/CopyTokenDialog.module.scss
new file mode 100644
index 00000000..31d41ae9
--- /dev/null
+++ b/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/CopyTokenDialog.module.scss
@@ -0,0 +1,5 @@
+@use 'src/styles/utility' as *;
+
+.content {
+  padding: rem(2);
+}
diff --git a/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/index.tsx b/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/index.tsx
index b81101cb..3bf3aba0 100644
--- a/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/index.tsx
+++ b/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/index.tsx
@@ -1,6 +1,7 @@
 import React, { useMemo, useCallback } from 'react';
 import { Modal } from '@deriv/ui';
 import { TModalActionButton } from '@deriv/ui/dist/types/src/components/core/modal/types';
+import styles from './CopyTokenDialog.module.scss';
 
 type TCopyTokenDialog = {
   setToggleModal: React.Dispatch<React.SetStateAction<boolean>>;
@@ -45,13 +46,19 @@ const CopyTokenDialog = ({ setToggleModal, copyToken }: TCopyTokenDialog) => {
       <Modal.Portal>
         <div className='modal-overlay'>
           <Modal.Overlay />
-          <Modal.DialogContent
-            has_close_button
-            content={
-              'Be careful who you share this token with. Anyone with this token can perform the following actions on your account: Add accounts, Create or delete API tokens for trading and withdrawals, Modify account settings.'
-            }
-            action_buttons={actionButtons}
-          />
+          <Modal.PageContent has_close_button action_buttons={actionButtons}>
+            <div className={styles.content}>
+              Be careful who you share this token with. Anyone with this token can perform the
+              following actions on your account behalf
+              <ul>
+                <li>Add accounts</li>
+
+                <li>Create or delete API tokens for trading and withdrawals</li>
+
+                <li>Modify account settings</li>
+              </ul>
+            </div>
+          </Modal.PageContent>
         </div>
       </Modal.Portal>
     </Modal>

From cfb869b1125070546a0b9b368d5030b5cc5f9d29 Mon Sep 17 00:00:00 2001
From: sanjam chhatwal <sanjam@deriv.com>
Date: Thu, 1 Jun 2023 19:05:48 +0400
Subject: [PATCH 2/2] fix: padding fix

---
 .../ApiTokenTable/CopyTokenDialog/CopyTokenDialog.module.scss   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/CopyTokenDialog.module.scss b/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/CopyTokenDialog.module.scss
index 31d41ae9..18f58aef 100644
--- a/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/CopyTokenDialog.module.scss
+++ b/src/features/dashboard/components/ApiTokenTable/CopyTokenDialog/CopyTokenDialog.module.scss
@@ -1,5 +1,5 @@
 @use 'src/styles/utility' as *;
 
 .content {
-  padding: rem(2);
+  padding: 0 rem(3.5) 0 rem(3.5);
 }