Going for a simpler design for events

- The extra column made sense logically but was causing too many issues
- Going to try the single setence again but change visual style to be easier to parse
- Making sure this works around the feature flag

refs https://github.com/TryGhost/Team/issues/1851
This commit is contained in:
James Morris 2022-08-25 14:19:55 +01:00
parent 232882daa2
commit 86a0f103e9
8 changed files with 49 additions and 53 deletions

View File

@ -66,11 +66,10 @@
</div>
</div>
{{else}}
<div class="gh-dashboard-recents-activity gh-dashboard-list {{if (feature "memberAttribution") 'feature-memberAttribution'}}" data-test-dashboard-member-activity>
<div class="gh-dashboard-recents-activity gh-dashboard-list" data-test-dashboard-member-activity>
<div class="gh-dashboard-list-header">
<div class="gh-dashboard-list-title">Member</div>
<div class="gh-dashboard-list-title">Event</div>
{{#if (feature "memberAttribution")}}<div class="gh-dashboard-list-title">Attribution</div>{{/if}}
<div class="gh-dashboard-list-title">Time</div>
</div>
<div class="gh-dashboard-list-body">
@ -98,26 +97,20 @@
<LinkTo class="gh-dashboard-list-text" @route="member" @model="{{parsedEvent.memberId}}" data-test-dashboard-member-activity-item>{{parsedEvent.subject}}</LinkTo>
</div>
<div class="gh-dashboard-list-item-sub">
{{svg-jar parsedEvent.icon}}
{{svg-jar parsedEvent.icon }}
<span class="gh-dashboard-list-subtext">
{{capitalize-first-letter parsedEvent.action}}
{{#if parsedEvent.url}}
<a class="ghost-members-activity-object-link {{if (feature "memberAttribution") 'hidden'}}" href="{{parsedEvent.url}}" target="_blank" rel="noopener noreferrer">{{parsedEvent.object}}</a>
{{/if}}
{{#if parsedEvent.info}}
<span class="highlight">{{parsedEvent.info}}</span>
{{/if}}
<span class="gh-members-activity-description {{if (feature "memberAttribution") 'feature-memberAttribution'}}">
<span class="gh-members-activity-event-text">{{capitalize-first-letter parsedEvent.action}}</span>
{{#if parsedEvent.info}}
<span class="highlight">{{parsedEvent.info}}</span>
{{/if}}
{{#if parsedEvent.url}}
<span class="gh-members-activity-event-join">{{parsedEvent.join}}</span>
<a class="ghost-members-activity-object-link" href="{{parsedEvent.url}}" target="_blank" rel="noopener noreferrer">{{parsedEvent.object}}</a>
{{/if}}
</span>
</span>
</div>
{{#if (feature "memberAttribution")}}
<div class="gh-dashboard-list-item-sub">
{{#if parsedEvent.url}}
<a class="ghost-members-activity-object-link" href="{{parsedEvent.url}}" target="_blank" rel="noopener noreferrer">{{parsedEvent.object}}</a>
{{else}}
<span class="gh-list-nodata">&mdash;</span>
{{/if}}
</div>
{{/if}}
<div class="gh-dashboard-list-item-sub gh-dashboard-list-item-date">
<span class="gh-dashboard-list-subtext">{{moment-from-now parsedEvent.timestamp}}</span>
</div>

View File

@ -49,7 +49,7 @@
{{#if (and @member.attribution @member.attribution.url @member.attribution.title) }}
<p>
{{svg-jar "satellite"}}
Signed up to&nbsp;<a href="{{@member.attribution.url}}" target="_blank" rel="noopener noreferrer">{{ @member.attribution.title }}</a>
Signed up on&nbsp;<a href="{{@member.attribution.url}}" target="_blank" rel="noopener noreferrer">{{ @member.attribution.title }}</a>
</p>
{{/if}}
<p class="gh-member-last-seen">

View File

@ -24,16 +24,18 @@
<div class="gh-member-feed-detail">
<div class="gh-member-feed-event">
<span class="gh-member-feed-event-inner">
<span class="gh-members-activity-description">
{{capitalize-first-letter event.action}}
<span class="gh-members-activity-description {{if (feature "memberAttribution") 'feature-memberAttribution'}}">
<span class="gh-members-activity-event-text">{{capitalize-first-letter event.action}}</span>
{{#if event.info}}
<span class="highlight">{{event.info}}</span>
{{/if}}
{{#if event.url}}
{{event.join}}
<span class="gh-members-activity-event-join">{{event.join}}</span>
<a class="ghost-members-activity-object-link" href="{{event.url}}" target="_blank" rel="noopener noreferrer">{{event.object}}</a>
{{/if}}
{{#if event.email}}
<GhEmailPreviewLink @data={{event.email}} />
{{/if}}
<span class="highlight">{{event.info}}</span>
</span>
</span>
</div>

View File

@ -19,10 +19,10 @@
<div class="gh-members-activity-container">
<div class="gh-members-activity-icon">{{svg-jar event.icon}}</div>
<div class="gh-members-activity-event">
<span class="gh-members-activity-description">
{{capitalize-first-letter event.action}}
{{#if (and event.url (not (feature "memberAttribution")))}}
{{event.join}}
<span class="gh-members-activity-description {{if (feature "memberAttribution") 'feature-memberAttribution'}}">
<span class="gh-members-activity-event-text">{{capitalize-first-letter event.action}}</span>
{{#if event.url}}
<span class="gh-members-activity-event-join">{{event.join}}</span>
<a class="ghost-members-activity-object-link" href="{{event.url}}" target="_blank" rel="noopener noreferrer">{{event.object}}</a>
{{/if}}
{{#if event.email}}
@ -35,17 +35,6 @@
</div>
</div>
</div>
{{#if (feature "memberAttribution")}}
<div class="gh-list-data gh-list-data-attribution">
{{#if event.url}}
<a class="ghost-members-activity-object-link" href="{{event.url}}" target="_blank" rel="noopener noreferrer">{{event.object}}</a>
{{else if event.email}}
<GhEmailPreviewLink @data={{event.email}} />
{{else}}
<span class="gh-list-nodata">&mdash;</span>
{{/if}}
</div>
{{/if}}
<div class="gh-list-data gh-list-data-date">{{moment-format event.timestamp "DD MMM YYYY HH:mm"}}</div>
</tr>
{{/let}}

View File

@ -5,9 +5,6 @@
<th>Member</th>
{{/unless}}
<th>Event</th>
{{#if (feature "memberAttribution")}}
<th>Attribution</th>
{{/if}}
<th>Time</th>
</tr>
</thead>

View File

@ -713,11 +713,6 @@ Dashboard List */
overflow: hidden;
}
.gh-dashboard-list-subtext a {
font-weight: 600;
color: var(--darkgrey);
}
.gh-dashboard-list-item svg {
width: 24px;
min-width: 24px;

View File

@ -153,11 +153,37 @@
overflow: hidden;
}
.gh-members-activity-description.feature-memberAttribution {
color: var(--darkgrey);
}
.gh-members-activity-description.feature-memberAttribution a {
font-weight: 400;
color: var(--midgrey) !important;
text-decoration: underline;
text-decoration-color: var(--midlightgrey);
transition: all 150ms ease;
}
.gh-members-activity-description.feature-memberAttribution a:hover {
color: var(--middarkgrey) !important;
}
.gh-members-activity-description a {
font-weight: 600;
color: var(--darkgrey);
}
.gh-members-activity-event-join {
font-weight: 500;
color: var(--middarkgrey);
}
.feature-memberAttribution .gh-members-activity-event-join {
font-weight: 400;
color: var(--midgrey);
}
.gh-members-activity-icon {
width: 24px;
min-width: 24px;

View File

@ -1186,12 +1186,6 @@ textarea.gh-member-details-textarea {
height: 100%;
}
.gh-member-settings .gh-members-activity-description {
font-weight: 500;
font-size: 1.4rem;
color: var(--middarkgrey);
}
.gh-member-feed-time {
font-weight: 500;
font-size: 1.3rem;