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

ghost/admin/app/components/dashboard/charts/recents.hbs

@@ -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}}
+                                                    <span class="gh-members-activity-description {{if (feature "memberAttribution") 'feature-memberAttribution'}}">
-                                                    {{#if parsedEvent.url}}
+                                                        <span class="gh-members-activity-event-text">{{capitalize-first-letter parsedEvent.action}}</span>
-                                                        <a class="ghost-members-activity-object-link {{if (feature "memberAttribution") 'hidden'}}" href="{{parsedEvent.url}}" target="_blank" rel="noopener noreferrer">{{parsedEvent.object}}</a>
+                                                        {{#if parsedEvent.info}}
-                                                    {{/if}}
+                                                            <span class="highlight">{{parsedEvent.info}}</span>
-                                                    {{#if parsedEvent.info}}
+                                                        {{/if}}
-                                                        <span class="highlight">{{parsedEvent.info}}</span>
+                                                        {{#if parsedEvent.url}}
-                                                    {{/if}}
+                                                            <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>

ghost/admin/app/components/gh-member-details.hbs

@@ -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">

ghost/admin/app/components/member/activity-feed.hbs

@@ -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">
+                                                        <span class="gh-members-activity-description {{if (feature "memberAttribution") 'feature-memberAttribution'}}">
-                                                            {{capitalize-first-letter event.action}}
+                                                            <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>

ghost/admin/app/components/members-activity/table-row.hbs

@@ -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">
+                    <span class="gh-members-activity-description {{if (feature "memberAttribution") 'feature-memberAttribution'}}">
-                        {{capitalize-first-letter event.action}}
+                        <span class="gh-members-activity-event-text">{{capitalize-first-letter event.action}}</span>
-                        {{#if (and event.url (not (feature "memberAttribution")))}}
+                        {{#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}}
@@ -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}}

ghost/admin/app/components/members-activity/table.hbs

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

ghost/admin/app/styles/layouts/dashboard.css

@@ -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;

ghost/admin/app/styles/layouts/member-activity.css

@@ -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;

ghost/admin/app/styles/layouts/members.css

@@ -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;