Clean up new post layout

framework/core/js/forum/src/components/CommentPost.js

@@ -10,8 +10,6 @@ import Composer from 'flarum/components/Composer';
 import ItemList from 'flarum/utils/ItemList';
 import listItems from 'flarum/helpers/listItems';
 import Button from 'flarum/components/Button';
-import Dropdown from 'flarum/components/Dropdown';
-import PostControls from 'flarum/utils/PostControls';
 
 /**
  * The `CommentPost` component displays a standard `comment`-typed post. This
@@ -44,8 +42,6 @@ export default class CommentPost extends Post {
   }
 
   content() {
-    const controls = PostControls.controls(this.props.post, this).toArray();
-
     return [
       <header className="Post-header"><ul>{listItems(this.headerItems().toArray())}</ul></header>,
       <div className="Post-body">
@@ -53,16 +49,6 @@ export default class CommentPost extends Post {
           ? <div className="Post-preview" config={this.configPreview.bind(this)}/>
           : m.trust(this.props.post.contentHtml())}
       </div>,
-      <aside className="Post-actions"><ul>
-        {controls.length ? Dropdown.component({
-                children: controls,
-                className: 'Post-controls',
-                buttonClassName: 'Button Button--icon Button--flat',
-                menuClassName: 'Dropdown-menu--right',
-                icon: 'ellipsis-h'
-              }) : ''}
-        {listItems(this.actionItems().toArray())}
-      </ul></aside>,
       <footer className="Post-footer"><ul>{listItems(this.footerItems().toArray())}</ul></footer>
     ];
   }
@@ -198,13 +184,4 @@ export default class CommentPost extends Post {
   footerItems() {
     return new ItemList();
   }
-
-  /**
-   * Build an item list for the post's actions.
-   *
-   * @return {ItemList}
-   */
-  actionItems() {
-    return new ItemList();
-  }
 }

framework/core/js/forum/src/components/Post.js

@@ -2,6 +2,8 @@ import Component from 'flarum/Component';
 import SubtreeRetainer from 'flarum/utils/SubtreeRetainer';
 import Dropdown from 'flarum/components/Dropdown';
 import PostControls from 'flarum/utils/PostControls';
+import listItems from 'flarum/helpers/listItems';
+import ItemList from 'flarum/utils/ItemList';
 
 /**
  * The `Post` component displays a single post. The basic post template just
@@ -45,9 +47,21 @@ export default class Post extends Component {
 
           return (
             <div>
-
-
               {this.content()}
+              <aside className="Post-actions">
+                <ul>
+                  {listItems(this.actionItems().toArray())}
+                  {controls.length ? <li>
+                    <Dropdown
+                      className="Post-controls"
+                      buttonClassName="Button Button--icon Button--flat"
+                      menuClassName="Dropdown-menu--right"
+                      icon="ellipsis-h">
+                      {controls}
+                    </Dropdown>
+                  </li> : ''}
+                </ul>
+              </aside>
             </div>
           );
         })()}
@@ -72,4 +86,13 @@ export default class Post extends Component {
   content() {
     return '';
   }
+
+  /**
+   * Build an item list for the post's actions.
+   *
+   * @return {ItemList}
+   */
+  actionItems() {
+    return new ItemList();
+  }
 }

framework/core/less/forum/Post.less

@@ -15,11 +15,6 @@
     opacity: 0.5;
   }
 }
-.Post-controls {
-  float: right;
-  // margin-top: -8px;
-  // margin-left: 10px;
-}
 
 .Post-header {
   margin-bottom: 15px;
@@ -148,6 +143,9 @@
   .Post-header, .Post-header a, .PostUser h3, .PostUser h3 a {
     color: @muted-more-color;
   }
+  &:not(.revealContent) .Post-header {
+    margin-bottom: 0;
+  }
   .Post-body, .Post-footer, h3 .Avatar, .PostUser-badges {
     position: absolute;
     visibility: hidden;
@@ -249,12 +247,16 @@
 }
 .Post-actions {
   float: right;
-  margin-top: -3px;
+  margin-top: -10px;
   .transition(opacity 0.2s);
 
+  .EventPost &, .Post--hidden & {
+    margin-top: -27px;
+  }
+
   @media @tablet-up {
-    margin-bottom: -10px;
-    opacity: 0.5;
+    margin-bottom: -15px;
+    opacity: 0;
   }
 
   > ul {
@@ -262,6 +264,7 @@
       margin-right: 0;
       margin-left: -5px;
       display: inline-block;
+      vertical-align: top;
     }
   }
   .Post:hover & {
@@ -297,14 +300,6 @@
 }
 
 @media @phone {
-  .Post-controls {
-    margin-top: -6px;
-    margin-right: -8px;
-
-    .Dropdown-toggle {
-      opacity: 0.5;
-    }
-  }
   .Post-header {
     .Avatar {
       .Avatar--size(32px);
@@ -338,14 +333,6 @@
 @media @tablet-up {
   .Post {
     padding-left: 20px + @avatar-column-width;
-
-    // .Post-controls {
-    //   opacity: 0.5;
-    //   transition: opacity 0.2s;
-    // }
-    // &:hover .Post-controls, .Post-controls.open {
-    //   opacity: 1;
-    // }
   }
   .PostUser-avatar {
     margin-left: -@avatar-column-width;