Stop access token overflowing the box (#10069)

Use a scrollable div for the access token to stop it overflowing.
element-hq · Feb 21, 2023 · b48d568 · b48d568
1 parent 4931f18
commit b48d568
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/res/css/views/elements/_CopyableText.pcss b/res/css/views/elements/_CopyableText.pcss
@@ -38,9 +38,12 @@ limitations under the License.
  cursor: pointer;
  margin-left: 20px;
  display: block;
+ /* If the copy button is used within a scrollable div, make it stick to the right while scrolling */
+ position: sticky;
+ right: 0;
  /* center to first line */
- position: relative;
  top: 0.15em;
+ background-color: $background;
 
  &::before {
  content: "";

diff --git a/res/css/views/settings/tabs/user/_HelpUserSettingsTab.pcss b/res/css/views/settings/tabs/user/_HelpUserSettingsTab.pcss
@@ -28,4 +28,9 @@ limitations under the License.
  margin-bottom: $spacing-16;
  }
  }
+
+ /* prevent the access token from overflowing the text box */
+ div .mx_CopyableText {
+ overflow: scroll;
+ }
 }