Style user site and adjust popup button #12

1 files changed, 6 insertions, 5 deletions

diff --git a/webui/src/components/CurrentIdentity/CurrentIdentity.tsx b/webui/src/components/CurrentIdentity/CurrentIdentity.tsx
index f3dff5ed..b68b84e5 100644
--- a/webui/src/components/CurrentIdentity/CurrentIdentity.tsx
+++ b/webui/src/components/CurrentIdentity/CurrentIdentity.tsx
@@ -26,6 +26,9 @@ const useStyles = makeStyles((theme) => ({
   profileLink: {
     ...theme.typography.button,
   },
+  popupButton: {
+    textTransform: 'none',
+  },
 }));
 
 const CurrentIdentity = () => {
@@ -57,15 +60,14 @@ const CurrentIdentity = () => {
         aria-controls={open ? 'menu-list-grow' : undefined}
         aria-haspopup="true"
         onClick={handleToggle}
+        className={classes.popupButton}
       >
         <Avatar src={user.avatarUrl ? user.avatarUrl : undefined}>
           {user.displayName.charAt(0).toUpperCase()}
         </Avatar>
+        <div className={classes.displayName}>{user.displayName}</div>
+        <LockIcon color="secondary" className={user.isProtected ? '' : ''} />
       </Button>
-      <LockIcon
-        color="secondary"
-        className={user.isProtected ? '' : classes.hidden}
-      />
       <Popper
         open={open}
         anchorEl={anchorRef.current}
@@ -99,7 +101,6 @@ const CurrentIdentity = () => {
           </Grow>
         )}
       </Popper>
-      <div className={classes.displayName}>{user.displayName}</div>
     </>
   );
 };