Fix button layout

app/src/components/Sidebar/TopicPanel/RecursiveTopicDeleteButton.tsx

@@ -28,15 +28,11 @@ export const RecursiveTopicDeleteButton = (props: {
   }
   return (
     <Badge
-      style={{
-        top: '3px',
-        right: '3px',
-      }}
       badgeContent={<span style={{ whiteSpace: 'nowrap' }}>{topicCount >= deleteLimit ? '50+' : topicCount}</span>}
       color="secondary"
     >
       <CustomIconButton onClick={onClick} tooltip={`Deletes up to ${deleteLimit} sub-topics with a single click`}>
-        <Delete style={{ marginTop: '-3px' }} color="action" />
+        <Delete color="action" />
       </CustomIconButton>
     </Badge>
   )

app/src/components/Sidebar/TopicPanel/TopicDeleteButton.tsx

@@ -13,7 +13,7 @@ export const TopicDeleteButton = (props: {
   }
   return (
     <CustomIconButton onClick={() => props.deleteTopicAction(node)} tooltip="Clear this topic">
-      <Delete style={{ marginTop: '-3px' }} />
+      <Delete />
     </CustomIconButton>
   )
 }

app/src/components/helper/Copy.tsx

@@ -44,13 +44,9 @@ class Copy extends React.PureComponent<Props, State> {
     )
 
     return (
-      <span>
-        <span style={{ fontSize: '16px' }}>
-          <CustomIconButton onClick={this.handleClick} tooltip="Copy to clipboard">
-            {icon}
-          </CustomIconButton>
-        </span>
-      </span>
+      <CustomIconButton onClick={this.handleClick} tooltip="Copy to clipboard">
+        <div style={{ marginTop: '2px' }}>{icon}</div>
+      </CustomIconButton>
     )
   }
 }

app/src/components/helper/CustomIconButton.tsx

@@ -16,6 +16,9 @@ const styles = (theme: Theme) => ({
     width: '32px',
     height: '32px',
   },
+  tooltip: {
+    marginTop: '-16px',
+  },
   label: {
     marginTop: '-2px',
   },
@@ -34,8 +37,8 @@ class CustomIconButton extends React.PureComponent<Props, {}> {
   public render() {
     return (
       <IconButton className={this.props.classes.button} style={this.props.style} onClick={this.onClick}>
-        <Tooltip title={this.props.tooltip} className={this.props.classes.label}>
-          <span>{this.props.children}</span>
+        <Tooltip title={this.props.tooltip} classes={{ popper: this.props.classes.tooltip }}>
+          <span className={this.props.classes.label}>{this.props.children}</span>
         </Tooltip>
       </IconButton>
     )