Ghost/ghost/admin/app/templates/members-activity.hbs
James Morris 4ec15f7323 Tweaked visual things for polish with Activity
refs: https://github.com/TryGhost/Team/issues/1373

- Simplify the member details link on single member activity
- Adjust all the activity scrolling to work better at all sizes
- Make the header work properly with truncating at narrower viewports
- Remove unnecessary CSS and classes
- Remove the top line from the member detail box
- Move the member detail box so it stays when scrolling
- Make the empty state work with new member detail box position
- Better scrolling full width whilst not having full width like members
- Fix the subscriptions event icon which was a white box in dark mode
- Adjustments to global gh-list-scrolling styles at narrower viewports
- Test fully on narrower viewports and major browsers
2022-03-10 15:24:38 +00:00

48 lines
2.1 KiB
Handlebars

<section class="gh-canvas gh-members-activity {{if this.memberRecord "gh-members-activity-single"}}">
<GhCanvasHeader class="gh-canvas-header">
<h2 class="gh-canvas-title" data-test-screen-title>
<LinkTo @route="members-activity" @query={{reset-query-params "members-activity"}} data-test-link="members-activity-back">Activity</LinkTo>
{{#if this.memberRecord}}
<span>{{svg-jar "arrow-right"}}</span>
<span class="truncate">{{or this.memberRecord.name this.memberRecord.email}}</span>
{{/if}}
</h2>
<div class="view-actions">
<MembersActivity::EventTypeFilter
@excludedEvents={{this.excludedEvents}}
@hiddenEvents={{this.hiddenEvents}}
@onChange={{this.changeExcludedEvents}} />
<MembersActivity::MemberFilter
@selected={{this.memberRecord}}
@onChange={{this.changeMember}} />
</div>
</GhCanvasHeader>
<div class="view-container">
{{#let (members-event-fetcher filter=(members-event-filter excludedEvents=this.fullExcludedEvents member=this.member) pageSize=50) as |eventsFetcher|}}
{{#if eventsFetcher.data}}
{{#if this.memberRecord}}
<GhMemberDetailsActivity @member={{this.memberRecord}} />
{{/if}}
<div class="gh-list-scrolling">
<MembersActivity::Table @hideMemberColumn={{if this.member true}} @events={{eventsFetcher.data}} />
{{#if (not (or eventsFetcher.isLoading eventsFetcher.hasReachedEnd))}}
<GhScrollTrigger @enter={{eventsFetcher.loadNextPage}} @triggerOffset={{250}} />
{{/if}}
</div>
{{else}}
{{#unless eventsFetcher.isLoading}}
<MembersActivity::NoEvents @filter={{this.filter}} />
{{/unless}}
{{/if}}
{{#if eventsFetcher.isLoading}}
<div class="no-posts-box"><GhLoadingSpinner /></div>
{{/if}}
{{/let}}
</div>
</section>
{{outlet}}