UX: Convert Group Posts to Flexbox

This commit is contained in:
Robin Ward
2017-11-02 14:21:34 -04:00
parent 64cb8a3ce3
commit e700068b17
5 changed files with 64 additions and 31 deletions

View File

@@ -1,19 +1,28 @@
<div class="user-stream-item item">{{!-- DEPRECATED: 'item' class --}}
<div class='clearfix info'>
<a href="{{unbound post.user.userUrl}}" data-user-card="{{unbound post.user.username}}" class='avatar-link'><div class='avatar-wrapper'>{{avatar post.user imageSize="large" extraClasses="actor" ignoreTitle="true"}}</div></a>
<span class='time'>{{format-date post.created_at leaveAgo="true"}}</span>
{{expand-post item=post}}
<span class="title">
<a href={{post.url}}>{{{post.topic.fancyTitle}}}</a>
</span>
<span class="category">{{category-link post.category}}</span>
<div class="group-member-info">
<div class='group-post-header'>
<div class='group-post-avatar'>
<a href="{{unbound post.user.userUrl}}" data-user-card="{{unbound post.user.username}}" class='avatar-link'>
{{avatar post.user imageSize="large" extraClasses="actor" ignoreTitle="true"}}
</a>
</div>
<div class='group-post-info'>
<div class="group-post-topic">
<div class='group-post-title'>
<a href={{post.url}}>{{{post.topic.fancyTitle}}}</a>
</div>
<div class="group-post-category">{{category-link post.category}}</div>
{{#if post.user.name}}
<span class="name">{{post.user.name}}</span>{{#if post.user.title}}<span class="title">, {{post.user.title}}</span>{{/if}}
<div class="group-member-info">
<span class="name">{{post.user.name}}</span>
{{#if post.user.title}}<span class="title">, {{post.user.title}}</span>{{/if}}
</div>
{{/if}}
</div>
<div class='group-post-controls'>
{{expand-post item=post}}
<span class='time'>{{format-date post.created_at leaveAgo="true"}}</span>
</div>
</div>
<p class='excerpt'>
{{{post.excerpt}}}
</p>
</div>
<div class='group-post-excerpt'>
{{{post.excerpt}}}
</div>

View File

@@ -1,7 +1,7 @@
{{#load-more selector=".user-stream .user-stream-item" action=(action "loadMore")}}
<div class='user-stream'>
{{#load-more selector=".group-post" action=(action "loadMore")}}
<div class='group-posts'>
{{#each model as |post|}}
{{group-post post=post}}
{{group-post post=post class="group-post"}}
{{else}}
<div>{{i18n emptyText}}</div>
{{/each}}