浏览代码

Use user color as background for avatar

sbkwgh 8 年之前
父节点
当前提交
4d80372f99
共有 2 个文件被更改,包括 3 次插入2 次删除
  1. 1 1
      src/components/PostReply.vue
  2. 2 1
      src/components/routes/Thread.vue

+ 1 - 1
src/components/PostReply.vue

@@ -11,7 +11,7 @@
 			<div class='post_reply__content' v-html='post.content'></div>
 		</div>
 		<div class='post_reply__display'>
-			<div class='post_reply__letter'>{{post.User.username[0]}}</div>
+			<div class='post_reply__letter' :style='{"background-color": post.User.color}'>{{post.User.username[0]}}</div>
 			<div class='post_reply__username'>{{post.User.username}}</div>
 		</div>
 	</div>

+ 2 - 1
src/components/routes/Thread.vue

@@ -26,7 +26,7 @@
 		<div class='posts'>
 			<div class='post' v-for='post in posts'>
 				<div class='post__meta_data'>
-					<div class='post__avatar'>{{post.User.username[0]}}</div>
+					<div class='post__avatar' :style='{"background-color": post.User.color}'>{{post.User.username[0]}}</div>
 					<div class='post__user'>{{post.User.username}}</div>
 					<span class='fa fa-long-arrow-right fa-fw' v-if='post.replyingToUsername'></span>
 					<div class='post__reply' v-if='post.replyingToUsername'>{{post.replyingToUsername}}</div>
@@ -228,6 +228,7 @@
 		@at-root #{&}__footer {
 			padding: 0.5rem 0 0.75rem 4rem;
 			display: flex;
+			align-items: baseline;
 			justify-content: space-between;
 
 			@at-root #{&}_group {