Updated post list

app/components/gh-posts-list-item.js

@@ -24,6 +24,16 @@ export default Component.extend({
         return authors.map(author => author.get('name') || author.get('email')).join(', ');
     }),
 
+    primaryTag: computed('post.authors.[]', function () {
+        let primaryTag = this.get('post.tags.firstObject');
+
+        if (primaryTag) {
+            return primaryTag.get('name');
+        } else {
+            return false;
+        }
+    }),
+
     subText: computed('post.{excerpt,customExcerpt,metaDescription}', function () {
         let text = this.get('post.excerpt') || '';
         let customExcerpt = this.get('post.customExcerpt');

app/styles/layouts/content.css

@@ -137,10 +137,19 @@
 .content-list .gh-list-header.no-padding {
     padding: 0 !important;
 }
+
 .gh-posts-title-header {
     padding-left: 10px;
 }
 
+.gh-posts-status-header {
+    width: 160px;
+}
+
+.gh-posts-lastupdate-header {
+    width: 160px;
+}
+
 .gh-post-list-title {
     padding-left: 10px;
 }
@@ -186,8 +195,6 @@
     margin: 4px 0 0 0;
     font-size: 1.3rem;
     color: var(--midlightgrey);
-    font-weight: 200;
-    letter-spacing: 0.3px;
 }
 
 .gh-content-entry-meta .gh-badge {
@@ -224,6 +231,16 @@
     fill: var(--blue);
 }
 
+.gh-content-emailed {
+    display: inline-block;
+    margin: 2px 6px 0;
+}
+
+.gh-content-emailed svg {
+    width: 13px;
+    height: 13px;
+}
+
 .gh-content-entry-author {
     color: var(--middarkgrey);
 }

app/templates/components/gh-posts-list-item.hbs

@@ -8,48 +8,49 @@
     <h3 class="gh-content-entry-title">
         {{this.post.title}}
     </h3>
-    {{#if isScheduled}}
-        <p>
-            <span class="gh-schedule-time">Scheduled to be published and sent {{gh-format-post-time this.post.publishedAtUTC scheduled=true}}</span>
-            <span class="gh-schedule-subtext">&dash; {{this.subText}}</span>
-        </p>
-    {{else}}
-        <p>
-            {{this.subText}}
-        </p>
-    {{/if}}
+    <p>
+        <span class="gh-content-entry-meta">
+            By <span class="midgrey-l2 fw5">{{this.authorNames}}</span>
+            
+            {{#if this.primaryTag}}
+                in <span class="midgrey-l2 fw5">{{this.primaryTag}}</span>
+            {{/if}}
+
+            {{#if isScheduled}}
+                – <span class="gh-schedule-time">Scheduled to be published and sent {{gh-format-post-time this.post.publishedAtUTC scheduled=true}}</span>
+            {{/if}}
+        </span>
+    </p>
 {{/link-to}}
 
 {{#link-to "editor.edit" this.post.displayName this.post.id class="permalink gh-list-data gh-post-list-status" title="Edit this post"}}
-    {{#if this.isScheduled}}
-    <span class="gh-content-status-draft gh-badge nowrap">
-        Scheduled
-    </span>
-    {{/if}}
+    <div class="flex items-center">
+        {{#if this.isScheduled}}
+        <span class="gh-content-status-draft gh-badge nowrap">
+            Scheduled
+        </span>
+        {{/if}}
 
-    {{#if this.isDraft}}
-    <span class="gh-content-status-draft gh-badge gh-badge-purple nowrap">
-        Draft
-    </span>
-    {{/if}}
+        {{#if this.isDraft}}
+        <span class="gh-content-status-draft gh-badge gh-badge-purple nowrap">
+            Draft
+        </span>
+        {{/if}}
 
-    {{#if (and this.isPublished (not this.post.page))}}
-    <span class="gh-content-status-published nowrap" title="Post has been sent by email">
-        Published
-    </span>
-    {{/if}}
+        {{#if (and this.isPublished (not this.post.page))}}
+        <span class="gh-content-status-published nowrap" title="Post has been sent by email">
+            Published
+        </span>
+        {{/if}}
+
+        {{#if (or this.post.email (and this.post.isScheduled this.post.sendEmailWhenPublished))}}
+        <span data-tooltip="Sent by email" class="gh-content-emailed">
+            {{svg-jar "send-email" class="stroke-midgrey"}}
+        </span>
+        {{/if}}
+    </div>
 {{/link-to}}
 
 {{#link-to "editor.edit" this.post.displayName this.post.id class="permalink gh-list-data gh-post-list-updated" title="Edit this post"}}
     <span class="nowrap">{{gh-format-post-time this.post.updatedAtUTC draft=true}}</span>
-{{/link-to}}
-
-{{#link-to "editor.edit" this.post.displayName this.post.id class="permalink gh-list-data gh-post-list-author" title="Edit this post"}}
-    <span class="gh-content-entry-author">{{this.authorNames}}</span>
-{{/link-to}}
-
-{{#link-to "editor.edit" this.post.displayName this.post.id class="permalink gh-list-data gh-post-list-email" title="Post has been sent by email"}}
-    {{#if (or this.post.email (and this.post.isScheduled this.post.sendEmailWhenPublished))}}
-        {{svg-jar "email" class="w4 h4 fill-midgrey nudge-top--4"}}
-    {{/if}}
 {{/link-to}}

app/templates/pages.hbs

@@ -87,9 +87,8 @@
                 <li class="gh-list-row header">
                     <div class="gh-list-header no-padding">{{!--Favorite indicator column: no header--}}</div>
                     <div class="gh-list-header gh-posts-title-header">Title</div>
-                    <div class="gh-list-header">Status</div>
-                    <div class="gh-list-header">Last update</div>
-                    <div class="gh-list-header">Authors</div>
+                    <div class="gh-list-header gh-posts-status-header">Status</div>
+                    <div class="gh-list-header gh-posts-lastupdate-header">Last update</div>
                 </li>
             {{/if}}
 

app/templates/posts.hbs

@@ -87,10 +87,8 @@
                 <li class="gh-list-row header">
                     <div class="gh-list-header no-padding">{{!--Favorite indicator column: no header--}}</div>
                     <div class="gh-list-header gh-posts-title-header">Title</div>
-                    <div class="gh-list-header">Status</div>
-                    <div class="gh-list-header">Last update</div>
-                    <div class="gh-list-header">Authors</div>
-                    <div class="gh-list-header no-padding"></div>
+                    <div class="gh-list-header gh-posts-status-header">Status</div>
+                    <div class="gh-list-header gh-posts-lastupdate-header">Last update</div>
                 </li>
             {{/if}}
 

public/assets/icons/send-email.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs><style>.a{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px}</style></defs><title>send-email</title><path class="a" d="M2.759 15.629a1.664 1.664 0 0 1-.882-3.075L20.36 1a1.663 1.663 0 0 1 2.516 1.72l-3.6 19.173a1.664 1.664 0 0 1-2.966.691l-5.21-6.955z"/><path class="a" d="M11.1 15.629H8.6V20.8a1.663 1.663 0 0 0 2.6 1.374l3.178-2.166zM11.099 15.629l11.08-14.59"/></svg>