From ea3c1e3b58b8e9b9db21345173ac1bcf650da5d0 Mon Sep 17 00:00:00 2001
From: Tessa Thornton <tessathornton@gmail.com>
Date: Thu, 12 Sep 2019 12:01:59 -0400
Subject: [PATCH] fix safari user drawer display bugs (#2554)

---
 .../UserHistoryDrawerContainer.css            |  2 +-
 .../UserHistoryDrawerContainer.tsx            | 42 ++++++++++---------
 2 files changed, 23 insertions(+), 21 deletions(-)

diff --git a/src/core/client/admin/components/UserHistoryDrawer/UserHistoryDrawerContainer.css b/src/core/client/admin/components/UserHistoryDrawer/UserHistoryDrawerContainer.css
index 9c2c12c3e..dd634a4c2 100644
--- a/src/core/client/admin/components/UserHistoryDrawer/UserHistoryDrawerContainer.css
+++ b/src/core/client/admin/components/UserHistoryDrawer/UserHistoryDrawerContainer.css
@@ -1,6 +1,6 @@
 .comments {
   flex: auto;
-  overflow: hidden;
+  overflow: scroll;
 }
 
 .close {
diff --git a/src/core/client/admin/components/UserHistoryDrawer/UserHistoryDrawerContainer.tsx b/src/core/client/admin/components/UserHistoryDrawer/UserHistoryDrawerContainer.tsx
index 549c8e8f8..6570633f4 100644
--- a/src/core/client/admin/components/UserHistoryDrawer/UserHistoryDrawerContainer.tsx
+++ b/src/core/client/admin/components/UserHistoryDrawer/UserHistoryDrawerContainer.tsx
@@ -39,28 +39,30 @@ const UserHistoryDrawerContainer: FunctionComponent<Props> = ({
       <Button className={styles.close} onClick={onClose}>
         <Icon size="md">close</Icon>
       </Button>
-      <Flex className={styles.username} itemGutter>
-        <span>{user.username}</span>
-        <div>
-          <UserBadgesContainer user={user} />
-        </div>
-      </Flex>
-      <div className={styles.userStatus}>
-        <Flex alignItems="center" itemGutter="half">
-          <div className={styles.userStatusLabel}>
-            <Typography variant="bodyCopyBold" container="div">
-              <Flex alignItems="center" itemGutter="half">
-                <Localized id="moderate-user-drawer-status-label">
-                  Status:
-                </Localized>
-              </Flex>
-            </Typography>
+      <div>
+        <Flex className={styles.username} itemGutter>
+          <span>{user.username}</span>
+          <div>
+            <UserBadgesContainer user={user} />
           </div>
-          <div className={styles.userStatusChange}>
-            <UserStatusChangeContainer settings={settings} user={user} />
-          </div>
-          <UserStatusDetailsContainer user={user} />
         </Flex>
+        <div className={styles.userStatus}>
+          <Flex alignItems="center" itemGutter="half">
+            <div className={styles.userStatusLabel}>
+              <Typography variant="bodyCopyBold" container="div">
+                <Flex alignItems="center" itemGutter="half">
+                  <Localized id="moderate-user-drawer-status-label">
+                    Status:
+                  </Localized>
+                </Flex>
+              </Typography>
+            </div>
+            <div className={styles.userStatusChange}>
+              <UserStatusChangeContainer settings={settings} user={user} />
+            </div>
+            <UserStatusDetailsContainer user={user} />
+          </Flex>
+        </div>
       </div>
       <div>
         <Flex alignItems="center" className={styles.userDetail}>