diff --git a/client/coral-admin/src/containers/Community/Community.css b/client/coral-admin/src/containers/Community/Community.css
index 6460c50d2..57a6a3c60 100644
--- a/client/coral-admin/src/containers/Community/Community.css
+++ b/client/coral-admin/src/containers/Community/Community.css
@@ -138,15 +138,21 @@
 
 .listItem {
   border-bottom: 1px solid #e0e0e0;
-  font-size: 16px;
+  font-size: 18px;
   width: 100%;
   max-width: 660px;
   min-width: 400px;
   margin: 0 auto;
-  padding: 16px 14px;
   position: relative;
-  transition: box-shadow 200ms;
+  transition: all 200ms;
+  padding: 10px 0 0;
+  min-height: 220px;
 
+  .container {
+    display: block;
+    padding: 0 14px;
+    min-height: 180px;
+  }
 
   &:hover {
      box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
@@ -156,6 +162,14 @@
     border-bottom: none;
   }
 
+  .context {
+    a {
+      color: #f36451;
+      text-decoration: underline;
+      float: right;
+    }
+  }
+
    .sideActions {
      position: absolute;
      right: 0;
@@ -166,18 +180,30 @@
    }
 
   .itemHeader {
-    display: inline;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
 
     .author {
-      font-size: 24px;
-      min-width: 50px;
-      align-items: left;
-      margin-bottom: 15px;
+      min-width: 230px;
+      display: flex;
+      align-items: center;
     }
   }
 
   .itemBody {
-    display: block;
+    display: flex;
+    justify-content: space-between;
+  }
+
+  .avatar {
+    margin-right: 16px;
+    height: 40px;
+    width: 40px;
+    border-radius: 50%;
+    background-color: #757575;
+    font-size: 40px;
+    color: #fff;
   }
 
   .created {
@@ -186,11 +212,18 @@
     margin-left: 40px;
   }
 
+  .actionButton {
+    transform: scale(.8);
+    margin: 0;
+  }
+
   .body {
-    margin-top: 20px;
+    margin-top: 0px;
     flex: 1;
-    font-size: 0.88em;
     color: black;
+    max-width: 500px;
+    word-wrap: break-word;
+    font-weight: 300;
   }
 
   .flagged {
diff --git a/client/coral-admin/src/containers/Community/CommunityContainer.js b/client/coral-admin/src/containers/Community/CommunityContainer.js
index 4056b6008..a7e59a14a 100644
--- a/client/coral-admin/src/containers/Community/CommunityContainer.js
+++ b/client/coral-admin/src/containers/Community/CommunityContainer.js
@@ -89,7 +89,10 @@ class CommunityContainer extends Component {
           error={community.errorPeople}
           totalPages={community.totalPagesPeople}
           page={community.pagePeople}
-          {...this}
+          onKeyDown={this.onKeyDownHandler}
+          onChange={this.onChangeHandler}
+          onHeaderClickHandler={this.onHeaderClickHandler}
+          onNewPageHandler={this.onNewPageHandler}
         />
       );
     }
@@ -104,7 +107,6 @@ class CommunityContainer extends Component {
           approveUser={props.approveUser}
           suspendUser={props.suspendUser}
           showSuspendUserDialog={props.showSuspendUserDialog}
-          {...this}
         />
         <BanUserDialog
           open={community.banDialog}
diff --git a/client/coral-admin/src/containers/Community/components/SuspendUserDialog.js b/client/coral-admin/src/containers/Community/components/SuspendUserDialog.js
index 5749a47a5..899920b46 100644
--- a/client/coral-admin/src/containers/Community/components/SuspendUserDialog.js
+++ b/client/coral-admin/src/containers/Community/components/SuspendUserDialog.js
@@ -4,7 +4,7 @@ import {Dialog, Button} from 'coral-ui';
 import styles from './SuspendUserDialog.css';
 
 import I18n from 'coral-framework/modules/i18n/i18n';
-import translations from '../../../translations.json';
+import translations from 'coral-admin/src/translations.json';
 
 const lang = new I18n(translations);
 
diff --git a/client/coral-admin/src/containers/Community/components/User.js b/client/coral-admin/src/containers/Community/components/User.js
index c0442362d..87a786099 100644
--- a/client/coral-admin/src/containers/Community/components/User.js
+++ b/client/coral-admin/src/containers/Community/components/User.js
@@ -16,53 +16,63 @@ const User = props => {
   // Do not display unless the user status is 'pending' or 'banned'.
   // This means that they have already been reviewed and approved.
   return (userStatus === 'PENDING' ||  userStatus === 'BANNED') &&
-    <li tabIndex={props.index} className={`mdl-card mdl-shadow--2dp ${styles.listItem} ${props.isActive && !props.hideActive ? styles.activeItem : ''}`}>
-      <div className={styles.itemHeader}>
-        <span className={styles.author}>{user.username}</span>
-        <ActionButton
-          className={styles.banButton}
-          type='BAN'
-          user={user}
-          showBanUserDialog={props.showBanUserDialog}
-        />
-      </div>
-      <div className={styles.itemBody}>
-        <div className={styles.flaggedByCount}>
-          <i className="material-icons">flag</i><span className={styles.flaggedByLabel}>Flags({ user.actions.length })</span>:
-            { user.action_summaries.map(
-            (action, i ) => {
-              return <span className={styles.flaggedBy} key={i}>
-                {lang.t(`community.${action.reason}`)} ({action.count})
-              </span>;
-            }
-          )}
+    <li tabIndex={props.index} className={`mdl-card ${props.selected ? 'mdl-shadow--8dp' : 'mdl-shadow--2dp'} ${styles.listItem} ${props.isActive && !props.hideActive ? styles.activeItem : ''}`}>
+      <div className={styles.container}>
+        <div className={styles.itemHeader}>
+          <div className={styles.author}>
+            <span>
+              {user.username}
+            </span>
+            <ActionButton
+              className={styles.banButton}
+              type='BAN'
+              user={user}
+              showBanUserDialog={props.showBanUserDialog}
+            />
+          </div>
         </div>
-        <div className={styles.flaggedReasons}>
-          {user.actions.map(
-            (action, i) => {
-              return <span key={i}>
-                {action.reason}
-                {/* action.user.username */}
-              </span>;
-            }
-          )}
-        </div>
-        <div className={styles.sideActions}>
-          <div className={`actions ${styles.actions}`}>
-            {modActionButtons.map(
+
+        <div className={styles.itemBody}>
+          <div className={styles.body}>
+            <div className={styles.flaggedByCount}>
+              <i className="material-icons">flag</i><span className={styles.flaggedByLabel}>Flags({ user.actions.length })</span>:
+                { user.action_summaries.map(
+                (action, i ) => {
+                  return <span className={styles.flaggedBy} key={i}>
+                    {lang.t(`community.${action.reason}`)} ({action.count})
+                  </span>;
+                }
+              )}
+            </div>
+            <div className={styles.flaggedReasons}>
+            {user.actions.map(
               (action, i) => {
-                return <ActionButton
-                  type={action.toUpperCase()}
-                  key={i}
-                  user={user}
-                  approveUser={props.approveUser}
-                  suspendUser={props.suspendUser}
-                  showSuspendUserDialog={props.showSuspendUserDialog}
-                  />;
+                return <span key={i}>
+                  {action.id}
+                  {action.reason}
+                  {action.user  && action.user.username}
+                </span>;
               }
             )}
           </div>
         </div>
+          <div className={styles.sideActions}>
+            <div className={`actions ${styles.actions}`}>
+                {modActionButtons.map(
+                  (action, i) => {
+                    return <ActionButton
+                      type={action.toUpperCase()}
+                      key={i}
+                      user={user}
+                      approveUser={props.approveUser}
+                      suspendUser={props.suspendUser}
+                      showSuspendUserDialog={props.showSuspendUserDialog}
+                      />;
+                  }
+                )}
+            </div>
+          </div>
+        </div>
       </div>
     </li>;
 };
diff --git a/client/coral-admin/src/containers/Community/components/styles.css b/client/coral-admin/src/containers/Community/components/styles.css
index e2fd31911..2cd3f7b50 100644
--- a/client/coral-admin/src/containers/Community/components/styles.css
+++ b/client/coral-admin/src/containers/Community/components/styles.css
@@ -141,7 +141,6 @@ span {
       position: fixed;
       bottom: 60px;
       left: 25%;
-      margin: 0 auto;
       display: flex;
       justify-content: space-around;
       width: 50%;
@@ -156,16 +155,20 @@ span {
 
 .listItem {
   border-bottom: 1px solid #e0e0e0;
-  font-size: 16px;
+  font-size: 18px;
   width: 100%;
   max-width: 660px;
   min-width: 400px;
   margin: 0 auto;
-  padding: 16px 14px;
   position: relative;
-  transition: box-shadow 200ms;
-  margin-top: 0;
+  transition: all 200ms;
+  padding: 10px 0 0;
+  min-height: 220px;
 
+  .container {
+    padding: 0 14px;
+    min-height: 180px;
+  }
 
   &:hover {
      box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
@@ -233,10 +236,10 @@ span {
   .body {
     margin-top: 0px;
     flex: 1;
-    font-size: 0.88em;
     color: black;
     max-width: 500px;
     word-wrap: break-word;
+    font-weight: 300;
   }
 
   .flagged {
diff --git a/client/coral-admin/src/containers/ModerationQueue/components/Comment.js b/client/coral-admin/src/containers/ModerationQueue/components/Comment.js
index 36ff7763a..f68bab2b7 100644
--- a/client/coral-admin/src/containers/ModerationQueue/components/Comment.js
+++ b/client/coral-admin/src/containers/ModerationQueue/components/Comment.js
@@ -21,19 +21,19 @@ const Comment = ({actions = [], ...props}) => {
   const links = linkify.getMatches(props.comment.body);
   const actionSummaries = props.comment.action_summaries;
   return (
-    <li tabIndex={props.index} className={`mdl-card ${props.selected ? 'mdl-shadow--8dp' : 'mdl-shadow--2dp'} ${styles.Comment} ${styles.listItem} ${props.selected ? styles.selected : ''}`}>
+    <li tabIndex={props.index} className={`mdl-card ${props.selected ? 'mdl-shadow--8dp' : 'mdl-shadow--2dp'} ${styles.Comment} ${styles.listItem}`}>
       <div className={styles.container}>
         <div className={styles.itemHeader}>
           <div className={styles.author}>
-          <span>
-            {props.comment.user.name}
-          </span>
-          <span className={styles.created}>
-            {timeago().format(props.comment.created_at || (Date.now() - props.index * 60 * 1000), lang.getLocale().replace('-', '_'))}
-          </span>
-          <BanUserButton user={props.comment.user} onClick={() => props.showBanUserDialog(props.comment.user, props.comment.id, props.comment.status !== 'REJECTED')} />
-          <CommentType type={props.commentType} />
-        </div>
+            <span>
+              {props.comment.user.name}
+            </span>
+            <span className={styles.created}>
+              {timeago().format(props.comment.created_at || (Date.now() - props.index * 60 * 1000), lang.getLocale().replace('-', '_'))}
+            </span>
+            <BanUserButton user={props.comment.user} onClick={() => props.showBanUserDialog(props.comment.user, props.comment.id, props.comment.status !== 'REJECTED')} />
+            <CommentType type={props.commentType} />
+          </div>
           {props.comment.user.status === 'banned' ?
             <span className={styles.banned}>
               <Icon name='error_outline'/>