wrapped up the general layout of topic/posts

less/topic.less

@@ -4,7 +4,6 @@
 			font-size: 17px;
 			line-height: 17px;
 			border-radius: 50%;
-			margin-right: 15px;
 			min-width: 46px;
 			min-height: 46px;
 			margin-top: 2px;
@@ -18,9 +17,9 @@
 		}
 
 		h1 {
-			font-size: 22px;
+			font-size: 28px;
 			line-height: 24px;
-			margin: 0;
+			margin-bottom: 30px
 		}
 	}
 
@@ -61,6 +60,8 @@
 	.content {
 		margin-top: 20px;
 		padding-bottom: 10px;
+		margin-top: -43px;
+		margin-left: 61px;
 	}
 }
 

templates/partials/topic/post.tpl

@@ -1,3 +1,7 @@
+<!-- IF !posts.index -->
+<h1 component="post/header" itemprop="name"><i class="fa fa-thumb-tack hide"></i> <i class="fa fa-lock hide"></i> {title}</h1>
+<!-- ENDIF !posts.index -->
+
 <div class="clearfix">
 	<div class="icon pull-left">
 		<a href="<!-- IF posts.user.userslug -->{relative_path}/user/{posts.user.userslug}<!-- ELSE -->#<!-- ENDIF posts.user.userslug -->">
@@ -8,23 +12,21 @@
 		</a>
 	</div>
 
-	<h1 class="title pull-left">
-		<!-- IF !posts.index -->
-		<p component="post/header" itemprop="name"><i class="fa fa-thumb-tack hide"></i> <i class="fa fa-lock hide"></i> {title}</p>
-		<!-- ENDIF !posts.index -->
-		<small>
-			<i class="fa fa-circle status {posts.user.status}" title="[[global:{posts.user.status}]]"></i>
-			<strong><a class="username-field" href="<!-- IF posts.user.userslug -->{relative_path}/user/{posts.user.userslug}<!-- ELSE -->#<!-- ENDIF posts.user.userslug -->" itemprop="author" data-username="{posts.user.username}" data-uid="{posts.user.uid}">
-				{posts.user.username}
-			</a></strong>
-			[[global:posted_ago, <span class="timeago" title="{posts.relativeTime}"></span>]]
-			<!-- IF posts.editor.username -->
-			<span>| [[global:last_edited_by_ago, <strong><a href="{relative_path}/user/{posts.editor.userslug}">{posts.editor.username}</a></strong>, <span class="timeago" title="{posts.relativeEditTime}"></span>]]</span>
-			<!-- ENDIF posts.editor.username -->
-		</small>
-	</h1>
+	<small class="pull-left">
+		<i class="fa fa-circle status {posts.user.status}" title="[[global:{posts.user.status}]]"></i>
+		<strong>
+			<a class="username-field" href="<!-- IF posts.user.userslug -->{relative_path}/user/{posts.user.userslug}<!-- ELSE -->#<!-- ENDIF posts.user.userslug -->" itemprop="author" data-username="{posts.user.username}" data-uid="{posts.user.uid}">{posts.user.username}</a>
+		</strong>
+
+		[[global:posted_ago, <span class="timeago" title="{posts.relativeTime}"></span>]]
+
+		<!-- IF posts.editor.username -->
+		<span>| [[global:last_edited_by_ago, <strong><a href="{relative_path}/user/{posts.editor.userslug}">{posts.editor.username}</a></strong>, <span class="timeago" title="{posts.relativeEditTime}"></span>]]</span>
+		<!-- ENDIF posts.editor.username -->
+	</small>
 </div>
 
+<br />
 <div class="content" component="post/content" itemprop="text">{posts.content}</div>
 
 <hr />