From 80cc910175076a546c111a309f315b14c6438428 Mon Sep 17 00:00:00 2001
From: Toby Zerner <toby.zerner@gmail.com>
Date: Fri, 13 Feb 2015 22:03:34 +1030
Subject: [PATCH] Add styles for post footer/actions

Will be used by extensions
---
 .../app/components/discussion/post-comment.js |  6 +--
 ember/app/components/ui/action-button.js      |  2 +-
 ember/app/styles/flarum/discussion.less       | 37 +++++++++++++++++++
 .../components/discussion/post-comment.hbs    |  4 ++
 4 files changed, 44 insertions(+), 5 deletions(-)

diff --git a/ember/app/components/discussion/post-comment.js b/ember/app/components/discussion/post-comment.js
index 956b99523..b9393558e 100644
--- a/ember/app/components/discussion/post-comment.js
+++ b/ember/app/components/discussion/post-comment.js
@@ -9,8 +9,6 @@ import PostHeaderMeta from 'flarum/components/discussion/post-header/meta';
 import PostHeaderEdited from 'flarum/components/discussion/post-header/edited';
 import PostHeaderToggle from 'flarum/components/discussion/post-header/toggle';
 
-var precompileTemplate = Ember.Handlebars.compile;
-
 /**
   Component for a `comment`-typed post. Displays a number of item lists
   (controls, header, and footer) surrounding the post's HTML content. Allows
@@ -25,7 +23,7 @@ export default Ember.Component.extend(FadeIn, HasItemLists, UseComposer, {
     'post.isEdited:is-edited',
     'revealContent:reveal-content'
   ],
-  itemLists: ['controls', 'header', 'footer'],
+  itemLists: ['controls', 'header', 'footer', 'actions'],
 
   // The stream-content component instansiates this component and sets the
   // `content` property to the content of the item in the post-stream object.
@@ -88,7 +86,7 @@ export default Ember.Component.extend(FadeIn, HasItemLists, UseComposer, {
       var post = this.get('post');
       post.setProperties({
         isHidden: true,
-        hideTime: new Date,
+        hideTime: new Date(),
         hideUser: this.get('session.user')
       });
       post.save();
diff --git a/ember/app/components/ui/action-button.js b/ember/app/components/ui/action-button.js
index dc4ad971c..cf0f116e2 100644
--- a/ember/app/components/ui/action-button.js
+++ b/ember/app/components/ui/action-button.js
@@ -10,7 +10,7 @@ export default Ember.Component.extend({
   attributeBindings: ['href', 'title'],
   classNameBindings: ['className'],
   href: '#',
-  layout: precompileTemplate('{{#if icon}}{{fa-icon icon class="fa-fw icon-glyph"}} {{/if}}<span>{{label}}</span>'),
+  layout: precompileTemplate('{{#if icon}}{{fa-icon icon class="fa-fw icon-glyph"}} {{/if}}<span class="label">{{label}}</span>'),
 
   label: '',
   icon: '',
diff --git a/ember/app/styles/flarum/discussion.less b/ember/app/styles/flarum/discussion.less
index 1399246cf..c2538a320 100644
--- a/ember/app/styles/flarum/discussion.less
+++ b/ember/app/styles/flarum/discussion.less
@@ -212,6 +212,43 @@
   }
 }
 
+.post-footer, .post-actions {
+  & > ul {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+  }
+  &, & a {
+    color: @fl-body-muted-color;
+  }
+}
+.post-footer {
+  & > ul {
+    & > li {
+      margin-bottom: 5px;
+    }
+  }
+  & .fa {
+    font-size: 14px;
+    margin-right: 5px;
+  }
+}
+.post-actions {
+  margin-top: 10px;
+  opacity: 0;
+  .transition(opacity 0.2s);
+
+  & > ul {
+    & > li {
+      margin-right: 10px;
+      display: inline-block;
+    }
+  }
+  .post:hover & {
+    opacity: 1;
+  }
+}
+
 // ------------------------------------
 // Scrubber
 
diff --git a/ember/app/templates/components/discussion/post-comment.hbs b/ember/app/templates/components/discussion/post-comment.hbs
index 7a031f541..212438e80 100644
--- a/ember/app/templates/components/discussion/post-comment.hbs
+++ b/ember/app/templates/components/discussion/post-comment.hbs
@@ -11,3 +11,7 @@
 <aside class="post-footer">
   {{ui/item-list items=footer}}
 </aside>
+
+<aside class="post-actions">
+  {{ui/item-list items=actions}}
+</aside>