Using user page layout/styles for groups where possible
This commit is contained in:
parent
78435833a5
commit
2288389a93
|
@ -1,13 +1,15 @@
|
|||
<div class='group-post-header'>
|
||||
<div class='group-post-avatar'>
|
||||
<div class='clearfix info'>
|
||||
<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'>
|
||||
<span class='time'>{{format-date post.created_at leaveAgo="true"}}</span>
|
||||
{{expand-post item=post}}
|
||||
|
||||
<div class='stream-topic-details'>
|
||||
<div class='stream-topic-title'>
|
||||
<span class='title'>
|
||||
<a href={{postUrl}}>{{{post.topic.fancyTitle}}}</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="group-post-category">{{category-link post.category}}</div>
|
||||
{{#if post.user.name}}
|
||||
|
@ -17,13 +19,10 @@
|
|||
</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>
|
||||
</div>
|
||||
<div class='group-post-excerpt'>
|
||||
|
||||
<div class='excerpt'>
|
||||
{{#if post.expandedExcerpt}}
|
||||
{{{post.expandedExcerpt}}}
|
||||
{{else}}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
{{#load-more selector=".group-post" action=(action "loadMore")}}
|
||||
<div class='group-posts'>
|
||||
<div class="user-stream">
|
||||
{{#each model as |post|}}
|
||||
{{group-post post=post class="group-post"}}
|
||||
{{group-post post=post class="user-stream-item item"}}
|
||||
{{else}}
|
||||
<div>{{i18n emptyText}}</div>
|
||||
{{/each}}
|
||||
|
|
|
@ -60,7 +60,9 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class='group-outlet'>
|
||||
<div class='user-table'>
|
||||
<div class='wrapper'>
|
||||
{{outlet}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,16 +1,14 @@
|
|||
<div class='group-activity container'>
|
||||
{{#mobile-nav class='group-activity-nav group-navigation' desktopClass="pull-left nav nav-stacked" currentPath=application.currentPath}}
|
||||
<section class="user-navigation">
|
||||
{{#mobile-nav class='activity-nav' desktopClass='action-list activity-list nav-stacked' currentPath=application.currentPath}}
|
||||
{{group-activity-filter filter="posts" categoryId=category_id}}
|
||||
{{group-activity-filter filter="topics" categoryId=category_id}}
|
||||
{{#if siteSettings.enable_mentions}}
|
||||
{{group-activity-filter filter="mentions" categoryId=category_id}}
|
||||
{{/if}}
|
||||
{{plugin-outlet name="below-group-activity-nav" tagName='' connectorTagName='li'}}
|
||||
{{plugin-outlet name="group-activity-bottom" tagName='' connectorTagName='li'}}
|
||||
{{/mobile-nav}}
|
||||
</section>
|
||||
|
||||
<div class="{{if site.mobileView "" "pull-left"}} group-activity-outlet">
|
||||
<div class='user-main'>
|
||||
<section class='user-right'>
|
||||
{{outlet}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<div class='group-manage container'>
|
||||
{{#mobile-nav class='group-navigation' desktopClass='pull-left nav nav-stacked' currentPath=application.currentPath}}
|
||||
<section class='user-navigation'>
|
||||
{{#mobile-nav class='activity-nav' desktopClass='action-list activity-list nav-stacked' currentPath=application.currentPath}}
|
||||
{{#each tabs as |tab|}}
|
||||
<li>
|
||||
{{#link-to tab.route model.name}}
|
||||
|
@ -8,8 +8,8 @@
|
|||
</li>
|
||||
{{/each}}
|
||||
{{/mobile-nav}}
|
||||
</section>
|
||||
|
||||
<div class="{{if site.mobileView "" "pull-left"}} group-manage-outlet">
|
||||
<section class='user-right'>
|
||||
{{outlet}}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<div class='group-activity container'>
|
||||
{{#mobile-nav class='group-navigation' desktopClass='pull-left nav nav-stacked' currentPath=application.currentPath}}
|
||||
<section class="user-navigation">
|
||||
{{#mobile-nav class='messages-nav' desktopClass='nav-stacked action-list' currentPath=application.currentPath}}
|
||||
|
||||
<li>
|
||||
{{#link-to 'group.messages.inbox' model.name}}
|
||||
|
@ -12,10 +12,7 @@
|
|||
{{/link-to}}
|
||||
</li>
|
||||
{{/mobile-nav}}
|
||||
|
||||
<div class="{{if site.mobileView "" "pull-left"}} group-messages-outlet">
|
||||
<div class='user-main'>
|
||||
</section>
|
||||
<section class='user-right messages'>
|
||||
{{outlet}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
@ -1,5 +1,9 @@
|
|||
// We should try to reuse the user page HTML for groups when possible
|
||||
// To style group content differently, use the existing classes with a .group parent class.
|
||||
// For example: .group .user-navigation
|
||||
|
||||
.group-details-container {
|
||||
background: rgba(230, 230, 230, 0.3);
|
||||
background: $primary-very-low;
|
||||
padding: 20px;
|
||||
margin-bottom: 15px;
|
||||
position: relative;
|
||||
|
@ -24,45 +28,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.group-post {
|
||||
.group-post-header {
|
||||
display: flex;
|
||||
|
||||
.group-post-avatar {
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
|
||||
.time,
|
||||
.delete-info {
|
||||
color: lighten($primary, 40%);
|
||||
font-size: $font-down-1;
|
||||
}
|
||||
|
||||
.group-member-info {
|
||||
display: flex;
|
||||
color: lighten($primary, 40%);
|
||||
}
|
||||
}
|
||||
|
||||
.group-post-info {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
.group-post-title {
|
||||
font-size: $font-up-1;
|
||||
}
|
||||
}
|
||||
|
||||
.group-post-excerpt {
|
||||
margin: 1em 0;
|
||||
word-wrap: break-word;
|
||||
color: $primary;
|
||||
}
|
||||
|
||||
padding: 1em 0;
|
||||
border-bottom: 1px solid $primary-low;
|
||||
}
|
||||
|
||||
.group-info {
|
||||
width: 100%;
|
||||
|
||||
|
@ -173,7 +138,7 @@ table.group-members {
|
|||
|
||||
td {
|
||||
text-align: center;
|
||||
color: blend-primary-secondary(50%);
|
||||
color: $primary-medium;
|
||||
padding: 0.8em 0;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
// Common styles for "/user" section
|
||||
// These styles are also used for "/groups" — test those pages if making significant changes
|
||||
.user-right {
|
||||
.list-actions {
|
||||
margin-bottom: 10px;
|
||||
|
|
Loading…
Reference in New Issue