From 9a0e537916e39d5667a81c30ba819707d3853e73 Mon Sep 17 00:00:00 2001
From: Adesh-Pandey <75557670+Adesh-Pandey@users.noreply.github.com>
Date: Thu, 23 Feb 2023 19:05:38 +0545
Subject: [PATCH] Fix copy button icon overlapping with copyable text (#10227)

* Modified css for copy button and the copyable text accross the app specially to solve the overlapping problem in the access token div

* Modified css for copy button and the copyable text accross the app specially to solve the overlapping problem in the access token div and replaced the scroll with auto
---
 res/css/views/elements/_CopyableText.pcss                  | 6 ++++--
 res/css/views/settings/tabs/user/_HelpUserSettingsTab.pcss | 5 -----
 2 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/res/css/views/elements/_CopyableText.pcss b/res/css/views/elements/_CopyableText.pcss
index 8e1d3f3cfd..edd1cdf716 100644
--- a/res/css/views/elements/_CopyableText.pcss
+++ b/res/css/views/elements/_CopyableText.pcss
@@ -23,11 +23,12 @@ limitations under the License.
     max-width: 100%;
 
     &.mx_CopyableText_border {
+        overflow: auto;
         border-radius: 5px;
         border: solid 1px $light-fg-color;
         margin-bottom: 10px;
         margin-top: 10px;
-        padding: 10px;
+        padding: 10px 0 10px 10px;
     }
 
     .mx_CopyableText_copyButton {
@@ -36,7 +37,8 @@ limitations under the License.
         width: 1em;
         height: 1em;
         cursor: pointer;
-        margin-left: 20px;
+        padding-left: 12px;
+        padding-right: 10px;
         display: block;
         /* If the copy button is used within a scrollable div, make it stick to the right while scrolling */
         position: sticky;
diff --git a/res/css/views/settings/tabs/user/_HelpUserSettingsTab.pcss b/res/css/views/settings/tabs/user/_HelpUserSettingsTab.pcss
index 5a61bcd2da..c03de9f36c 100644
--- a/res/css/views/settings/tabs/user/_HelpUserSettingsTab.pcss
+++ b/res/css/views/settings/tabs/user/_HelpUserSettingsTab.pcss
@@ -28,9 +28,4 @@ limitations under the License.
             margin-bottom: $spacing-16;
         }
     }
-
-    /* prevent the access token from overflowing the text box */
-    div .mx_CopyableText {
-        overflow: scroll;
-    }
 }